#387 — June 5, 2024 |
🫣 We took a break last week, but forgot to notify you in advance - sorry! You didn't miss anything, and we're catching up with the past two weeks today. :-) |
|
|
|
Data Fetching Patterns in Single-Page Applications — With a level of depth you’d expect on Martin Fowler’s blog, Atlassian’s Juntao Qiu walks through five different patterns to consider when fetching remote data, using a realistic React-based scenario to show them off. Juntao Qiu and Martin Fowler |
|
Next.js 15 Release Candidate — The popular React meta framework gets ready for a major new release with a RC giving you an opportunity to experiment with React 19 (and React Compiler) support, executing code after a response with Delba de Oliveira and Zack Tanner |
Here's a Simple Video API for Your React Applications — Learn to integrate a video player into your React applications! Know about HTML5 video tag and using Video.js for Adaptive Bitrate Streaming. Crop, resize & use overlays on your video with ImageKit. Deliver an optimized visual experience every time. ImageKit sponsor |
|
A Recap of React Conf 2024 — React Conf 2024 was three weeks ago now, but the effects of the things unveiled there (e.g. React Compiler) are still being felt. If you didn’t attend or watch the videos yet, Ricky offers a good guide to the essentials with direct links to the relevant times in the livestreams. Ricky Hanlon |
💡 There's a similar roundup of Vercel Ship 2024 too, naturally focused more around new Vercel and Next.js features. |
|
IN BRIEF:
|
|
Translating React Apps with i18next and Testing Them with Playwright — A twofer: a step-by-step tutorial on how to use i18next to create a multi-lingual version of your app and the mechanics of testing it with Playwright. Marcin Wanago |
|
▶ Build a 3D Node Based Workflow with React Three Fiber and React Flow — A helpful tutorial if you want to learn the capabilities of the React Flow component for building node-based editors and interactive diagrams. Mohit Kumar Toshniwal |
|
📄 A Quick Look at Some Features in the React 19 Beta Zachary Lee 📄 Build a Modern Authenticated Chat Application with Next.js, Ably, and Clerk – A particularly thorough walkthrough. Alex Booker (Clerk) 📄 How to Create a Modal in React with HTML's 📄 It’s Not Just You, Next.js is Getting Harder to Use Andrew Israel 📄 Component Testing with SafeTest vs. Cypress vs. WebdriverIO Christian Bromann |
🛠 Code, Tools & Libraries |
|
|
React Native Boilerplate 4.2: A Template for RN Apps — A React Native template app for getting started quickly. It offers an optimized architecture for robust cross-platform development, separating UI from business logic, and is well documented too. GitHub repo. TheCodingMachine |
|
React-PDF 9.0: Display PDFs in a React App — Render PDFs in your app as easily as images. v9.0 is noteworthy as it updates the underlying PDF.js engine to a version not susceptible to a recent JS execution vulnerability. Wojciech Maj |
|
|
Storybook 8.1: It's Storybook, But Better — A big update for the UI component-based ‘frontend workshop’. 8.1 introduces a new UI for creating and editing stories, type-safe module mocking, a way to unit test React Server Components, and more. Michael Shilman |
|
Fontsource: 1700+ Open Source Fonts in npm Packages — On the surface, it’s a handy way to browse and filter over a thousand different Web fonts (from Google Fonts as well as other sources), but go a step further and you can integrate fonts into your apps in a version-locked manner by way of npm (or just grab a ZIP, if you prefer). Fontsource |
|
React Glow: Add a Pointer-Tracing Glow Effect to Components — You can see it in action on this site. The styles for the “glow” can be customized in various ways including options for Tailwind or plain CSS. React Glow |
|