Latest Articles & Tutorials

Next.js 11 (nextjs.org)
Jun 15, 2021
Next.js 11 continues our mission to create the best developer experience with a new conformance system and performance improvements.
Technical Guide, Part 2: Integrating Hermes with React Native (callstack.com)
Jun 14, 2021
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.
  • Mike Grabowski
How to: React Table with Sort (robinwieruch.de)
Jun 14, 2021
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.
How to Build a Custom Pagination Component in React (freecodecamp.org)
Jun 14, 2021
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.
  • Shubham Khatri
Trying out React 18 Alpha (swizec.com)
Jun 11, 2021
React 18 is here! That's the one with concurrent mode.
How to Level Up Your React Conditionals (freecodecamp.org)
Jun 11, 2021
Do you write conditionals correctly within your React applications?
  • Reed Barger
Trying Out React 18 Alpha Release (blog.bitsrc.io)
Jun 11, 2021
This tutorial will help you learn the new features already present in React 18 Alpha that I’ve been able to try myself.
  • Nathan Sebhastian
A guide to Flexbox properties in React Native (blog.logrocket.com)
Jun 11, 2021
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.
  • Spencer Carli
Using a Desktop-Like Window Interface in Your React App (telerik.com)
Jun 10, 2021
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.
  • Thomas Findlay
How to choose the right React state management solution (blog.logrocket.com)
Jun 10, 2021
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.
  • Iva Kop
Using styled-components in TypeScript: A tutorial with examples (blog.logrocket.com)
Jun 10, 2021
In this tutorial, we’ll show you how to build and style a TypeScript app using styled-components.
  • Hafsah Emekoma
How to implement AdMob in React Native with Firebase (blog.logrocket.com)
Jun 10, 2021
In this tutorial, I’ll show you how to generate extra income through ads by implementing Google AdMob in React Native.
  • Emmanuel Etukudo
Implementing swiper components in React Native (blog.logrocket.com)
Jun 09, 2021
In this tutorial, we’ll build five different React Native swiper components for various use cases using Expo.
  • Clayton Francis
Using Storybook with Bit (blog.bitsrc.io)
Jun 09, 2021
Using Storybook to render React components in a Bit workspace
  • Eden Ella
React Icons: A comprehensive tutorial with examples (blog.logrocket.com)
Jun 09, 2021
In this article, you will learn how to use the React Icons library to display icons in your React project.
  • Hussain Arif
    How to use TypeScript with React 18 alpha (blog.logrocket.com)
    Jun 09, 2021
    React 18 alpha has been released, which is very exciting! But can we use it with TypeScript?
    • John Reilly
    The Plan for React 18 (reactjs.org)
    Jun 08, 2021
    The React team is excited to share a few updates.
    Comparing React Native analytics tools (blog.logrocket.com)
    Jun 08, 2021
    In this post, we will explore the advantages of each tool and how they help developers navigate and utilize analytics within React Native.
    • Said Hayani
    Displaying images with the React Native Image component (blog.logrocket.com)
    Jun 08, 2021
    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.
    • Temiloluwa Ojo
    Why you shouldn't put refs in a dependency array (epicreact.dev)
    May 21, 2021
    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!
    React Tutorial – How to Work with Multiple Checkboxes (freecodecamp.org)
    May 13, 2021
    Handling multiple checkboxes in React is completely different from how you use regular HTML checkboxes.
    • Yogesh Chavan
    Using Forms in React (daveceddia.com)
    May 12, 2021
    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.
    Building a React Design System for Adoption and Scale (blog.bitsrc.io)
    May 12, 2021
    Achieve DS scale and adoption via independent components and a composable architecture — with examples.
    • Eden Ella
    Creating Virtual Reality Experiences with React 360 (blog.bitsrc.io)
    May 12, 2021
    Creating virtual reality experiences using JavaScript
    • Viduni Wickramarachchi
    Get Started With React By Building A Whac-A-Mole Game (smashingmagazine.com)
    May 10, 2021
    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.
    • Jhey Tompkins
    Building a tag input field component for React (blog.logrocket.com)
    May 07, 2021
    Ever wonder how to build a tag input field component for your React app? Here’s how.
    • Doğacan Bilgili
    Zustand’s Guide to Simple State Management (blog.bitsrc.io)
    May 07, 2021
    In this article, I will explore Zustand, which provides a lightweight and straightforward way of managing state in React.
    • Madushika Perera
    Understand React Context API (telerik.com)
    May 06, 2021
    Learn how the Context API works in React and the best times to use it to avoid prop-drilling in your application.
    • Leonardo Maldonado
    What Is "Lifting State Up" in React? (freecodecamp.org)
    May 06, 2021
    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.
    • Reed Barger
    Top React Native boilerplates for 2021 (blog.logrocket.com)
    May 06, 2021
    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.
    • Carlos Mucuho
    Reducing HTML Payload With Next.js (Case Study) (smashingmagazine.com)
    May 05, 2021
    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.
    • Liran Cohen
    Super Simple Start to Remix (kentcdodds.com)
    May 05, 2021
    The simplest distraction-free version of a remix app.
      Building multi-step wizards with Formik and React Query (blog.logrocket.com)
      May 05, 2021
      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.
      • Caleb Mathew
      Using state machines with XState and React (blog.logrocket.com)
      May 04, 2021
      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.
      • Ishan Manandhar
      Common Mistakes React Developers Make – And How to Fix Them (freecodecamp.org)
      May 03, 2021
      In this article, we'll see some of the common mistakes that React developers make, and how you can avoid them.
      • Yogesh Chavan
      API Design for a React Tree Table (robinwieruch.de)
      May 03, 2021
      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.
      What’s new in React Hook Form V7 (blog.logrocket.com)
      May 03, 2021
      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.
      • Chinwike Maduabuchi
      5 Techniques for Optimizing Performance on a React App (telerik.com)
      Apr 30, 2021
      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
      • Gift Egwuenu
      AWS Loves Next.js (blog.bitsrc.io)
      Apr 29, 2021
      How AWS provides seamless development and deployment experience for Next.js apps
      • Dilantha Prasanjith
      Using FaceID and TouchID in React Native and Expo (blog.logrocket.com)
      Apr 29, 2021
      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.
      • Ejiro Asiuwhu
      Building a reusable auth flow in React Native (blog.logrocket.com)
      Apr 29, 2021
      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.
      • Mukesh Mandiwal
      Next.js 10.2 (nextjs.org)
      Apr 28, 2021
      Next.js 10.2 introduces performance improvements (faster builds, refresh, and startup), improved accessibility, Automatic Webfont Optimization, and more.
        How to Build a React Application with Load More Functionality using React Hooks (freecodecamp.org)
        Apr 27, 2021
        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.
        • Yogesh Chavan
        What’s new in Next.js 10.1 (blog.logrocket.com)
        Apr 26, 2021
        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.
        • Kapeel Kokane
        Using Material UI in React Native (blog.logrocket.com)
        Apr 26, 2021
        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.
        • Farhan Kathawala
        Hookrouter: A Modern Approach to React Routing (blog.bitsrc.io)
        Apr 20, 2021
        Routing in React applications using the Hookrouter
        • Isuri Devindi
        Getting started with Hermes in React Native (blog.logrocket.com)
        Apr 19, 2021
        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.
        • Emmanuel Etukudo
        Making GraphQL requests easy with React Query and TypeScript (blog.logrocket.com)
        Apr 19, 2021
        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.
        • Iva Kop
        Migrating from Parcel to Snowpack – build tool comparison (benfrain.com)
        Apr 13, 2021
        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.
        • Ben Frain