JavaScriptをがんばるブログ

React,OSS,ソフトウェア開発が中心のブログです👨‍💻

ReactアプリにそもそもFluxアーキテクチャを採用するか JS日報 2017/11/6

読んだもの

redux-from-twitter-hype-to-production

slides.com

JSier.infoで紹介されていた記事です。 数あるRedux図解の中でもピカイチの分かりやすさ & API通信についても触れているので保存しておきたいです。

The React Source Code: a Beginner’s Walkthrough I

https://medium.com/@ericchurchill/the-react-source-code-a-beginners-walkthrough-i-7240e86f3030

line by lineでReactのソースを解説してくれている、のであとで読みたい。

How to debug Front-end: Console

https://blog.pragmatists.com/how-to-debug-front-end-console-3456e4ee5504

console.table()console.group()で視覚的にログを出せるのは知らなかった。

From Zero to Production with Angular, Firebase, and GitLab CI

https://hackernoon.com/from-zero-to-production-with-angular-firebase-and-gitlab-ci-598181cfc6e5

firebaseでAngularアプリを立ち上げる手順を紹介する記事。

Painting with Code

Painting with Code – Airbnb Design

React-sketchappの紹介記事。
ReactのコードをSketchにエクスポートするライブラリですが、似たようなReact -> デザインドキュメント生成ツールであるstorybookとどのように使い分けたら良いのか解らないですね〜。 そもそもairbnbのデザインフローが解ってません、普通にやるとSketch -> Reactというワークフローですよね。

まとめ

最近Reduxというか、Fluxパターンでアプリを作るメリットについて探っています。
というのも設計力が高いチームでないとStoreが肥大化してカオスになりやすいのかなぁという懸念が。
Reactのstateを主体にcomponentのスコープにデータを閉じ込め、component間を跨ぐデータ共有だけMobXやreact-easy-storeで行うやり方の方が堅実な気がしているので。
理想的にはアプリケーションの状態を全て正確にReduxのStateとして定義し、Stateが決定すればアプリの状態が求まるべきでそうすればFlux、Redux DevToolsの力を100%発揮できのだが、
実際の案件でそこまで手が回るのかという疑問。(netflix,airbnb,facebookなら...)

あとはそろそろFirebaseの使い方を一通り覚えたいですね。
デプロイ、DB、認証、サーバサイドロジック、アナリティクス、スケールアウトetc...機能がてんこ盛りすぎて良く解らないです。
バックエンドはRailsなどの伝統的なMVCフレームワークよりもまずはFirebaseを検討する時代が来たのかなぁと思います。