Improve data management and user experience by adding sorting functionality to a React table without using any library.
Understanding how layouts, nested layouts, and custom layouts work in Next.js is crucial for building complex, user-friendly projects.
Mega menus are great on large sites that need feature-rich navigation. Let’s create a responsive, accessible mega menu from scratch in React.
An image overlay in CSS can be done in many ways. Learn to overlay images with text, gradients, and other unique styles and effects.
Use CSS Subgrid to design advanced and responsive grid layouts that are consistently aligned and independent of each other.
debug
methodUse the React Testing Library debug method, and the `logRoles` and `logTestingPlaygroundURL()` methods to identify and analyze test errors.
Let’s explore 5 React popover libraries that you can use to enhance UX and interactivity without having to implement popovers from scratch.
react-arborist
to create tree components for ReactThe react-arborist library organizes hierarchical data in an aesthetic, tree-like structure that users can easily understand and navigate.
react-intersection-observer
to create a dynamic headerWith the react-intersection-observer
package, we can create a dynamic header and improve the navigation experience within content-rich pages.
gap
property vs. margin
propertyLearn the subtle but important differences between the CSS gap and margin properties, as well as how their appearances change by layout choice.
This lesson covers how to optimize the font loading experience in a Next.js project as well as how to add custom and Google fonts.
In this guide, we will discuss some important ways to optimize the performance of a React application, including pre-optimization techniques.