Stepping forward with Next.js 13

Plus turbocharging Webpack, reflecting on `use` again, and a camera component that's 'got the vision.' |

#​311 — October 26, 2022 Read on the Web Together with  React Status Vercel Releases Next.js 13 at Next.js Conf — Next.js Conf 22 is taking place this week and Vercel's big news all hangs off of the release of Next.js 13 which includes: Support for an app/ directory to improve routing and layouts – can coexist with existing approaches, so no rapid migration needed. Support for React's new Server Components architecture in app/ A new image component with on-demand optimization and the ability to display images without layout shift. A brand new font system. An Open Graph (OG) image generation library. .. and something that deserves its own item – next! Vercel Industry-Leading React Components for Web Apps — We are excited to bring you powerful React components for your web applications. Offering built-in support, our powerful UI components, Excel-like library, and reporting platform can help you deliver impressive results. Empower your developers today. GrapeCity sponsor Turbopack: A Rust-Based Successor to Webpack — A variety of new tools like Vite have appeared boasting improved performance over Webpack, but Vercel is turning up the heat with a Rust-based Webpack 'successor' (it shares a creator) and you can try out an alpha today from Next.js 13 (above). Vercel Making Use of use in React - A New Hook is Coming — Last week we featured the RFC behind a new hook called use – here's a more accessible intro. "This inconspicuous creation could forever change the way we get data into our applications." Tomasz Borowicz 📺 Forthright React dev-vlogger Theo has ▶️ an entertaining 10-minute screencast covering why he's excited about the latest developments. "Why We're Breaking Up with CSS-in-JS" — Emotion is a popular library for writing CSS in JavaScript but one of its contributors tells the tale of why his team has gone off the idea of CSS-in-JS in general. Sam Magura How We Improved React Loading Times by 70% with Next.js — By replacing Create React App with Next.js, business planning platform Causal significantly improved their user experience by reducing load times. How? Well, just a little SSR can get you a long way. Causal Engineers IN BRIEF: If you want to catch up with Next.js Conf and don't mind trawling through a 2 hour livestream video – ▶️ here's the keynote. Vercel also has a variety of streams and recordings on their YouTube channel. Want a native drop down for Material UI for React (MUI)? Robin Wieruch has you covered. At Next.js Conf, Kelsey Hightower 🐦 is quoted as saying "Next.js is the framework for the web the way k8s is the framework for infrastructure." Matt Kane 🐦 ponders the deep connection between React and Next.js: "React is getting inextricably linked to Next.js." Secure Your React Applications with Snyk's Updated Best Practices Cheatsheet Snyk sponsor How to Accept Payments with React and Stripe — This takes you through the complete lifecycle of activities required to implement the popular payments provider. Reed Barger Building a Chat App with Socket.io and React Native Nevo David 🛠 Code and Tools Vision Camera: Advanced Camera for React Native Apps — Can capture photos, videos, or 'snapshots'. You can attach frame processors, control the FPS, handle smooth zooming, take HDR or night shots – there's a lot going on, and there's a demo app to show how to integrate it too. Marc Rousavy Downshift 7.0: Primitives to Build Accessible Components — Autocomplete, combo-box and 'select' dropdown components, in particular. It provides a set of hooks that provide the stateful logic needed to create such components which you can then lean on for WAI-ARIA compliant goodness. v7 introduces ARIA 1.2 guidelines for comboboxes and there's a v6 to v7 migration guide. PayPal Offline Support for React Native Is Here! Try V5 of Stream's Chat SDK Stream sponsor React-Uploady 1.2: File Upload Components and Hooks — Aims to be simple but customizable. You get a file upload button, a preview, a zone for drag and drop uploads, and more. The docs are good and show off an example. Yoav Niran React Buddy: A Helper Plugin for JetBrains IDEs — If you're using WebStorm or other IntelliJ-based IDEs, this plugin provides some extra tools (interactive component previewing, JSX outline view) and code generators (event handler generation, useRef generation) you might find useful. JetBrains Marketplace ⬇ The Code & Tools section continues below these job listings :-) Jobs Software Engineer (Security) — Join our "kick ass" team. Our software team operates from 17 countries and we're looking for more exceptional engineers to join our Security team. Sticker Mule Doppler - A SecretOps Platform Built by Developers for Developers — Doppler's looking for Sr. Full-Stack Engineers to help shape the future of security devtools. TypeScript, React, Express, and Go, apply here. Doppler Software Engineer — Join our "kick ass" team. Our software team operates from 17 countries and we're always looking for more exceptional engineers. Stickermule Find React Jobs with Hired — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It's free for job-seekers. Hired rtk-query-loader: Create Component Loaders on RTK Query — RTK Query, as in the Redux Toolkit data fetching addon. There's a CodeSandbox demo. Ryfylke React AS Sakai: A New Admin Template for Next.js Apps — Here's some documentation. PrimeReact react-i18next 12.0 ↳ React internationalization framework. React Live Chat Loader 2.8 ↳ Make live chat beacons faster in React apps. Handsontable 12.2 ↳ Data grid with a spreadsheet look and feel. react-admin 4.4.4 ↳ Framework for creating B2B app admin panels. docx 7.6 ↳ Generate Word/.docx files with a declarative API. Next SEO 5.8 ↳ Easier search engine optimization for Next.js projects. React Native Gesture Handler 2.8 ↳ Exposes native touch and gesture systems.

This issue was curated by Terence C. Gannon and Peter Cooper 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