redux-sagaで非同期処理と戦う - Qiita
はじめに ReduxはSingle Store、immutableなState、副作用のないReducerという３つの原則を掲げたFluxフレームワークです。しかし他のフレームワークと違って提供しているものは最小限で、とてもフルスタックとは言えない薄さです。そのためすべてにおいて定番と言える書き方が定まっているわけでもなく、どうしようか迷ってしまうことも少なくありません。その筆頭とも言えるのが 非同期処理 の扱いです。コミュニティでは今でもさまざまな方向に模索が続いていますが、よく使われているものだとredux-thunk、redux-promiseあたりでしょうか。Reduxに限定しないのであればreact-side-effectというものもあります。こちらはTwitterのモバイルウェブ版で使われていますね。どれを使っても非同期処理が可能になりますが、それはあくまで道具であって、設計の
りだっくすさが(redux-saga)に入門する - wadackel.me
Web アプリを構築したくて久し振りに React を触ってみると、前に少し触っていたのにすっかり忘れてしまっていました。圧倒的に記憶力が低いので、継続的に触っていないと中々覚えられません…。 今だと Angular2 がグイグイ来てたりしてますが、それよりも一度触ったことのある React+Redux を使った方が学習コストを抑えられるな、という訳で再度勉強中です。 改めて色々と調べていると、redux-sagaという Redux の Middleware が非同期処理を書きやすく出来るぞ！との事だったので、まずはシンプルなカウンターサンプルの実装をして感じを掴んでいきたいと思います。 最後の 参考 にもあげていますが、そもそも redux-saga とは一体何者なんだ？というところにおいて、以下の記事が大変参考になりました。 redux-saga で非同期処理と戦う - Qiita ま
さいきんReact, Reduxでやっている設計 - しゅみは人間の分析です
はじめに ブラウザでGUIアプリケーションを作らなくても良い牧歌的な時代は終わりつつあります。個人的な意見としてはブラウザはドキュメントビューアのままでいて、複雑なGUIアプリケーションはネイティブアプリケーションとして実装されてほしいのですが、そうは言ってもお仕事で人間にとって負担の低いUIを作っていく必要があるのです。 Railsでサーバアプリケーションを書きつつ管理画面はネイティブでなんてことはコスト的に実現できません。かといって長期的に運用されるシステムを作ると、システムを運用するためのUIが操作しやすいに越したことはありません。Bootstrapを使っててきとうなフォームを並べただけの画面を作って怒られた経験はありませんか？ たとえサーバ開発者だとしても、我々は使いやすいUIを求め続ける必要があります。 react, redux 複雑なGUIを作るためのフレームワークも乱立の時代
Redux & Immutable.js Take Center Stage
November 17, 2015 / Michelle Gross Redux and Immutable.js Take Center Stage With over 600,000 downloads in the last month from npm,�React�has risen in prominence to become one of the favorite libraries for building dynamic applications. Unlike other frameworks used for making dynamic applications like�Angular�or�Ember, React just provides provides the ‘view’ portion of the application and leaves t
redux-actionsを使って、reduxの記述で楽をしよう！ - Qiita
今日はredux-actions（記載時点ではv2.0.1）という公式推奨パッケージを使って、 reduxのactionとreducerを楽にスッキリ書く方法を紹介します。 追記：現在は公式のドキュメントができているので、こちらを参照するとより確実です。 https://redux-actions.js.org/docs/api/index.html アクションの形式 reducerを書く際に下記の形式（※1）を知っている必要があります。 { type : {symbol|string}, // アクションタイプ payload : {any}, // メインの情報 error : {boolean}, // エラーかどうか meta : {any}, // payloadに乗らなかった情報 } import { createActions } from 'redux-actions';
Redux: Actionのコーディング規約 と redux-actions - Qiita
概要 Redux / Flux の Action にはオブジェクトであれば何を指定しても大丈夫ですが、非公式のコーディング規約(flux-standard-action)があり、Redux の公式ドキュメントでもこのコーディング規約に従うことを奨励しています。 redux-actions を使って、サンプルコードをコーディング規約に従った Action に修正します。 準備 Middleware編 の続き(tag/middleware)を使います。 Action の構造 flux-standard-action の規約では Action は次のような構造のオブジェクトになります。 { type: FOO_TYPE, // must payload: {object}, // optional meta: {object}, // optional error: false, true, u
電卓アプリで学ぶReact/Redux入門(基礎知識編) - Qiita
はじめに 今回の記事は「電卓アプリで学ぶReact/Redux入門(実装編)」を読む前に知っておいたほうがいいReact.jsとReduxの概要についてまとめた記事になります。 特に状態管理の部分がReact/Reduxのアプリケーションを作成する上で重要になってくるので、React.jsの話は最小限にとどめ、Reduxの話を中心に説明をしたいと思います。 React.jsとは まずReduxの説明をする前にReact.jsについて説明をします。 React.jsとは、MVCモデルでいうところのV(View)の部分の役割に特化したJavaScriptで書かれたライブラリです。よくReact.jsと比較されるAngular.jsはMVC全ての役割を担います。 Viewのみの役割を提供するということもあり、学習コストが低く、それがReact.jsのメリットでもあります。 Component R
電卓アプリで学ぶReact/Redux入門(実装編) - Qiita
はじめに React.jsとReduxを理解するために簡単な電卓アプリを作成しました。 今回はWelcome to Reactから始まり、実際にReact/Reduxで電卓アプリを作るまでの手順を説明したいと思います。 特にReduxのデータフローについては言葉や図だけではよくわからないと思うので、電卓アプリを実際に作成することで少しでも理解の助けになればいいなと思っております。 今回の記事では実装がメインとなっているため、React.jsやReduxの概念などについては省略しております。基礎的な部分を理解したい方は「Reduxの電卓アプリで学ぶReact/Redux入門(基礎知識編)」を読んでからこちらの記事を読むと理解がしやすいかと思います。 電卓アプリはcreate-react-appをベースに作成し、簡単のために加算の機能のみ作ります。 create-react-appについて ま
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://post.simplie.jp/posts/81