Next.js 12.1 released

Plus a React e-commerce system, parallex effects, and comparing Gatsby with Next.js. |

#​277 — February 23, 2022 Read on the Web React Status ⚛️ Your weekly React news digest, every Wednesday. Next.js 12.1 Released — Don't be fooled by the ".1", this is a big release for the React powered framework. It introduces a beta version of on-demand incremental static regeneration (ISR), now automatically configures Jest for you, and can create smaller, more efficient 'standalone' builds of your app for production deployment. Vercel 🏆  JavaScript to Know for React — A golden oldie we've seen doing the rounds again this week. It remains a perfect primer of several key JS features though with examples of features that will help you with React development in particular. Kent C Dodds React Authentication, Simplified — In this article, we lay out a new approach to authentication (plus access control & SSO) in React applications. Userfront sponsor An Introductory Guide to Concurrent Rendering — The upcoming React 18 will introduce new concurrent rendering features. What will this offer and why will you want to use it? Chak Shun Yu Security of React Native Libraries: The Bad, the Worse and the Ugly — A really deep dive into "issues in third party libraries that drastically affect the security of the main application". These range from official guides which recommend insecure libraries through easily-misused APIs. Anastasiia Voitova and Julia Potapenko (Cossack Labs) Jobs Fullstack Engineer (Remote, EU Timezones) — We've built a product thousands of people love (See Trustpilot if you don't believe us). We need your help with Node & TypeScript. Feather 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 Work Remotely Forever — When you join Toptal, you get the freedom of freelance with the security of full-time. Take control of your career today. Toptal Deploy a React App on GitHub Pages Automatically — Given that you're likely on GitHub already, why not use GitHub Pages as a means of deploying React apps? As the author notes, the workload is low and the price is certainly right (at zero). Hanie Asemi Build a Responsive Chat App with Emojis, GIF Support, Edit/Delete Functions, and More Stream sponsor Creating a 'Reading Progress' Bar with React and Tailwind — Communicating reading progress is just one potential application of this concept. With some adaptation and a data store it should also be possible to track reader engagement—that is, Medium-like stats on how much of the material is actually being read. Anshuman Bhardwaj Comparing Gatsby and Next.js Alex Barashkov 🛠 Code and Tools Atropos: Touch-Friendly 3D Parallax Hover Effects — The easiest and fastest way to fool the eye into thinking the screen has somehow developed three-dimensional capabilities (and, admittedly, annoy some users - so be careful) is to use parallex effects as demonstrated on the project's homepage. Vladimir Kharlampidi React Storefront: A PWA for e-Commerce That's Already in V9.0 — Why wait for Shopify to finish up Hydrogen when you can start working with a mature, open-source, React-based e-commerce app right now? Storefront Foundation React Motion Router: A Declarative Routing Library for React with Page Transitions and Animations — Try a demo here. Nathan Johnson Heart Switch: A Heart-Shaped Toggle Switch Component for React — A (very) late Valentine's Day gift for you. Anatoliy Gatt Spectacle 9: A React and JSX-Based Presentation Library — Got a presentation coming up? Build your decks with JSX, perhaps? Formidable ⚡️ Quick Bits: react-click-away-listener — Track when the user leaves a component as opposed to when they click on it. flowchart-react — A super simple flowchart designer component. react-text-truncate — Elegantly truncates multi-line text, as illustrated by their demo. react-native-mask-input — Text input with masking for React Native along with support for obfuscating characters. react-native-fs — Access to the device filesystem for React Native. react-native-element-dropdown — A customizable dropdown component as illustrated with their gif demo.

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