#336 — April 26, 2023
How to Write Comments in React: The Good, the Bad and the Ugly — {/* Writing comments like this */ } is the usual way to write comments in JSX, but there are two other ways you should also know.
Dmitri Pavlutin
▶ Nine Hours on React Router 6 — A pretty epic video from Scrimba’s Bob Ziroll that you’ll need a lot of coffee to get through, but you get to see the development of a complete app based around React Router, and it’s free.
Bob Ziroll
New Course by Kyle Simpson: Practical Problem Solving with Algorithms — Walk through four fun challenges with Kyle in this new video course. You’ll learn how to apply algorithms with techniques like recursion, traversals, and acyclic paths, cover memoization to avoid garbage collection, and come away writing more performant code.
Frontend Masters sponsor
Modern Alternatives to Create React App — create-react-app was the ‘go to’ for building single-page React apps, but this article touches on the wide variety of alternatives now in common use. (We’re on team Vite!)
Ayooluwa Aduwo
Display a View Counter on Your Blog with React Server Components — Heard a lot about React Server Components but not yet had a chance to try them out? This concise tutorial employs a common, easily understood use case to take RSCs for a test drive. Plus it reminds us of the 90s, which is never a bad vibe.
Sebastien Castiel
QUICK BITS:
A Twitter discussion on the relative merits of Qwik and React led to Dan Abramov noting: “If we thought (the) Qwik model was better we would have literally implemented it”
Dan also made an observation on a bug report that if you use Preact Signals with React, you forfeit any guarantee that React will work correctly and that “if React was a piece of hardware, this is exactly the kind of thing that voids the warranty.”
Progress is being made on ipyreact, a way to use React within IPyWidgets, a way to add interactive widgets to Jupyter Notebook based environments (which most often, though not exclusively, use Python).
Alex Reardon, the creator of react-beautiful-dnd, recently ▶️ introduced ‘Pragmatic Drag and Drop’, a new performance-oriented approach to offering drag and drop features within webapps.
React ❤️ Rails? An Introduction to Superglue — Superglue is a React Redux starter/library inspired by Turbolinks designed to complement Ruby on Rails.
Dave Iverson (thoughtbot)
▶ Using Zustand for Simpler React State Management — Zustand is a popular alternative to Redux that’s simpler and less verbose. Niklas Ziermann runs through everything you need to know in this YouTube course. (75 minutes.)
Niklas Ziermann
🗣 Reddit also recently had a discussion on Zustand vs Redux.
React Authentication, Simplified
Userfront sponsor
Build a Note Taking Desktop Application with Tauri and React — Tauri is a Rust-based framework for building desktop apps.
Yonatan Dawit
🛠 Code and Tools
react-json-form: JSON Editing Made Easy Using Form Inputs — This project has a pretty epic playground showing off what it’s all about. GitHub repo.
Bharat Chauhan
Satori: Convert HTML and CSS to SVG — Designed to be used with React and JSX. It doesn’t support all HTML but is designed to provide a familiar way to generate images from code.
Vercel
Dynaboard: A Low-Code Web App IDE Made for Developers — Build high performance public and private web apps in a collaborative — full-stack — development environment.
Dynaboard sponsor
Ink 4.2: Build Interactive CLI Apps using React — A terminal-based React renderer so you can build command line apps using React-style components. v4.2 adds a lot of new features around rendering and styling box borders.
Vadim Demedes
Editable: An Extensible Rich Text Editor Framework — Currently depends on React, with future plans for a plain JavaScript version. Its primary feature is that it avoids using the contenteditable attribute for better interoperability. Try it in this playground.
Editable
Tremor 2.2
↳ Library to build dashboards fast.
react-dart 6.2
↳ Dart bindings for React.
Jobs
Senior Frontend Software Engineer — Help us redefine how work is done. Join our remote engineering team and work on hard problems. React, TS, GQL, Storybook, AI/LLM 🚀
Qatalog
Find React Jobs with Hired — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now.
Hired