Latest Articles & Tutorials

Next.js 11 continues our mission to create the best developer experience with a new conformance system and performance improvements.

The latest React Native 0.64 release adds support for the Hermes engine on iOS, and this is a direct result of our intensive work with teams at Facebook and Microsoft.

In this tutorial, I want to show you how to use React Table Library with its useSort plugin for a sort feature. In the previous example, you have already installed React Table Library to create a table component. Now, we will enable users to sort columns in the table by clicking on a column's header.

In this post, we will focus on pagination and we'll build a custom controlled component that handles page buttons based on the current page and total data count.

React 18 is here! That's the one with concurrent mode.

Do you write conditionals correctly within your React applications?

This tutorial will help you learn the new features already present in React 18 Alpha that I’ve been able to try myself.

In React Native, this is the default way to build layouts. It works wonderfully for mobile development because it allows us to build layouts that fit multiple screen sizes, thanks to responsive design.

Let’s take a look at the KendoReact Window component, which allows you to resize, minimize, maximize and even drag windowed items on the web similar to desktop functionality.

In this article, we’ll cover common use cases for managing state in React and learn when you should consider using each solution. Let’s accomplish this by building a simple counter app.

In this tutorial, we’ll show you how to build and style a TypeScript app using styled-components.

In this tutorial, I’ll show you how to generate extra income through ads by implementing Google AdMob in React Native.

In this tutorial, we’ll build five different React Native swiper components for various use cases using Expo.

Using Storybook to render React components in a Bit workspace

In this article, you will learn how to use the React Icons library to display icons in your React project.

React 18 alpha has been released, which is very exciting! But can we use it with TypeScript?

The React team is excited to share a few updates.

In this post, we will explore the advantages of each tool and how they help developers navigate and utilize analytics within React Native.

In this article, we’ll dive into the basics of the React Native Image component, discuss the types and props available, and cover its limitations and alternatives.

If you use a ref in your effect callback, shouldn't it be included in the dependencies? Why refs are a special exception to the rule!

Handling multiple checkboxes in React is completely different from how you use regular HTML checkboxes.

In this article we’ll be focusing on using plain React, with no libraries. You’ll learn how forms really work, so you can confidently build them yourself. And if later you choose to add a form library, you’ll know how they work under the hood.

Achieve DS scale and adoption via independent components and a composable architecture — with examples.

Creating virtual reality experiences using JavaScript

Want to get started with React but struggling to find a good place to start? This article should have you covered. We’ll focus on some of the main concepts of React and then we’ll be building a game from scratch! We assume that you have a working knowledge of JavaScript.

Ever wonder how to build a tag input field component for your React app? Here’s how.

In this article, I will explore Zustand, which provides a lightweight and straightforward way of managing state in React.

Learn how the Context API works in React and the best times to use it to avoid prop-drilling in your application.

Here is a simple and practical example what it means to "lift state up" in React, and how it can help you build your applications.

If you’re familiar with React Native, you know that starting a project from scratch can be a very tedious, repetitive, and time-consuming process. For that reason, in this article, we will take a look at some of the most popular React Native boilerplates that will help you start a project much faster.

This article showcases a case study of Bookaway’s landing page performance. We’ll see how taking care of the props we send to Next.js pages can make loading times and Web Vitals better.

The simplest distraction-free version of a remix app.

To get the highest impact from a form, it’s best to keep it simple. We can accomplish this by employing the “one thing per page pattern” theory popularized by Adam Silver, and we can easily achieve this by employing multi-step wizards.

In this article, we’ll use XState, as it’s one of the easiest and most efficient ways to handle state in any JavaScript application, rather than being framework agnostic.

In this article, we'll see some of the common mistakes that React developers make, and how you can avoid them.

Here I want to give you a walkthrough of my thought process, how I designed the API requirements, and how I implemented this tree table component in React eventually.

In early April, the React team released a new version of the library, React Hook Form V7. The hot take from this version is that React Hook Form now supports strictly typed forms with the help of TypeScript, which bodes well for the library’s future.

Before shipping a React app, the least any team or developer needs to do is to check the performance and look to optimize the app for the end user’s experience

How AWS provides seamless development and deployment experience for Next.js apps

In this biometric authentication tutorial, we’ll show you how to authenticate users with Face ID and Touch ID in a bare-bones React Native and Expo app.

Getting the authentication flow right when starting a new app development project saves an enormous amount of time down the road. To that end, today, we’ll learn how to create a reusable auth flow in React Native.

Next.js 10.2 introduces performance improvements (faster builds, refresh, and startup), improved accessibility, Automatic Webfont Optimization, and more.

In this article, we will build a React application using class components. Then we'll convert it to functional components using React Hooks in a step-by-step way.

As a part of this release, many of these features are tweaked for optimization while introducing a few new ones like a custom 500 error page, preview mode detection, and typescript config extension to state a few. In this article, we will explore these in more detail.

The heavy hitter of Material Design component libraries on React Native is react-native-paper, and this guide will focus on using react-native-paper to set up a starter app with the some of the most prominent and recognizable Material Design features: Hamburger Menu, Drawer Navigation, FAB (Floating Action Button), and Contextual Action Bar.

Routing in React applications using the Hookrouter

The release of React Native 0.64 introduced full opt-in support for Hermes on iOS. This promises to be a major shift in the React Native mobile app development ecosystem.

Using a GraphQL API comes with distinct advantages. With GraphQL, we can request the exact data we need without ever under- or over-fetching. We can also get multiple resources in a single request.

I’ll start with the more important, conceptual differences between Snowpack and Parcel and move on to things like running Snowpack, getting Sass compiling quickly, and getting module import paths for scripts working.