React + Redux + Firebaseで作るTodo App - Qiita
最初に 先日、フロントエンジニアが今話題のFirebaseについて語りたいという記事を投稿しました。 予想以上の方にストック頂き、とても嬉しい反面驚きがすごいです。 改めてFirebaseは注目されてるサービスで、サーバーレスアーキテクチャはフロントエンドエンジニア & アプリ開発者の夢なんだなぁと実感しました。 ポエミーで長い記事になってましたが、 設計&具体的な実装については一切触れていなかったので、その辺りを書きたいと思います。 まだまだ勉強中の身のため、ご指摘いただけると幸いです。 アプリ構成 React.js (UI) Redux (データフロー) Firease (ホスティング + データベース) でTodo Appを作りたいと思います。 キモは、 Firebaseのデプロイ データベースと連携 です。 React + Reduxで作るのはスキルセットがそうなのに加えて、Red
ReactとRailsの関係性とサンプルアプリケーションのまとめ - Qiita
RailsのフロントエンドのJSフレームワーク(ライブラリ)として最近話題のReactJSを採用することを考える その際、ReactとRailsとの関係性にいくつかのパターンがありえるので、そのパターンを紹介したいと思います ポイントは、どこまでReactとRailsを密接に関係させるか 大きくは、次の3つのパターンに分けられます 1.RailsのViewの中にReactを埋め込む方法 2.Railsプロジェクトの中にReactのフロントエンドアプリを埋め込む方法 3.Rails APIとReactのフロントエンドアプリを別々にする方法 以下では、少し詳しくこれらのパターンを見ていきます どれが良いとかいうのは、それぞれのPros&Consがあるので、一概には言えないと思いますが、そのプロジェクトのニーズに合わせて適切な選択をしていくんだと思います 他にもこういうパターンがあるとか、間違っ
人気のFluxフレームワークReduxをさわってみた - マルシテイア
fluxフレームワーク、今は Redux が一番アツい様子なので触ってみた。 github.com (追記 2015-10-03 18:15 APIや用語が大幅に変わったので更新した) Redux の経緯 2015-05-30 に公開された "The Evolution of Flux Framework" という記事がある。 medium.com Reduxはその PoC 的な実装だったんだけど、実用的ということでめっちゃ流行っているみたい。 Initial commit も 2015-05-30 だった。 Initial commit · rackt/redux@8bc1465 · GitHub 最近の flux フレームワークだと fluxible と flummox が人気だったけど、 flummoxのページには 4.0 will likely be the last major
Redux入門【ダイジェスト版】10分で理解するReduxの基礎 - Qiita
ReduxのGithubドキュメントを基に入門用記事として書いたものを、簡潔にまとめました。 もと記事はこちらです。 Redux入門 1日目 Reduxとは Redux入門 2日目 Reduxの基本・Actions Redux入門 3日目 Reduxの基本・Reducers Redux入門 4日目 Reduxの基本・Stores Redux入門 5日目 Reduxの基本・Data Flow Redux入門 6日目 ReduxとReactの連携 Reduxとは Reduxは、ReactJSが扱うUIのstate(状態)を管理をするためのフレームワークです。Reactではstateの管理するデータフローにFluxを提案していますが、ReduxはFluxの概念を拡張してより扱いやすく設計されています。 Reduxはstateを管理するためのライブラリーなので、React以外にもAngularJS
Electron + React + Redux - KAYAC engineers' blog
JSで書くデスクトップアプリが熱い Electron 熱いです。 Atom を始め、Qiita の Kobito や Slack など、 十分に実用できるアプリケーションが登場しはじめています。 なにかと話題のRPGツクールMVは、NW.js（旧node-webkit）ですが、これもJSで書かれていますね。 NW.js は、その他、女の子といちゃこらする系のゲームでも使われています。 JS でデスクトップアプリを書いて、うん千万売り上げるのも、もはや絵空事ではありません。 今回は、Electron と Redux、React の組み合わせで、 デスクトップアプリを作るまでの、簡単なチュートリアルを書きます。 登場人物紹介 Electron Github が開発してる、JS でデスクトップアプリが書けるすごいやつ NW.js より活発そうですごい React Facebook 製のすごいやつ
React.Component – React
These docs are old and won’t be updated. Go to react.dev for the new React docs. These new documentation pages teach modern React: React.Component This page contains a detailed API reference for the React component class definition. It assumes you’re familiar with fundamental React concepts, such as Components and Props, as well as State and Lifecycle. If you’re not, read them first. Overview Reac
公開されているReact Componentを利用してみる - Qiita
今回はちょっと趣向を変えて公開されているComponentの利用について書きたいと思います。 Componentは基本的にはPropがI/Fとなっているのでドキュメントを見てよくわからなかった場合は、Propを見るとどのようなI/Fがあるかわかると思います。 自分が公開する場合は、PropTypesやgetDefaultPropsを使ってI/Fを明確にしておくといいと思います。 Bootstrap 何はともあれまずは定番のBootstrapですがやはりちゃんとあります。 前回のRouterのサンプルでも使っていました。 使う場合は、react-bootstrapの他に別途bootstrapのCSSを読み込む必要があります。 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/boo
railsでreact(react-rails)とreduxを動かす - Qiita
流行りのfluxフレームワークreduxとreact-railsを試してみる。 reduxのexamplesにある、counterをreact-railsを使って書いてみます。 https://github.com/rackt/redux/tree/master/examples/counter ※以下のバージョンで書いてます。 rails 4.2.3 redux 3.0.4 react-rails 1.4.2 react 0.14.2 ソースは以下におきました。 ソースは@odk211さんからPR頂いてbabel6を使ったものになってます。 https://github.com/suzan2go/react-rails-redux-sample 事前準備 browserify-railsのインストール Gemfileに以下を追加してbundle installしましょう。
react-railsを使ってReactのTutorialをやってみる - Qiita
はじめに react-railsという、ReactをAsset Pipelineに乗せて使えるようにしてくれるruby gemsがある。 この記事では、これを使用してReactの公式tutorialを進めていく。 公式のtutorialではサーバ側はすでに実装済みとして進んでいる。 今回はせっかくなのでtutorialを進める中でサーバ側も実装していくことにする。 ちなみに使ってみた個人的な感想としては、RailsのAsset Pipelineに乗せるならすごく順当かなー、という感じ。 browserifyを使いたい。bowerもオワコンと呼ばれてしまう。そんなこの時代。 Asset Pipelineは捨てたい感じがあるけど、既存のアプリケーションを徐々にReactコンポーネント化していく、みたいな時には良いと思う。 方針 きまぐれで、必要そうなところはReactの説明する。けど英訳とかは
入門 React
Facebookが開発したJavaScriptライブラリ「React」の解説書。本書では、サンプルアプリケーションを用いてReact.jsのすべての側面を解説します。「第I部 基礎」でReactコンポーネントの作成と合成を学び、Reactの基本的な使い方を理解します。「第II部 応用」ではワンランク上のコンポーネント作成について学びます。「第III部 ツール」ではReactと共に使用して堅牢なアプリケーションを実装するためのツールについて学びます。最後の「第IV部 実践」では大規模なアプリケーション開発に必要な知識やWeb以外のユースケースについて解説します。読者はコンポーネントベースの最新のフロントエンド開発についての体系的な知識と技術を身につけることができます。日本語翻訳版の本書ではReactの開発環境の構築手順とAPIリファレンスを巻末付録として収録。 目次 まえがき 第I部 基礎
React / Flux を実案件で使ってみた
自己紹介 Name : Takuto Wada github : twada twitter : t_wada hatena : t-wada TDD とライオンの人 power-assert の人 React / Flux を知ったきっかけ mizchi さんのエントリ (あなたがReactを使うべき理由) だったと思う 日本語の情報はほとんど無かったが、エッジ系の人たちが騒ぎ出した & 海外で圧倒的に事例が増え出したので興味を持った Rendr の AirBnb が React を使い始めたことを知り、これは決定的だと思った React をどう勉強したか 公式ドキュメントとチュートリアルが充実している まず Tutorial をそのまま写経 次に browserify + reactify で Tutorial をもう一周やってみる (showdownはbrowserify 対応してい
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
React-Rails with Flux (Alt.js) Tutorial | Open Minded Innovations
GitHub - shakacode/react_on_rails: Integration of React + Webpack + Rails + rails/webpacker including server-side rendering of React, enabling a better developer experience and faster client performance.