--- title: "17 minutes to build up your 'React brain'" publication: "React Status" issue: 308 published_at: "2022-10-05" canonical_url: "https://react.statuscode.com/issues/308" --- Plus revisiting React rendering behavior, and the component library we missed. | #​308 — October 5, 2022 [Read on the Web](https://react.statuscode.com/issues/308) Together with [![logo\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,w_320,h_100/e_make_transparent/co_white,e_outline:4/kishpd4z3cddmgekpc7p.png)](https://kontent.ai/developers/?utm_source=reactstatus&utm_medium=cooperpress_newsletter&utm_campaign=q2_newsletter_cooperpress) React Status [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/isaazniq3m7p1dmfebp3.jpg)](https://blog.isquaredsoftware.com/2020/05/blogged-answers-a-mostly-complete-guide-to-react-rendering-behavior/) [A (Mostly) Complete Guide to React Rendering Behavior _Redux_](https://blog.isquaredsoftware.com/2020/05/blogged-answers-a-mostly-complete-guide-to-react-rendering-behavior/) — Dig into the details of React rendering behavior and how Context and React-Redux affect said rendering. Just 861 days ago, this was a very popular item in _React Status_ and Mark has made [a big 2022 update](https://twitter.com/acemarke/status/1577301648850014210) bringing it up to React 18 standards (_automatic batching, concurrent rendering.._) Mark Erikson ▶[`useState`: Is it Asynchronous or.. Not?](https://www.youtube.com/watch?v=RAJD4KpX8LA) — Jack admits up front that the answer is.. _it’s complicated._ He digs into an example to help you ‘build your React brain’ by exploring what’s really going on behind the scenes, noting that the state setter is very much synchronous but resulting renders can act asynchronously. _(17 minutes.)_ Jack Herrington [![\](https://copm.s3.amazonaws.com/19e44164.png)](https://kontent.ai/developers/?utm_source=reactstatus&utm_medium=cooperpress_newsletter&utm_campaign=q2_newsletter_cooperpress) [Headless CMS with World-Class TypeScript Support](https://kontent.ai/developers/?utm_source=reactstatus&utm_medium=cooperpress_newsletter&utm_campaign=q2_newsletter_cooperpress) — Kontent.ai is the leading platform for modular content. Streamline your code using TypeScript SDK, CLI, Rich text resolver, and strongly typed model generator. Scale with no problems when your project grows. Have you seen our UI? Kontent.ai sponsor [Getting Started with TanStack's React Query](https://dev.to/nischal_dutt/getting-started-with-react-query-30g7) — The first part of a six part series aiming to be the definitive tutorial on TanStack’s [Query V4](https://tanstack.com/query/v4), sometimes called React’s _“missing data fetching library”._ Nischal Dutt [How to Write Your Own State Management Library](https://judehunter.dev/blog/how-to-write-your-own-state-management-library) — The goal isn’t to replace existing options, but to learn the principles. If you’ve wondered what ‘magic’ is happening behind the scenes of things like Redux, Zustand or Jotai, this will help build up your mental model. Jude Hunter ▶[Full Stack for Front-End Developers: Build Your First AWS Amplify and React App](https://amplify.aws/learn/) — Well-regarded educator [Ali Spittel](https://amplify.aws/learn/about/aspittel), who leads Developer Advocacy at AWS’s [Amplify](https://aws.amazon.com/amplify/) division, has just rolled the first in a series of free, full courses on end-to-end development using the Amplify platform. Check out the [brief trailer](https://www.youtube.com/watch?v=zLb-ND8aGT8). Ali Spittel (AWS Amplify) [Making React Fast by Default with _Legend-State_](https://legendapp.com/open-source/legend-state/) — “_React renders too much, too often_” kicks this off, before working through a series of steps toward the goal of getting “_React to render only once_”. The result is a state manager that digs deep into React’s internals — but you might appreciate their fresh take on things. [GitHub repo](https://github.com/LegendApp/legend-state). Jay Meistrich [Using Vitest with React Testing Library](https://www.robinwieruch.de/vitest-react-testing-library/) Robin Wieruch Jobs [Full-Stack Engineer (NYC / Remote)](https://apply.workable.com/j/E0E1B15339) — 100M+ devices, 100B+ API calls. Radar is looking for Product Engineers to build geospatial dev tools. Radar [Software Engineer](https://www.stickermule.com/career/6de4ccd8-7e58-4b65-9a25-62354972bdbd) — Join our "kick ass" team. Our software team operates from 17 countries and we're always looking for more exceptional engineers. Stickermule [Senior Frontend Engineer (EU Remote or Relocate to Berlin)](https://feather-insurance.com/careers/senior-frontend-engineer?channel_id=921905) — We’ve built a product thousands of people love (see Trustpilot if you don’t believe us). We need your help with **React & TypeScript**. Feather [Find React Jobs with Hired](https://hired.com/join/?utm_source=newsletter&utm_medium=sponsor&utm_campaign=%28b2c%29%28l-all%29%28r-all%29%28cooper-reactstatus%29&utm_content=find-your-next-job) — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It's free for job-seekers. Hired 🛠 Code and Tools [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/bs6zotncijqk5jjszapz.jpg)](https://www.radix-ui.com/) [Radix UI: Unstyled Accessible Components to Build on Top Of](https://www.radix-ui.com/) — Somehow we’ve totally slept on Radix till now, but if you want to design your own components while still having some solid foundations to work off of, it’s very much for you and takes care of a lot of the rougher edges of component development. WorkOS [New JavaScript API from a Google Ventures-Backed Notifications Infrastructure Service](https://www.courier.com/docs/guides/getting-started/nodejs?utm_campaign=demand-gen&utm_source=email&utm_medium=react-status-10-05&utm_content=guide-node-get-started) Courier.com sponsor [React Search Box: An Autocomplete Search Input for React](https://github.com/ghoshnirmalya/react-search-box) — Looks to have a nice clean API for plugging in the data and generating the input with various settings. Nirmalya Ghosh [React Flow 11: For Creating Node-Based UIs, Editors, and Diagrams](https://reactflow.dev/) — The example on the homepage shows it off well. v11 is focused around small improvements to the overall experience, particularly around accessibility. Webkid GmbH [Billboard.js 3.6: D3.js-Based Chart Library Gets More React-y](https://netil.medium.com/billboard-js-3-6-release-official-react-wrapper-new-enhancements-2dbf1ffc4d1c) — The hugely powerful and popular chat library now has [an official React wrapper,](https://www.npmjs.com/package/@billboard.js/react) a new ‘linear gradient’ bar chart option, and . [Demos](https://naver.github.io/billboard.js/demo/) and [GitHub repo](https://github.com/naver/billboard.js). Jae Sung Park [Get Real-Time Tracking and Monitoring for Your Jest Tests](http://buildkite.com/test-analytics?utm_campaign=CPress&utm_source=ppc&utm_medium=Q4-React-Status&utm_term=Test-Analytics) Buildkite Test Analytics sponsor [Horizon UI: An Open Source Admin Template Atop Chakra UI](https://horizon-ui.com/#/) — Includes a wide variety of dark/light components. [GitHub repo](https://github.com/horizon-ui/horizon-ui-chakra). Horizon UI [dark-mode-toggle: A Dark Mode Toggle Component for React](https://github.com/anatoliygatt/dark-mode-toggle) — Not to be confused with the Google Chrome team’s [component of the same name](https://github.com/GoogleChromeLabs/dark-mode-toggle), this one is specifically for use in React. Anatoliy Gatt **QUICK RELEASES:** - [React Admin 4.4](https://github.com/marmelab/react-admin) ↳ Agnostic-ish Material UI app frontend. - [SVGR 6.4](https://github.com/gregberge/svgr) ↳ Transform SVGs into React components. - [Tremor 1.0.2](https://github.com/tremorlabs/tremor) ↳ Library to build dashboard components fast. - [React Native Quick SQLite 4.0.8](https://github.com/ospfranco/react-native-quick-sqlite) ↳ Fast SQLite for React Native via JSI bindings. - [React Native DateTimePicker 6.5](https://github.com/react-native-datetimepicker/datetimepicker) - [react-native-context-menu-view 1.6](https://github.com/mpiannucci/react-native-context-menu-view) This issue was curated by Terence C. Gannon and Peter Cooper and edited by the Cooperpress team. A **[Cooperpress](https://cooperpress.com/)** publication. [Change your email address](https://react.statuscode.com/edit_subscription/*|UID|*) or[Stop getting this newsletter](https://react.statuscode.com/leave/*|UID|*) © Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom