React: 2 Ways to Open an External Link in New Tab

May 9, 2022 A Goodman

This article shows you two different ways to open an external link in a new browser tab in React. The first approach uses <a> tag, which is simple and quick but has some limitation. The second…

How to Use Tailwind CSS in React

May 7, 2022 Pennywise

Tailwind is a popular open-source CSS framework that can help you rapidly build user interfaces. It works very nicely with React and you can style your apps without leaving your Javascript (or TypeScript) code, thanks to…

React Router: useParams & useSearchParams Hooks

May 4, 2022 A Goodman

This article is about the useParams and useSearchParams hooks that come with React Router. We’ll cover the fundamentals of these hooks and then walk through a complete example of using them in practice. useParams hook The…

Working with the useId() hook in React

May 4, 2022 Pennywise

useId is a built-in hook that is available since React 18. The purpose of the hook is for generating unique IDs that are stable across the server and client while avoiding hydration mismatches. Important points to…

How to use Tailwind CSS in Next.js

May 5, 2022 The Plumber

This succinct article shows you how to integrate TailwindCSS in Next.js. A Quick Introduction TailwindCSS is a popular CSS framework that can help you create nice user interfaces quickly with pre-made CSS classes. Unlike MUI, Ant…

Working with CSS Modules in Next.js

April 14, 2022 Pennywise

This article is about using CSS modules in Next.js. Overview Next.js supports CSS modules out-of-the-box. That means you can use it without extra setups or installing any third-party libraries. CSS modules are locally-scoped, so you can…

How to use SASS in Next.js

April 14, 2022 A Goodman

SASS (Syntactically Awesome Style sheets) can make your life much easier when writing CSS code with variables, nesting, mixins, and other amazing features. This succinct article shows you how to use SASS in Next.js. The Steps…

Using Styled JSX in Next.js: Tutorial & Examples

April 14, 2022 Pennywise

This article walks you through two complete examples of using styled JSX in Next.js. The first example helps you learn the syntax of styled JSX and shows you how to use local and global styles. The…

Best open-source Icon libraries for React (2022)

April 2, 2022 Guest Contributor

This article walks you through a list of the best open-source icon libraries for React in 2022. They are rated and ranked based on the number of stars they receive from GitHub users and the weekly…

React: How to Show/Hide Password in an Input Field

April 2, 2022 A Goodman

This article shows you how to programmatically show or hide a password in an input field in React. We’ll use modern stuff, including hooks and functional components. Everything will be built from the ground, and no…

React: Get the Position (X & Y) of an Element

April 1, 2022 A Goodman

This article shows you how to get the position of an element in React regardless of whether the element is fixed or repositionable. We’ll explore the technique to get the job done and then walk through…

React + TypeScript: Making a Reading Progress Indicator

March 20, 2022 A Goodman

This article walks you through a complete example of creating a reading progress indicator in React. We are going to write code in TypeScript and make use of modern features provided by React including hooks and…

1 2 3 8