You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
Redux Advent Calendar 2016 23日目 初めてAdvent Calendarに参加させていただきます。 当初はReduxとcreate-react-appを使って、サクッと素振りできる環境構築手順をまとめようと思ったのですが、ここ最近で自分が一番悩んだ「react-redux」についてReduxを始める方へ同じドツボにはまらないようにという願いを込めて投稿させていただきました。 react-reduxとは? react-redux公式より引用 Official React bindings for Redux. Performant and flexible. React公式のReactとReduxをバインディングするライブラリ パフォーマンスと柔軟性があります ここで出て来る「柔軟性(flexible)」というのがこのライブラリが初見殺しと言われる所以となっており
When you're working with JavaScript applications, you'll most likely be using npm to install third-party packages to use inside your codebase... Packages are versioned, using a method called Semantic Versioning. The package manager npm uses semantic versioning to distribute new versions of packages, for your codebases to consume. Where Issues Occur When using npm to install packages for a project,
問題提起 (※タイトルはキャッチーなのにしましたが、Middleware全般の不要論ではありません。非同期処理において不要論です。) Redux使うときに非同期処理はどう書きますか? 「よくわからないけどMiddleware使うらしい」と思考停止していませんか? この記事では、Reduxは本来どのように扱うことを想定されているのかと、なぜ非同期処理の文脈でもMiddlewareが出てきたのか、そして「実はMiddleware無くても読みやすく書けるよね」という話をしていこうと思います。 Reduxでの設計を悩む人への個人的な解です。 (気になる・詳しく知りたい箇所などありましたらお気軽にコメントください) この記事のゴール ActionDispatcherという筆者が命名したクラスを使うことで、 複数の非同期処理を含むロジックでも読みやすく書ける ネットワーク通信などを含んでもテストがしや
🎉🎉 React Router v4 beta! 🎉🎉 Docs: https://t.co/xEsQD8H38v Code: https://t.co/VULptzNaQs Try it: npm i react-router@next We 😍 @reactnative! — MICHAEL JACKSON (@mjackson) 2017年1月30日 ということでreact-router@v4がalphaからbetaになった。 かなりアグレッシブに変更されていて色々変える所あったのでメモ 1 2 packageの分離 react-routerは下記の3パッケージに分離した react-router コア部分。 react-routerの利用者がこのパッケージをインストールする機会は無いかもしれない。 このパッケージに含まれるもの <Router> (多分直で使う事はないロー
「Front-End Developer Handbook 2017」がGitBookで無償公開。フロントエンドデベロッパーに求められるさまざまなスキル、要素技術、ツールなどを幅広く紹介する一冊 WebサイトやWebアプリケーションにおいて、ユーザーが操作する部分の開発を担う「フロントエンドデベロッパー」が扱う技術は急速に広がっています。 もちろんその基盤はHTML/CSS/JavaScriptにありますが、より高度で快適なユーザー体験を実現するにはその基盤となるHTTPやDNSといった下位レイヤの技術やSEOやUIデザイン、フォントといった細分化された専門性、そしてもちろんJavaScriptプログラミングやjQuery、React、Angularといったフレームワーク、JSONやAPIやパッケージマネージャ、ビルドツール、エディタやデバッガなどの周辺ツールとそのトレンドなど、とても一人
考察(その2) 各種デバイスのボタンイベント後に、visibilityChangeイベントが呼ばれページが非表示になったことは検知できた ただし、どの動作が行われたかは、検知できないみたい iOSの場合、ホームボタンのダブルタップでは、visibilityChangeイベントが呼ばれず、その後、電源ボタンを押してみたところ、visibilityChangeイベントが呼ばれた 結果まとめ 以上の検証結果からbeforeunload / pagehide / unloadイベントとPage Visibility APIを組み合わせるとページが非表示になる動作を大体捉えられることがわかった ページ遷移系のイベントは、とりあえず、pagehideかunloadを読んでおけば大丈夫 iOS8とかAndroid 4/6系でどう動くかは、確認していないので、そのうち確認する予定 サンプルコード // デ
2016年も進化し続けたフロントエンド開発ツール。Web Tools Weeklyのキュレーター・Louisが1年を振り返り、お気に入りのツールを紹介します。 1年が過ぎ、Webプラットホームでは予想どおり革新、いらだち、疲れとともに、開発者を支援する新しいツールやテクノロジーの大量リリースが爆発的に勢いを増しています。 ReactやAngularといったおなじみのツールがアップデートされた一方、Vue.jsなどの新しいツールも登場し、あっという間に大きな関心を集めました。 私はツールに焦点を当てたウィークリーニュースレターのキュレーションをしているので、調査中に途方もない量のツールに出会います。もちろん人気のツールにはある程度注意を向けますが、あまり注目されていないツールで興味深くかつ実用的なものも評価しています。 そこで昨年と同様、この記事でフロントエンド技術者向けツール分野の2016
JavaScript型チェッカーflowを使って、React+Reduxで簡単なカウンターのサンプルアプリケーションを組んでみたので、その際のいくつかのポイントなどをまとめておきます。 サンプルアプリについて ボタンを押したら数字がインクリメントされるタイプのよくあるサンプルプログラム。 GitHub: namikingsoft/react-redux-using-flow-example https://github.com/namikingsoft/react-redux-using-flow-example ソース周りのファイル構成 react-redux-using-flow-example |-- src | |-- actions | | `-- counter.js # カウンターアクションの定義 | |-- components | | `-- Button.js # ボタ
API Provider Makes the Redux store available to the connect() calls in the component hierarchy below. Normally, you can’t use connect() without wrapping a parent or ancestor component in <Provider>. If you really need to, you can manually pass store as a prop to every connect()ed component, but we only recommend to do this for stubbing store in unit tests, or in non-fully-React codebases. Normally
※ Presentational and Container Components - なっく日報 に補足を書きました。 概要 http://rackt.github.io/redux/docs/basics/UsageWithReact.html medium.com らへんに書いてある「Smart Components」「Dumb Components」を理解したよというお話です。 ポイント 以下、個人的な解釈です(ツッコミどころあればどうぞ!) VとCを切り離す ReduxとかFlux系ライブラリへの依存を切り離す あたりがポイントかなと。 VとCを切り離す Reactコンポーネントは 気をつけないと、MVCでいうところのVとCを兼ねた作りになりがち(Fluxアーキテクチャを採ったとしても!) 以下のように別々にわけるとより良い作りになる コントローラ的なコンポーネント(Smart
成果物 github.com 目的 ReduxとES6への入門。 React.jsを(ようやく)触る機会が出て、情報量の多いFluxxorとCoffeeScriptで入門してた。 いろいろ情報を集めると、flummoxが人気!!みたいなのを見て、覗いてみたら4.0 will likely be the last major release. Use Redux instead. It's really great.って書いてあってReduxを触ってみることにした。exampleとawesome-reduxを眺めたらどれも当たり前のようにES6で書かれていて、合わせて入門することにした。 Redux概要 まだかなり理解が怪しいんだけど、以下の図がイメージしやすかった。 André Staltz - Unidirectional User Interface Architecturesより S
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く