#270 — December 22, 2021 |
🎄 Hi folks. It's the end of the year (for us, anyway) so we're looking back at 2021 with a roundup of the most popular items of the year, whether overall, or in terms of libraries and videos. You should find something useful here that skipped your attention at the time :-) Beyond that, have a happy new year and we'll see you back on Wednesday, January 12. |
The Top React Status Items of 2021 |
1. The Tao of React: Design, Architecture & Best Practices — The topic of 'best practices' is a perennially popular one in the React world with so many ways to approach each problem. So it's no surprise this post covering a variety of principles and attitudes for productively building resilient React apps for the long term went down so well. Alex Kondov |
2. React Architecture: How to Structure and Organize a React Application — The theme from the item above continues here ;-) Tania is always fantastic at explaining things, so we really liked her approach to explaining project structure, and it seems you did too. Tania Rascia |
|
3. Five Code Smells React Beginners Should Avoid — About to pull the trigger on your first big pull request for a high profile project? You should probably go through this checklist first. As an aside, if you're writing an article about React, this is the sort of headline that is catnip to readers, as long as you can deliver :-) Jason Lee Hodges |
4. Top React Component Libraries (2021 Edition) — We're doing a separate list of top code and tools items below, but if you want a one-stop shop for component libraries, the folks at Retool released a 2021 update of their list of top React libraries. Kevin White |
5. How To Write Better Functional Components in React — Five simple tips to help write optimized functional components that are more readable, each with its own sample code showcased with JSFiddle. Bikash Paneru |
|
🛠 Top Code and Tools Links of 2021 |
Leva: A GUI Panel for React — A control panel that lets you set app properties via a nicely designed interface. Think David Bismut |
Spectacle 7: A React and JSX-Based Presentation Library — Got a presentation coming up? Build your decks with JSX? A good way to get a feel for it is via the deck on its home page. Formidable |
▶ Why It's Tricky to Build React Forms—But Not with KendoReact Progress KendoReact videosponsor |
React DnD 14.0: Utilities to Create Drag and Drop Interfaces — Build complex drag and drop interfaces while keeping your components decoupled. Chris Trevino |
REAFLOW: Node-Based Visualizations for React — If you have trees / diagrams of nodes to render and manipulate, this is an option. It’s best to hit up the demos to see how it works. REAVIZ |
useStateMachine: The ½KB State Machine Hook — It only makes sense to bundle a state machine into a hook. We have featured a number of Cassio’s videos in the past, so it’s no surprise there’s a video walkthrough with examples which illustrate its use. Cassio Zen |
📺 Top Videos of 2021 |
▶ A Coding Interview with Dan Abramov — This was just two weeks ago, but Dan Abramov's brave ‘coding interview’ with Ben Awad was the runaway popular video of the year. Ben Awad and Dan Abramov |
▶ Ten React Hooks Explained, Plus Build Your Own From Scratch — If you still haven’t fully gotten on the React Hooks bandwagon and have just 13:14 to spare, this video is what you need. The narrator doesn’t take a breath: strap in, hang on and get ready to hit the pause button. Fireship |
▶ Hook Traps: |
▶ From Figma to GitHub Using Anima
|
▶ React Router v6 - The No Nonsense Guide
|
▶ What's New in React 18
|