#219 — December 16, 2020

Read on the Web

2020 doesn't have much longer to run and this is our final issue of the year — thank you for your continual submissions and encouragement.

At the end of each year we reflect back on the most popular links for the year and the biggest events from each month, so without further ado, here's our React in 2020 roundup! We hope you'll have a happy holiday season and we'll see you next in 2021.
__
Peter Cooper and Terence C Gannon, your editors

React Status
Your weekly React news digest, every Wednesday

Your top 5 most clicked React links of 2020

1.  The Key React Libraries to Use in 2020 — Everyone loves a curated list! This one came right at the start of 2020 and intelligently bought together a variety of key React libraries that still remain valuable. I hope Robin or someone else does a similar list for 2021.. hint hint.

Robin Wieruch

2.  Five Common Mistakes Writing Components (with Hooks) — Posts where we get to learn from other people’s mistakes are always popular, and so it went with this one about creating components.

Lorenz Weiß

Improve Your React Skills with Tips&Tricks from the Experts — As the year’s coming to an end, you might be inclined to set some learning goals for 2021. If that’s the case, don’t do it alone. Check out these 25 great tips from a host of React experts and kick-start your learning. Go to article.

Progress KendoReact sponsor

3.  The Ugly Side of React Hooks — We've covered hooks almost non-stop since their appearance two years ago, and mostly in a positive light. So we were intrigued to find an article trying to form another side of the argument. From the comments, though, clearly not everybody agreed with the author’s assertions. Dillon Shook's A Critique of React Hooks covered similar ground.

Nir Yosef

4.  React Folder Structure in 5 Steps — A walkthrough of how to structure large React apps into folders and files so you can manage them for the long term. There’s no single right way to do it, but Robin, who seemed to have a strong 2020 in terms of his blogging, shared his approach here.

Robin Wieruch

5.  Stop Mocking fetch — Another developer who had a very strong year of blogging about React was Kent C Dodds! Here he covered not only why you shouldn’t mock fetch or your API clients in your tests but what to consider instead.

Kent C Dodds

Honorary mentions:

  1. A Guide to Commonly Used React Component Libraries
  2. Why React Hooks Over HOCs?
  3. 15 React Best Practices You Need to Follow in 2020
  4. 10 React Security Best Practices
  5. Why I'm Using Next.js in 2020 (Video)

📅 React in 2020 — Month by Month

JANUARY: Dan Abramov reflected on his previous decade of work. The TypeScript team moved to Gatsby for its docs site. Styled Components v5 was released.

FEBRUARY: React Native grew up and got its own domain name: reactnative.dev. An official Redux template for Create React App hit 1.0. React Query 1.0 appeared.

MARCH: RedwoodJS started to pop up on our radar. Coronavirus began to throw in-person React events into disarray.

APRIL: Preact 10.4.0 was released. ZEIT rebranded as Vercel.

MAY: Next.js 9.4 was released (fast refresh and incremental static regeneration were the headline features). Recoil began to be unveiled. The Gatsby folks raised lotsa money.

JUNE: The React core team joined a Facebook employee walkout in solidarity with the Black community. MDN began to publish React tutorials.

Stream Announced the Public v2.0 Availability of Their React Native SDK — The React Native Chat SDK v2.0 is fully TypeScripted, based on React Hooks and revised for performance improvements.

Stream sponsor

JULY: Adobe unveiled React Spectrum, a collection of libraries to build UIs. Microsoft announced React Power BI for everyone who loves business reporting. Next.js 9.5 came out.

AUGUST: Facebook revealed more about how they use React themselves. React 17.0 RC1 came out and it had no new features.

SEPTEMBER: Kent C Dodds wrote a love letter to React. We learnt more about React's new JSX transform.

OCTOBER: webpack 5 was released. React 17.0 final was released. Create React App 4.0 was also released, as was Next.js 10.

NOVEMBER: A new Redux fundamentals tutorial was published. The BBC began to show off its React-based work. Vue 3.0 came out, keeping React on its toes.

DECEMBER: The React Christmas advent calendar began again.

🛠 Top Code and Tools from 2020

Recoil: An Exprimental State Management Library for React — Interesting not only because it came from Facebook, but because there was also a pretty good 23-minute talk about it and it followed the latest React standards out of the box.

Facebook

RedwoodJS: Bringing Full-Stack to the JAMstack — An opinionated framework that combines React, GraphQL, Prisma2, and lots more out of the box. Notably it comes from Tom Preston-Werner, one of the original founders of GitHub and the creator of Gravatar. We expect to see a lot more of this in 2021.

RedwoodJS

Reactochart: Chart Components by Spotify — We have featured a number of charting libraries in the past but it’s always interesting to see what a well-known brand like Spotify has on offer (and this set is mature and has been around a while). The documentation is good, with each type of chart (line, bar, pie, histograph, heatmaps, and more) illustrated with its own demo.

Spotify

Simplify Contactless & Chip Card Payments with 💙 React + Terminal API

Square sponsor

React Query 3: Hooks for Fetching, Caching and Updating Data — 3.2.0 came out just yesterday! It provides hooks that help you keep your server cache state separate from your global state and let you read and update everything asynchronously.

Tanner Linsley

React Hook Form 6: Simple, Extensible React Form Validation — Now with better TypeScript support, a smaller package size, and numerous refinements and improvements, RHF is certainly worth a look if you’re building or refactoring forms. GitHub repo. A new version dropped just this week.

Blue Bill

Craft.js: A React Framework for Building Drag and Drop Page Editors — It’s a bold move to make the landing page for your project be a text editor itself, but we liked it :-)

Prev Wong

💻 Jobs

Find a Job Through Vettery — Create a profile on Vettery to connect with hiring managers at startups and Fortune 500 companies. It's free for job-seekers.

Vettery

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