JS 状態管理ライブラリ探索記 - Introduction
これから何回かに分けて、Redux に代表される JS の状態管理ライブラリをいくつか見ていきます。 早速本題に入りたいところですが、その前になぜいくつもライブラリを知っていた方がいいのか、当たり前のように思うことをあえて考えてみる必要があります。 なぜなら、状態管理ライブラリがたくさんあるために、次のような疑問が出てくるからです。 どれでも好きなものを使えば開発がうまくいくのか？ 今までうまくいっていたライブラリを使い続ければ今後もうまくいくのか？ 選ぶとしても、何を基準に選べば良いのか？ 今回は少し立ち止ってこういった疑問について考えてみます。 ではそもそも状態管理とは、一体何のために、何をすることなのでしょうか？ 状態管理が目指すもの – 読みやすさの基本定理 状態管理をする目的は様々ですが、最も大切なことはリーダブルコード（読まれて無い方は是非一読を！）の中で「読みやすさの基本定理
React/Redux/Node.jsのSSR/SPAを速くする6つのチューニングポイント
React/Redux/Node.jsのSSR/SPAを速くする6つのチューニングポイント：大規模ブログサイト表示速度改善 大解剖（終）（1/3 ページ） 2004年から続くブログサービス「アメブロ」が2016年9月にシステムをリニューアル。本連載では、そこで取り入れた主要な技術や、その効果を紹介していく。今回は、React/Redux/Node.jsを使ったIsomorphic JavaScript特有のパフォーマンスチューニング手法や実際にあった問題および、その解決方法について。 2004年から続くブログサービスである「アメブロ」は、2016年9月にシステムをリニューアルしました。本連載「大規模ブログサイト表示速度改善 大解剖」では、そこで取り入れた主要な技術や、その効果を紹介しています。 アメブロのリニューアルでは、React/Reduxを採用し、サーバサイドとフロントエンド両方での
たぶんこれが一番分かりやすいと思います React + Redux のフロー図解 - Qiita
【追記】 もうこれ古いから参考にしないでください https://t.co/mXtcc73Orf — もし Laravel が流行しなくなってこられてきてたとしたら、絶対に捨てられてこられてたと思うか (@mpyw) January 26, 2021 Redux にはその昔 connect()() とかいうクソ API と， Redux-Saga とかいう宗教がありました という考古学です — もし Laravel が流行しなくなってこられてきてたとしたら、絶対に捨てられてこられてたと思うか (@mpyw) January 26, 2021 読者対象 Tutorial: Intro To React - React Example: Todo List · Redux 「チュートリアルそれぞれ一周した！Reactは何とか理解できたが，Reduxがさっぱりわかんねぇ！」 ぐらいの人向け。自分
Learn Redux by coding a Mini-Redux
There are lots of resources for learning Redux. There is the official documentation, examples, tutorials, blog posts, boilerplates, Youtube videos, podcasts, etc… The list goes on. Even though we have so many great resources to learn from, new developers coming in still sometimes gets confused. It’s an overwhelming amount of content and it can be difficult to filter out the relevant stuff. A diffe
React Redux Real World Examples 〜先人から学ぶReact Reduxの知恵〜
React Reduxを使ってプロダクトを作りはじめて、かれこれ半年くらい経ちます。 しかし、どうもうまく書けていない気がすることがときどきあり、悩んでいたところ、ツイッターで次のような助言をもらいました。 @__tai2__ 達人かどうかは微妙なところがありますが、ある程度の規模のコードはここにリンク集あります https://t.co/B79B5s1DTe — Yuki Kodama (@kuy) 8 December 2016 この記事は、上記のリンク集でまとめられている実際のReact Reduxプロダクトのソースコードを調査することで、筆者がふだんReact Reduxで開発をしていて感じる疑問への答えを探る試みです。 筆者が答えを得たいと思っている疑問は次の3つです 1 Storeはどんな具合に階層化すべきか Store初期化(hydration)用データの定義はどうすべきか
React.js・ReactNative・Redux入門
Feb 9, 2017Download as pptx, pdf24 likes8,612 views
ReduxでのMiddleware不要論 - Qiita
問題提起 （※タイトルはキャッチーなのにしましたが、Middleware全般の不要論ではありません。非同期処理において不要論です。） Redux使うときに非同期処理はどう書きますか？ 「よくわからないけどMiddleware使うらしい」と思考停止していませんか？ この記事では、Reduxは本来どのように扱うことを想定されているのかと、なぜ非同期処理の文脈でもMiddlewareが出てきたのか、そして「実はMiddleware無くても読みやすく書けるよね」という話をしていこうと思います。 Reduxでの設計を悩む人への個人的な解です。 （気になる・詳しく知りたい箇所などありましたらお気軽にコメントください） この記事のゴール ActionDispatcherという筆者が命名したクラスを使うことで、 複数の非同期処理を含むロジックでも読みやすく書ける ネットワーク通信などを含んでもテストがしや
Vue + Vuex を使ってみた感想と、Redux との比較 - Toro_Unit
いいにくの日ですね。肉食べたいです。 React + Redux にはよくお世話になっている昨今なのですが、React 以外も扱いたいなと思ったこと、そもそも Flux に対する理解が浅いんじゃ無いか？ということで、Vue.js + Vuex をちょっと勉強してみました。 つくったもの：https://github.com/torounit/vuex-todo ここら辺をいろいろ参考にしました。 Vuex のドキュメント Vue.js用のFluxライクなライブラリVuexを試してみる – Qiita Vue.js + Vuexで開発をしてみよう！ – Tech Blog – Recruit Lifestyle Engineer Redux と Vuex の違い。Reducer と Mutation の違い。 両方とも Flux パターンであるため、基本的な考え方は変わりません。ただ、Red
React with Reduxによる大規模商用サービスの開発 / nodefest2016
東京Node学園祭2016で話したブッキングテーブルのやつ
Reduxのパターンとアンチパターン | POSTD
Redux は、 Flux のようなアーキテクチャを使用してアプリケーションの状態を管理できる非常にシンプルなライブラリです。私たち Affirm では今、 Reduxのタイムトラベル機能 に注目しています。Affirmの主要事業は、透明性の高い消費者ローンを提供することなので、ローン申し込み時の全過程をユーザ視点で再現できると非常に有用なのです。 Reduxはフレームワークというよりも、パターンの適用に役立つ関数セットです。よって、適切なパターンを慎重に適用しないと、Reduxを使ったことを後悔する結果になりかねません。この記事では、Affirmで確立したReduxのベストプラクティスや、ミスを犯しやすいポイントについて説明します。 ImmutableJS ImmutableJS は、不変の永続データ構造を扱うためのライブラリです。私たちがこのライブラリを好んで使う理由は2つあります。
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
React使い必見！ Immutable.jsでReactはもっと良くなる | Wantedly Engineer Blog
Reactを導入して半年近くが経ちましたWantedlyでは、今年の初めからReact(+Redux)の導入に取り組み始めたので、気付けば半年近く立っていることになります。今自分がこの記事を書いているエディタから、Wantedly Adminのチケット画面まで、ある程度大きなアプリケーションを開発してきました。 そこで今回は、チームで継続的に開発していく過程で遭遇した問題と、それを解決するために導入したImmutable.jsについて紹介します。 増え続けるCallbackとAction、肥大化するStoreReactとセットで語られることが多いFluxアーキテクチャ。ここでは詳しい説明は省略しますが、とてもシンプルな考え方なので、チュートリアルなどで簡単に学ぶことができます。しかし、実際にチームで開発していくと、たしかに動いてはいるけど、綺麗とは言い難いコードが増えてしまいました。 Ac
なぜReduxを使うのか
From Subtype Polymorphism To Typeclass-based Ad hoc Polymorphism�- An Example
10年のツケを支払ったフロント界隈におけるJavaScript開発環境（2016年4月現在）。 - 日々、とんは語る。
2015年はCSSが普及した以来となる10年に1度のフロントエンド大変革期で、それまでのツケが一気に回ってきたと個人的に感じていました。目まぐるしく状況が変化していきましたが、2016年になり、個人的にだいぶ落ち着いてきたと感じているので、ここらへんでまとめておきたい思います。 最初に結論を書いておくと、 『React + Redux + react-router + material-ui + axios + ES2015 + Babel + webpack + ESLint + Airbnb JavaScript Style Guide』 という組み合わせが、いま僕の採用しているJavaScriptの環境です。 主要ライブラリは React A JavaScript library for building user interfaces | React 去年、一気に普及したReact
Angular 2で作った最初のアプリの事後分析 : 使ってわかったAngular 2の長所と短所 | POSTD
最近、Angular 2を使ってWebアプリ作成の手伝いをする機会がありました。このフレームワークの複雑さに戸惑いもありましたが、Angular 2は間違いなくすばらしいものです。この事後分析では私がAngular 2のフレームワークを使った時に感じたいい面と悪い面の両方を掘り下げていくことにします。 Angular 2 Angularは携帯電話やデスクトップのWebアプリケーションを作成するための開発プラットホーム。 https://angular.io/ Angular 2＋リアクティブプログラミング＝❤ 私はすでに、Angular 1アプリケーション ではRxJSをかなり使っていました。特に、サービス間のメッセージ・バスを行うアプリを作成する時です。Angular 2はObservableを非常によくサポートしているので、アプリ全体にリアクティブプログラミングを取り入れることができ、
React Redux Rails - (rudolph-miller)
React.js & Redux & Ruby on Railsでserver-side rendering. この記事はReact.js Advent Calendar 2015の10日目の記事であり、 仮想DOM/Flux Advent Calendar 2015の10日目の記事です. (欲張り.) Source codeはReact Rails Example. React Redux Rails See Also React Redux Rails React.js React.jsはFacebook製のJavaScriptのUI Library. Viewの状態管理をさぼれる. React.js 一人React.js Advent Calendar 2014 Redux Reduxは今一番熱いFlux architecture frameworkで状態管理をatomitにする.
Redux入門 6日目 ReduxとReactの連携(公式ドキュメント和訳) - Qiita
前回 Redux入門 5日目 Reduxの基本・Data Flow ReduxのアプリケーションはReact,Angular,Ember,jQuery, vanilla JavaScriptのいずれで作成することができます。 ReactはUIをstateの関数として扱うので特に相性がいいです。 ここからは、Reactを使ってtodoアプリに連携していきます。 Installing React Redux ReactとReduxを連携するモジュールはReduxに含まれていないので、別途インストールする必要があります。 Container and Presentational Components Reactのコンポーネントの設計として、一番上のレイヤーのコンポーネントはコンテナとしてReduxに関与し、下位のレイヤーのコンポーネントはReduxとは関与せずに、データはprop経由で受け取るよ
人気の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
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
「後付の型システム」の活用についてFlowtypeとReduxから考える - Qiita