--- title: "Recoil 0.3 released" publication: "React Status" issue: 239 published_at: "2021-05-19" canonical_url: "https://react.statuscode.com/issues/239" --- Plus deconstructing how a color picker works, hosting Next.js apps on AWS Amplify, and what's new in React Router v6. | #​239 — May 19, 2021 [Read on the Web](https://react.statuscode.com/issues/239) React Status ⚛️ _Your weekly React news digest, every Wednesday_ [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/jwgzniof6zozzhvtuqdh.jpg)](https://reactype.io/#reactype7) [ReacType 7.0: A Visual Prototyping Tool for React Developers](https://reactype.io/#reactype7) — The popular drag-and-drop React prototyping tool with code preview is now in its seventh major release. Kevin Park has written an [extensive article](https://t.co/2CeNy35HM2?amp=1) on it which provides an in-depth review of its capabilities. OSLabs [React Color Picker Deconstructed](https://lorenzopepe.dev/blog/react-color-picker) — Perhaps you’re satisfiied with just dragging a color picker component into your app. But if you _really_ want to understand what actually goes into this seemingly simple but actually quite complex sort of control, here you can dig into the details. Lorenzo Pepe [![\](https://copm.s3.amazonaws.com/a5302171.png)](https://www.telerik.com/blogs/ultimate-guide-to-building-ui-component-library-part-3-components?utm_medium=cpm&utm_source=reactstatus&utm_campaign=kendo-ui-react-blog-guide-building-robust-components&utm_content=primary) [Guide to Building a UI Library: Building Robust Components](https://www.telerik.com/blogs/ultimate-guide-to-building-ui-component-library-part-3-components?utm_medium=cpm&utm_source=reactstatus&utm_campaign=kendo-ui-react-blog-guide-building-robust-components&utm_content=primary) — In his blog series, TJ VanToll shares what he’s learned from over a decade of writing and working with UI components for the web. This article focuses on building robust UI components, complete with unit tests and excellent documentation. [Read more](https://www.telerik.com/blogs/ultimate-guide-to-building-ui-component-library-part-3-components?utm_medium=cpm&utm_source=reactstatus&utm_campaign=kendo-ui-react-blog-guide-building-robust-components&utm_content=primary%20). Progress KendoReact sponsor [You Can Now Host Next.js SSR Apps on AWS Amplify](https://aws.amazon.com/blogs/mobile/host-a-next-js-ssr-app-with-real-time-data-on-aws-amplify/) — Amplify has added support for continuously deploying server-side rendering (SSR) apps built with the Next.js React framework. Kyle Lee (Amazon Web Services) [Amazing New Features in React Router v6](https://t.co/QEc4jPmvv4?amp=1) — A review (with examples) of the four new APIs found in the new version of React Router which you may want to incorporate into your next project. Rishav Ghosh [Recoil 0.3 Released](https://recoiljs.org/blog/2021/05/14/0.3.0-released/) — The alternative state management library for React that comes out of Facebook (but not the React team itself). Facebook [Why We Switched from Webpack to Vite](https://blog.replit.com/vite) — If you feel Create React App and Webpack have become too bulked up, cumbersome and inefficient, there’s a new React template from [Replit](https://replit.com) (the in-browser IDE folks) which you may want to try with [Vite](https://vitejs.dev/) instead if you're a user. Sergei Chestakov (Replit) Jobs [Full-Stack Software Engineer](https://ad.doubleclick.net/ddm/clk/496064891;303615634;n) — We are looking for passionate Software Development Engineers to help design, develop and deploy software for our solutions. Marks and Spencer (M&S) [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) — Take 5 minutes to build your free profile & start getting interviews for your next job. Companies on Hired are actively hiring right now. Hired 📘 Tutorials and Stories [Building Portable Apps with Go and Next.js](https://v0x.nl/articles/portable-apps-go-nextjs) — It’s not often we get to see Go and JavaScript come together, but the idea here is that you can use Go’s new static embedding functionality to build a self-contained Go app that serves a Next-powered app all in one. David Stotijn [A Visual Guide to React Mental Models](https://obedparla.com/code/a-visual-guide-to-react-mental-models/) — Different people learn in different ways, but good mental models are always valuable and can be helpful if you need to juggle all of the pieces involved in a framework like React. We linked this back in 2020 but it’s doing the rounds on social again and is a good’un :-) Obed Parlapiano [How to Type a React Form `onSubmit` Handler](https://epicreact.dev/how-to-type-a-react-form-on-submit-handler/) — Write clearer, cleaner code by saying goodbye to all those type casts. Kent C. Dodds [Blog Post: Choosing the Right React Form Library for Your Next Project](https://retool.com/blog/choosing-a-react-form-library/?ref=cooperpress) Retool sponsor [How to Make Performant Animations in React Native with Reanimated](https://around25.com/blog/how-to-make-performant-animations-using-reanimated/) — Improve mobile app animation performance by taking it off the main JavaScript thread and giving it to the UI thread instead. The Around25 Blog ▶[Let's Talk `urql`: A Highly Customizable and Versatile GraphQL Client](https://www.youtube.com/watch?v=nhxaAEZWouA) — Brian and his guest Phil Pluckthun of Formidable Labs chat about what Phil calls ‘the third GraphQL client’ after [Apollo](https://apollographql.com) and [Relay](https://relay.dev). Open Source Friday with Brian Douglas (bdougieYO) [Build a Music Streaming App like Spotify with React Native](https://javascript.plainenglish.io/build-a-music-streaming-app-like-spotify-with-react-native-2ce2b4ff85be) — Another instalment in this informal series that starts with a relatable case study and then proceeds through a rigorous step-by-step tutorial. Sara Khan 🛠 Code and Tools [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/ilpavkw3d9cpceuzka25.jpg)](https://github.com/akveo/react-native-ui-kitten) [UI Kitten: Compelling Cross-Platform Mobile Applications with React Native](https://github.com/akveo/react-native-ui-kitten) — Based on the [Eva Design System](https://eva.design), this library claims a consisent and scalable design development process along with themes which can be dynamically changed at runtime. Akveo [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/c31nzngzr7p1gqmr2xdq.jpg)](https://github.com/hodgef/react-simple-keyboard) [React Simple Keyboard 3.1: A Customizable Keyboard Control](https://github.com/hodgef/react-simple-keyboard) — It can take a bit of imagination to see the use for such keyboards (kiosks, maybe?) but this is one of the smoothest looking such components I’ve seen nonetheless. Comes with a complete and compelling [demo](https://hodgef.com/simple-keyboard/demos/). Francisco Hodge [New Mobile Chat Kit From Stream](https://getstream.io/chat/ux-kit/?utm_source=react_status&utm_medium=promoted_newsletter&utm_content=developer&utm_campaign=5_19_21) — Chat UI & SDKs for Figma, Sketch, Flutter, React Native, iOS, & Android. The UI includes flexible assets for creating customized, scalable, and beautiful in-app chat experiences. Stream sponsor [Stripe React Native SDK: 'Delightful' Mobile Payment Processing](https://github.com/stripe/stripe-react-native) — The official mobile app code provided by [Stripe](https://stripe.com) online payment processor. Stripe [nextjs-auth0: One Stop Access Management for Next.js](https://github.com/auth0/nextjs-auth0) — Abstract away your authentication and authorization burden so you can focus on more impactful and differentiating features. Auth0 **⚡️ Quick Bits:** Interesting projects which you may have missed: - [react-dictate-button](https://github.com/compulim/react-dictate-button) — You’ll be just one click away from the [Web Speech API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API/Using_the_Web_Speech_API). - [React Physics Dragger](https://github.com/nickmcmillan/react-physics-dragger) — A flexible wrapper element which provides some real-world physical properties to horizontal dragging. - [react-native-svg-app-icon](https://github.com/aeirola/react-native-svg-app-icon) — Generates all the necessary iOS and Android application icons. - [Simple React Validator](https://github.com/dockwa/simple-react-validator) — Minimal configuration validation similar to [Laravel](https://laravel.com). - [React CSV Downloader](https://github.com/dolezel/react-csv-downloader) — Download a CSV representation from a JavaScript object. This issue was curated by Terence C. Gannon 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