Next.js 10.2

Plus a new React component collection, hooks for Framer Motion, and a hooks cheat sheet. |

#​237 — May 5, 2021 Read on the Web React Status ⚛️ Your weekly React news digest, every Wednesday Mantine: A New React Component Library — An MIT licensed, TypeScript-based collection of around 60 components and hooks with native dark theme support and a focus on usability and accessibility. Plenty of documentation and examples - we like it. Oh, and they work with Preact too. Mantine Team ▶  A Comparison of Five React Frameworks — In just 26-minutes, this video provides most of the information required to pick the right React framework from five top players in the space: CRA, Gatsby, Next.js, Blitz, and Redwood. Leigh Halliday Book a Demo. Ship Fast. Rest Easy. LaunchDarkly — Testing in production? It's scary until it's not. Get total control of your code to ship fast, reduce risk, and reclaim your nights and weekends. LaunchDarkly sponsor Next.js 10.2 — The Next.js team at Vercel has just released 10.2 and the advertised improvements exceed expectations for a minor release: (up to 60%) faster builds, faster refreshes and faster startup, along with improved accessibility and more flexible redirects and rewrites. Not to play favorites, Gatsby also got a release in the shape of Gatsby 3.4. Vercel Ten Apps That Use React Native — Given their corporate tie-in, it should come as no surprise that the Facebook and Instagram mobile apps use React Native. The other eight names on the list, however, may come as more of a surprise. David Jöch Jobs React Developer at X-Team (Remote) — Join the most energizing community for developers and work on long-term projects for Riot Games, FOX, Sony, Coinbase, and more. X-Team Find React Jobs with Hired — Take 5 minutes to build your free profile & start getting interviews for your next job. Companies on Hired are actively hiring right now. Hired 🧑‍💻 Got a job listing to share? Here's how. 📘 Tutorials and Stories TypeScript Function Syntaxes — Flexibility can be a two-edged sword: new developers, in particular, may be overwhelmed by the options available to them. Kent provides some prescriptive syntax ideas to get you started. Kent C. Dodds ▶  A Vite 2.0 Crash Course — "I'm never going to use Create React App again" states the author of this video. A bold claim backed by his love for Vite, a fast frontend build tool. Jesse Hall Creating a Web App with Yarn Workspace, TypeScript, esbuild, React, and Express — The first of a three part series followed by a bonus article featuring advanced techniques. The latter includes publishing to Docker using GitHub Actions. Aymeric Chauvin How to Implement a React Data Grid (One That'll Make Your Life Easier) — The KendoReact Data Grid is not only feature rich and very fast, but also satisfying to work with. Watch video tutorial. Progress KendoReact sponsor Adding Image Upload to a React Native App with AWS Amplify — With Amplify, AWS is looking to make inroads into mobile app development. The tutorial author illustrates its use with this common application requirement. Derek Bingham Create a Whack a Mole Game With React and JavaScript — For those new to React, an (incredibly) simple tutorial with a relatable case study is a great way to kickstart your educational journey. John Au-Yeung beginner React 17 Adds Support for KeyboardEvent.code Property to SyntheticEvent — The new major release of React includes this small but important change. Aditi Tipnis 🛠 Code and Tools react-scroll-sync: Synced Scroll Position Across Multiple Scrollable Elements — There is, of course, a page with a demo on it. :-) Andrey Okonetchnikov React Hooks Cheat Sheet — An excellent resource for your office wall with an innovative approach to pricing: you pay what you think it's worth (or even zero - the creator suggests). Sébastien Castiel ClickableBox: Automatically Add onClick to HTML Elements — This component also returns the attributes and listeners needed to make these elements accessible as if they were buttons. Daniel O'Connor Free Chat & Activity Feed APIs for Qualifying Teams Stream sponsor State Designer: Optimizing the State Management Design Experience — Yes, yes, another state management library, but the idea here is to help you figure out the design of your states. Example and GitHub repo. Steve Ruiz Framer Motion Hooks — The one gap in Framer Motion? No hooks. Now there's an option to "fill the hook gap", as they put it. Matthias Halfmann Chat UI Kit React: Roll Your Own — Build a chat UI with React components and avoid much of the hassle and complication of piecing together your own. chatscope ⚡️ Quick Bits: Interesting projects which you may have missed: react-native-wheel-scrollview-picker — Dial up some numeric input for your mobile app. react-google-autocomplete — Use Google Maps place predictions to pre-populate a location field. React Bulma Components — This CSS framework is now available for React. Grid.js for React — Advanced JavaScript tables. Box UI Elements — For developers working in the Box ecosystem.

This issue was curated by Terence C. Gannon and edited by the Cooperpress team. A Cooperpress publication. Change your email address or Stop getting this newsletter © Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom