React DnD 14.0: Utilities to Create Drag and Drop Interfaces — Build complex drag and drop interfaces while keeping your components decoupled. v14.0 came out this week and addresses a variety of “liveness and ergonomic issues with the hooks API.”

Chris Trevino

How to Write a React Component in TypeScript — While we featured an article by Felix Gerschau covering similar ground in #227, the always helpful Kent C Dodds provides complementary coverage of the topic here :-)

Kent C. Dodds

A Friendly Introduction to Functional Programming with JavaScript by Anjana Vakil — Learn what Functional Programming (FP) is and how it differs from other programming styles (such as OO and imperative), and use key concepts of functional to improve your everyday coding.

Frontend Masters sponsor

react-big-calendar: A GCal-Style Calendar Component — Inspired by FullCalendar this component provides all of the calendaring functionality you’ll likely need. See for yourself using their demo.

Jason Quense

react-anime: Animation Library Based on anime.js — If you have always wanted to integrate the functionality of the popular anime.js animation library into your React app, now you can.

Alain Galvan

React Developer at X-Team (Remote) — Join the most energizing community for developers and work on projects for Riot Games, FOX, Sony, Coinbase, and more.

X-Team

Find Your Next Job Through 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

Low-Level Charts in React — A concise tutorial on using Airbnb’s powerful Visx data visualization library released in the fall of last year.

Catalin Pit

Form Validation with React Hooks without a Library: The Complete Guide — While a library like Formik can save some development time, they can also paper over an understanding of what’s actually happening when validating forms.

Felix Gerschau

Build a React App with ANT Design Principles — Build a small React app that displays transactions to the user based on Ant Design principles & uses Okta to secure it.

Okta sponsor

Five DRY Principles to Follow in React — Yes, the DRY (don’t repeat yourself) principle applies to React projects, too. These prescriptive recommendations will help you take the redundancies out of your code (or prevent them in the first place).

Mohammad Faisal

Modeling UI States in a React Form Component Using a Finite State Machine — We covered finite state machines a couple of issues back and felt this article was a natural follow up article: it illustrates the FSM concept scaled up to address some of the requirements of OkCupid’s 50 million users.

Xiaoyun Yang

Building a Modern React App from Scratch in 2021 — Boilerplate is good when you want to get something done quickly. But you’ll want to skip them and build your React app from the ground up if you want to know what is actually going on.

Yakko Majuri

Pullstate: Simple State Management with Fast Retrieval Using Hooks — Simple state stores using immer and hooks - re-use parts of your state by pulling it anywhere you like. This library comes with two, easy to follow examples.

Paul Myburgh

react-fetching-library: Use Hooks to Retrieve Data — Similarly, here is a library which provides a generalized approach to retrieving data, also based on hooks.

Marcin Piela

useCountdown: A Count Down Timer Hook — In yet another example of the ever-expanding use of hooks, here’s one that implements a countdown timer. react-countdown is another if you want to do some comparing.

Brad Garropy

AWS Cloud Certifications Explained: Which Is Right for You?

New Relic sponsor

prism-react-renderer: Prism Syntax Highlighting in React — If you have used PrismJS it the past and liked it, good news, you can now have its syntax highlighting capabilities accessible within React.

Formidable

SWR: React Hooks Library for 'Stale' Data Fetching — SWR comes from stale-while-revalidate, a cache invalidation strategy popularized by RFC 5861. SWR first returns the data from cache (stale), then sends the fetch request (revalidate), and finally return the up-to-date data again.

Vercel