Next.js 9.5 released

⚛️ This week's React news, links, and libraries

#199 — July 29, 2020 Read on the Web React Status Your weekly React news digest, every Wednesday 🎸 React Guitar: A Flexible 'Guitar Neck' Component for React — You'd use this to render things like chord positions, say. But, even better, you can 'play' it too 😁 React Guitar Next.js 9.5 Released — Vercel CEO Guillermo Rauch is excited about the new release: incremental static regeneration, custom base paths, rewrites and redirects, Webpack 5 support, and much more. Next.js New Sample App To Get Inspired For Your Next React Dashboard — The new Warehouse Dashboard combines a grid, scheduler, charts & more into one sleek app. In this app, you will also see how we use the KendoReact Default Theme to style our components  to stand out and look great. Check out the code on GitHub. Progress KendoReact sponsor How to Use Styled-Components in React — The popularity of CSS is partially based on its ability to centralize and reuse style information. Similarly and amongst their many benefits, components deliver code reusability. It was just a matter of time before elements of the two concepts were combined into a new, really good idea. Adebiyi Adedotun Lukman A Complete Guide to Testing React Hooks — How much testing is enough? The short answer is "more". But with the broad array of options available, this tutorial provides a comprehensive overview of React Hooks testing to get you started in the right direction. Avi Aryan Polaris React: Enabling an Enhanced Experience for Shopify Merchants — One of the more underreported stories was Shopify's recent hookup with Walmart. Toronto-based Shopify has quietly become a dominant force in online retailing and is spinning off lots of integration opportunities with their in-house component library. Shopify 💻 Jobs Mid-Level Frontend Developer - React/Redux | Huckberry (Columbus, Ohio) — We're striving to build the most beloved men's retail site on the planet, with client-side rendering, modular code & excellent UX. HUCKBERRY One Application, Hundreds of Hiring Managers — Use 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 and Stories Generating TypeScript Types and React Hooks Based on a GraphQL Endpoint — GraphQL is at the core of many React apps but did you know you can also use it to automatically generate at least some of your code? This tutorial walks you through the use of the GraphQL Code Generator and demonstrates how. Danilo Woznica Frustrated by Formik? Here's a Simpler Way to do Forms in React — If Formik seems to require too much work to achieve a basic data entry form there is a simpler way: React Hook Form promises flexible, extensible and easily-validated forms with less work. Max Rozen How to Set Up and Use Navigators in React Native — You may be surprised to find React Native doesn't handle the history stack the way you expect: that is, similar to the way a browser does. But it can, using React Navigation. Aman Mittal Faster CI/CD for All Your Software Projects - Try Buildkite ✅ — See how Shopify scaled from 300 to 1800 engineers while keeping their build times under 5 minutes. Buildkite sponsor Asynchronous Testing with Enzyme and React in Jest — Asynchronous testing can be a challenge: how can you properly execute the test when assertions can run before the call to the API even resolves. This tutorial tackles this tricky subject through the use of Enzyme combined with Jest. Ben Ilegbodu How to Build a Clone of GitHub's File Search Functionality — Here's another one of those tutorials which begins with the end in mind: in this case, one with a pretty high likelihood GitHub users have used a lot already. This tutorial covers off all the details. Yogesh Chavan 🔧 Code and Tools SpreadSheet Grid: A Google Sheets-esque Spreadsheet and Grid Component — Ever wondered how to achieve the look and feel of Google Sheets (or the online version of Excel, for that matter) in your web app? Wonder no more. Rows 'n Columns has a component which delivers much of their outward appearance and functionality. Take note of the licensing though.. as the Grid part is MIT, but the Spreadsheet part is dual licensed. Rows n' Columns reactivue: Vue's Compositional API is Available (Experimentally) for React — There are lots of frameworks with which React competes, but that doesn't mean you can't cherry pick the desirable features from one (in this case Vue) and incorporate them into another (in this case React, of course). This will come as music to the ears to fans of Vue's Composition API. Anthony Fu Automated Code Reviews for React, Directly from Your Git Workflow Codacy sponsor re-frame: User Interfaces Using this ClojureScript Framework that Leveages React — You have to respect the code (and the coder) where the README leads off with a quote from The Fifth Elephant. All kidding aside, this well-regarded library has a distinctly different concept to building UIs as compared to other, more predictable approaches. Day8 use-screen-size: Conditional Code Based on Screen Size — It's a base line expectation (realistic or not) that your shiny new app will behave well on the plethora of screen sizes found out there in the wild. Here's the code you need to do it right. Oluwole Adebiyi use-click-away: Make That Modal Go Away...Naturally — Just can't seem to make that modal box go away as easily as it should? This React Hook detects clicks, taps, and touches outside the bound element and should finally get those modals working the way you and your users expect. George Bardi Gitify: GitHub Notifications on Your Menu Bar — GitHub can produce a lot of notifications and depending on how you choose to receive them, they can be disruptive and even downright annoying. This utility tames your GitHub notifications by bringing them down to your menu bar along with a lightweight, purposeful UI to navigate through them. Emmanouil Konstantinidis

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