Sunday, 9 January, 2022 UTC


Summary

sponsor
Track technical debt in your VS Code & JetBrains editors
Stepsize is an editor-first issue tracker for a healthy codebase. Create, view, and prioritise code issues, like technical debt and refactoring work, directly from your editor. Stepsize integrates with your existing tools like Jira, Slack, and GitHub, so you can track and address issues without context switching. Install the Stepsize VS Code or JetBrains extension.
this week's favorite
A complete guide to React Router: Everything you need to know
It’s probably no surprise to you that React Router is the most popular 3rd party library in the React ecosystem. In fact, during the last 6 months, React Router has been included in 44% of all React projects. This statistic alone is enough to declare React Router as essential knowledge for any serious React developer.
Building a Scrollspy and more using React and IntersectionObserver API
An IntersectionObserver is a utility in the native browser APIs which lets us check whether an element has intersected the viewport or any other ancestor.
Top 15 ideas for React apps that web devs can build in 2022
The best way to learn ReactJS is certainly through direct practice. If you’re convinced that ideas that have not been executed cost anything, then feel free to browse our list of React app ideas and finally put them to the test.
React component testing
React Testing Library and Jest are provided out-of-the-box support with create-react-app and we do not need to install them separately. React Testing Library (RTL) is built on top of the DOM testing library, as in the tests will work with the actual DOM. This allows the tests to simulate the ways that users will interact with DOM, as closer as possible. It is super easy to use, provides an array of assertion methods (extended from Jest), user-events simulation and etc.
A Visual Guide to React Rendering Sandbox
Code Sandbox that you can use as an interactive companion to the articles.