An alternative to useEffect
#292 — June 8, 2022
▶ Goodbye, useEffect? David Khourshid’s Reactathon Talk — Here, Stately founder David Khourshid makes the case for using event handlers and state machines to simplify handling effects in React apps rather than using useEffect which many developers struggle with and isn’t always well suited for the task anyway.
Building Interoperable Web Components That Even Work with React — If you use different frameworks like React, Svelte, Vue, etc. it’s common to pick a component library that suits each one, but what if you could write such components once in a framework agnostic way and use them wherever you want? Web Components provides an approach.
Build a Mobile-Responsive Telehealth Pager App Using Stream’s Chat API — Build a responsive chat app with emojis/reactions, built-in GIF support, ability to edit/delete messages, direct & group chat, and more.
Plasmo: ‘It’s Like Next.js for Browser Extensions’ — A React and TypeScript oriented framework for building your own browser extensions complete with live-reloading, automated deployment to the main extensions marketplaces, and more.
Patrick Sullivan of Gatsby looks at some of the latest updates to Gatsby Cloud and the framework itself.
🇳🇴 Er du i Norge? React Norway takes place on June 24 in Larvik. There is a virtual ticket option if you can’t make it in person though.
Senior React Engineer @ Nebulab (Remote) — Join our distributed team and build high-volume eCommerce applications in a workplace made by developers for developers.
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.
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.
How to Embed a React App in a Go Binary — Go is a popular language for writing backend APIs and you can compile Go apps down to a single, easily shared binary. Could you put your front end app in there too? Sure can.
How To Create a ‘Copy Code’ Button Along with React-Markdown — A novel combination of the react-markdown and react-syntax-highlighter libraries to enable code to be quickly and easily copied with a single button click.
Jay Simons (Designly Blog)
Stress Testing React 18’s Concurrent Features Using 3D Rendering — React 18 includes the highly anticipated concurrent features. This article describes how to incrementally optimize a sample 3D visualisation by employing this powerful new capability.
Reading Source Code: React-Query — A tutorial which describes the author’s methodology for exploring and understanding an unfamiliar codebase.
🛠 Code and Tools
Planby: A React Based Component to Implement an EPG-Like Timeline — Similar to the “electronic program guides” found on cable TV or streaming services. You can view some customizable examples here.
TLDR Newsletter sponsor
Locofy: Convert Figma Designs into ‘Pixel Perfect’ React Code — A well-funded crack at the holy grail of converting design documents (in Figma, in this case) directly into production-ready React code.
ReactiveMaps 3.0: UI Components for Building Geo Search UIs — The new release supports both OpenStreetMaps and Google Maps and enables the creation of rich search experiences for your choice of Elasticsearch, OpenSearch and MongoDB Atlas Search backends.
⚡️ Quick Bits:
react-text-transition 2.0 — Component to animate text changes.
react-chartjs-2 4.2 — React components for Chart.js.
Ruck — Build-less React web app framework for Deno.