Create React 4 and Next.js 10 released

This week's React news, links, and libraries

#212 — October 28, 2020 Read on the Web React Status Your weekly React news digest, every Wednesday Create React App 4.0 Released — It has been well over a year since the last major release of create-react-app, a popular way to quickly spin up a new React app, and it seems like it was worth the wait! We get support for Fast Refresh (the modern alternative to hot reloading) along with React 17 and TypeScript 4 support. There's also support for ESLint 7, Jest 26 and Web Vitals as well as improvements to PWA/Workbox. Facebook React Team 💥 AppSignal's Brand New 5-In-1 Application Monitoring for Node.js — We're officially launching the 1.0 version of @appsignal/node.js. It's ready for use in production apps and includes out-of-the-box support for Node.js Core, Express, Next.js, Apollo Server and node-postgres. When the bits hit the fan, use AppSignal. AppSignal sponsor Next.js 10 Released: Image Optimization, Internationalized Routing, React 17 Support — Similarly, it was worth the wait for the next major release of Next.js. It also has support for Analytics (incorporating Web Vitals) as well as Next.js Commerce which is a collaboration with BigCommerce. Vercel Time-Traveling State with Reactime 6.0 — So much of debugging state management issues relates to not only knowing what the state is, it also has a lot to do with what the state was leading up to it. Go back in time with Reactime. Vincent Nguyen Understanding When to Use useMemo — Max picks up on Knuth's often misunderstood "premature optimization is the root of all evil" quote but uses it to point at the misuse of useMemo before it's really necessary. Max Rozen ⚡️ Quick byte: Tamás Menyhárt provides his Pro Tips for Setting Up a React Native Project in 2020. What do you think? What's your pro tip for setting up projects? 💻 Jobs React Developer at X-Team (Remote) — Join the most energizing community for developers and work on projects for Riot Games, FOX, Sony, Coinbase, and more. X-Team Find a Job Through Vettery — Create a profile on Vettery to connect with hiring managers at startups and Fortune 500 companies. It's free for job-seekers. Vettery 🧑‍💻 Interested in running a job listing in React Status? There's more info here. 🛠 Tutorials, Articles & Stories What's New in Webpack 5: And Should You Rush to Upgrade? — A valuable, candid assessment of what's to be gained with the latest major release of webpack. While the benefits mean you'll have to get there eventually, you will also want to proceed prudentially, particularly if you make heavy use of plugins which may not yet be supported. Malcolm Laing The 5 Questions Every Unit Test Must Answer: React Wednesdays Interview — Eric Elliott dropped a masterclass in testing at React Wednesdays, a weekly Twitch show. Neatly summarized in this blog. Progress KendoReact sponsor How to Create a Reddit Clone Using React and Firebase — If you think that Reddit is more heat than light much of the time, maybe you should consider creating your own version of it? This one makes novel use of Firebase as a backend to create something very simple. Nirmalya Ghosh React Form Validation with Formik and Yup — React has pretty decent form handling baked right in, so why is it necessary to also incorporate Formik and Yup? In short, simpler and easier development of bulletproof forms. Nefe Emadamerho-Atori Wouter: A Minimalist Alternative to React Router — Not a day goes by when we don't encounter the 80/20 rule: deliver the 20% which meets 80% of the need. If you think React Router might benefit from this approach, then you want to give Wouter a try for your next React/Preact project. It's the 20% you need. Nathan Sebhastian How to Create a Camera App with Expo and React Native — Expo is getting quite a bit of attention in the React Native community. That said, richly-llustrated concrete examples of how to use it are always welcome particularly when accompanied by source code. Said Hayani How to Build Your Own Codepen-Style Online Code Editor App Moshe Kerbel Pro Tips for Setting Up a React Native Project in 2020 Tamás Menyhárt 🛠 Code and Tools supported by React-Chrono: A Beautiful and Flexible Timeline Component — We count amongst our number those who are history buffs, and they don't think there is any better way of conveying that information than a timeline. Render in 3 unique modes (vertical/horizontal, tree, or auto-playing slideshow) and you get keyboard navigation support too. Prabhu Murthy Frontity: React Meets WordPress — According to one source, WordPress powers a whopping 39% of the world's websites. So how about creating React-based Wordpress themes with this? Frontity Building Chat With React? Stream Chat Has You Covered Stream sponsor Talkr: Super Small i18n Provider — For internationalizing your app, here's everything you need and nothing you don't. It even features auto-detection of browser language and plural rules. DoneDeal0 Vime: Customizable, Extensible, Accessible and Framework Agnostic Media Player — If you want better control over the media viewing experience than, say, Vimeo or YouTube are willing to provide, you can put Vime in the middle and you'll have all the control you could possibly want. Comes complete with React-specific bindings. Vime React JSX Highcharts: Highcharts Built with Proper React Components — Highcharts is a popular and powerful charting library (check out their demo). But now, it's also tightly integrated with React as you can see in this example. Will Hawker

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