Presentation slides for State of React April 2022
Random musings on React, Redux, and more, by Redux maintainer Mark "acemarke" Erikson This is a post in the Blogged Answers series. Thoughts on how Redux testing has evolved from 'isolation' to 'integration' Introduction 🔗︎ I was just asked a question about how testing works for Redux applications: For a beginner front-end developer, what would you expect them to know about Redux testing? (techni
This release adds the new RTK Query data fetching APIs to Redux Toolkit. It also adds multiple new options to createAsyncThunk for including meta fields and working with results, updates dependencies to Redux 4.1 and Immer 9, and includes a complete rewrite of our build toolchain with additional "modern" build artifacts in the package. While this is a minor release in terms of semver, this is a hu
This release shrinks our bundle size via error message extraction, updates several error messages for clarity, and optimizes our list of runtime dependencies. Overall, version 4.1 shrinks from 2.6K min+gz to 1.6K min+gz thanks to these changes. Be sure to check out the Redux Toolkit 1.6 alpha containing our new "RTK Query" data fetching APIs! It also includes Redux 4.1 as a dependency. Changelog E
この記事は React Advent Calendar 13日目の記事です。 皆さん、react-redux の hooks を使っていますか? react-redux は v7.1 より useDispatch useSelector などいくつかの hooks が導入されました。 界隈ではどちらかというと、mapStateToProps の冗長さを置き換えるもの、あるいは Container / Presentation コンポーネント の区別を不要にするものとして注目されている感があります。実際、useSelector によって可能になった設計論は重要です。 しかし本記事ではそれらと違う観点、つまり「設計に失敗した Redux を立て直すための武器として react-redux の hooks がスゴい!」という方向からの解説を行います。 以下、redux のミドルウェアとして re
Redux Toolkitとは、Reduxのエコシステムの集大成である Redux ToolkitはReduxのエコシステムから選りすぐりの技術を集大成したライブラリ。単にReduxのボイラープレートを減らすだけのライブラリではない。 以下ではRedux Toolkitの構成要素となるライブラリの基本的な使い方を確認していく。注意して頂きたいのは、以下の記述はRedux Toolkitでの書き方ではない点だ(それなら公式ドキュメントをご覧いただくのが一番である)。 複雑なものに遭遇したときは常に基本に立ち返るのが一番だ。 reselect: Storeから値を取得する処理をメモ化する reselectは関数をメモ化をする、1ファイル100行程度の薄いライブラリ。Storeから必要な値を取得するためのロジックを記述する。使い方はテストを見てもらうのが良い(memoized composite
Next.js といえば、SSG(JAMstack)が最近は特に話題ですね。1年前まではgetInitialPropsを用いて、どう SSR するのかという事が話題の中心でした。Next.js 9.3 以降、SSR をする際にはgetInitialPropsではなくgetServerSidePropsを使用することを推奨すると記載されています。(そして、getInitialPropsを使用することで自動最適化が無効となってしまう旨も)getStaticPropsやgetServerSidePropsを利用することで、私たちは SSG・SSR をページ単位で切り替えることができます。 「SSG・SSR」が共存する可能性がある場合、SSR にはgetServerSidePropsを利用することになります。この変化による影響範囲は多大で、状態管理とデータフェッチについて、再考する必要がでてきまし
createSlice の課題点 Redux を導入する場合、ReduxToolkit を利用するシーンは多いと思います。そのなかで議論にあがるのが「createSliceを利用するか」という点です。以前Twitterでとったアンケートからも、意見が別れていることがみてとれます。 createSlice は ActionType・ActionCreator・Reducer を一度に宣言できるため大変便利で、簡略化のために利用されている方は多いと思います。 しかし筆者はこれまで、型観点で懸念があり、使用を控えていました。createSliceで作成されたactionsからは、Action型を推論できないためです。この点については、公式ドキュメントでも言及されているため、以下引用します。 As TS cannot combine two string literals (slice.name
この記事はComplete Guide to React Rendering Behaviorの翻訳記事になっています。 ご本人(Markさん)にも許可を頂いて翻訳しております。 こちらの記事がReactのレンダリングを理解する上で今までで一番体系的で一番分かりやすかったので、ぜひ紹介したく翻訳させて頂きました。 翻訳ツールにもたくさん助けてもらいながら行い、意訳が出来ていない部分が多々あるかと思いますので修正依頼を出して頂けると幸いです! Twitterでも、フロントエンドに関する事や、アメリカでのエンジニア経験に関してツイートしているので、よかったらフォローお願いします。 Twitter: @hellokenta_ja 下記から本文です。 Complete Guide to React Rendering Behavior この記事は、Reactレンダリングがどのように振る舞うか、Co
My team has been using Redux for a couple of months now. Along the way I've occasionally found myself thinking about a feature and wondering "does this belong in an action-creator or a reducer?". The documentation seems a bit vague on this fact. (Or perhaps I've just missed where it's covered, in which case I apologize.) But as I've written more code and more tests I've come to have stronger opini
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く