What's new in React

Latest Articles & Tutorials

Understanding Client-Side GraphQl With Apollo-Client In React Apps (smashingmagazine.com)
Jul 29, 2020
We’ll be taking a closer look at a few basics of GraphQL and Apollo Client, as well as how to work with both of them. By the end, we’ll have built a pet shop app that uses Apollo Client. Then, you can go on to build your next project.
  • Blessing Krofegha
How and Why You Should Use React Query (blog.bitsrc.io)
Jul 29, 2020
Simplify data fetching with react-query’s custom hooks.
  • Nathan Sebhastian
How to Set Up a React App with Parcel (freecodecamp.org)
Jul 29, 2020
For a long time Webpack was one of the biggest barriers-to-entry for someone wanting to learn React. There's a lot of boilerplate configuration that can be confusing, especially if you're new to React.
  • Bob Ziroll
Use ternaries rather than && in JSX (kentcdodds.com)
Jul 28, 2020
What problems can happen when you use && to conditionally render content in JSX
Creating reordered lists with Sortable.js and React (blog.logrocket.com)
Jul 28, 2020
In this tutorial, we’re going to explore the official support for React via the react-sortablejs wrapping component. Let’s analyze how Sortable.js organizes a list of items by creating, editing, and deleting some of them.
  • Diogo Souza
Next.js 9.5 (nextjs.org)
Jul 27, 2020
Next.js 9.5 introduces Stable Incremental Static Regeneration, Custom Base Path, Redirects and Rewrites, Webpack 5 Beta, and more!

Latest Video Guides & Talks

React to PDF Printing (youtube.com)
Aug 01, 2020
We will learn how to convert anything inside React component into PDF file and be able to print. Let's find out, guys!
  • Hong Ly
    Integrate Custom Drawer animation component in React Navigation v5 (youtube.com)
    Jul 31, 2020
    In this tutorial we will build a custom drawer in React Native using SVG, Masked View and vanilla Animated API from React Native. We will go through how to animate a Polygon in React Native, how to animate the inner content of the drawer and how the React Native MaskedView is working.
    • Catalin Miron
    JSX Tips and Gotchas for Beginners (youtube.com)
    Jul 31, 2020
    In this video you'll learn a bunch of tips and tricks for dealing with JSX.
    Creating a User Registration form with react-hook-form (youtube.com)
    Jul 31, 2020
    We'll create a User Registration Form in Next.js using react-hook-form, testing its validation with react testing library.
    Cards — React Native Fashion (youtube.com)
    Jul 31, 2020
    In this series, we are building a React Native App from 0 to 1.
    Drawer — React Native Fashion (youtube.com)
    Jul 30, 2020
    In this series, we are building a React Native App from 0 to 1.

    Latest Books & Guides

    Learning React, 2nd Edition (oreilly.com)Get it on Amazon
    Jun 30, 2020
    If you want to learn how to build efficient React applications, this is your book. Ideal for web developers and software engineers who understand how JavaScript, CSS, and HTML work in the browser, this updated edition provides best practices and patterns for writing modern React code. No prior knowledge of React or functional JavaScript is necessary.
    The Ultimate Guide to React Native Optimization (callstack.com)
    May 14, 2020
    This guide is a collection of the most relevant and effective tips, tricks, tactics, and solutions for optimizing React Native apps. They are based on our experience as senior developers and Core Contributors to React Native.
    • Mike Grabowski
    • Jakub Mazurek
    The Road to learn React (roadtoreact.com)
    Feb 24, 2020
    The Road to learn React book teaches you the fundamentals of React. You will build a real world application along the way in plain React without complicated tooling.
    The Next.js Handbook (flaviocopes.com)
    Nov 19, 2019
    I wrote this book to teach you all I know about Next.js!
    Build your own React (pomb.us)
    Nov 13, 2019
    We are going to rewrite React from scratch. Step by step. Following the architecture from the real React code but without all the optimizations and non-essential features.
    • Rodrigo Pombo
    Learn React Hooks (packtpub.com)
    Oct 18, 2019
    Create large-scale web applications with code that is extensible and easy to understand using React Hooks.
    • Daniel Bugl

    Latest Courses & Video Series

    Design Systems with React & Storybook (frontendmasters.com)
    May 12, 2020
    In this course, you'll create a design system from scratch and learn the foundational design concepts that go into one. You'll design your components using Figma, then take those designs and turn them into coded components using React.
    • Emma Bostian
    React: The Big Picture (pluralsight.com)
    May 11, 2020
    Interested in React? This course explores why React is worth considering, tradeoffs to consider, and reasons React may, or may not be the right fit for you.
    React Native, v2 (frontendmasters.com)
    May 05, 2020
    Leverage your JavaScript and React skills for mobile iOS and Android platforms using React Native. Examples in this course allow you to get started quickly and see your changes immediately in React Native using Expo, or use pure React Native standalone if you prefer. You’ll use native components for rendering lists, building forms, and styling them with CSS.
    • Kadi Kraman
    The Road to React: The one with Hooks (educative.io)
    Apr 21, 2020
    In this course you will take a deep dive into React fundamentals, covering all new React concepts including Hooks. I do address some legacy features in case you’re working with an older codebase, but the majority of this course will focus on working with modern React. You will learn how to style your app, techniques for maintaining your app, and some more advanced concepts like performance optimization.
    Using TypeScript with React (educative.io)
    Apr 21, 2020
    In this course, you will learn how to utilize TypeScript’s sophisticated type system to make React development faster and your code more readable. You will learn how to create component props, state, and events that are strongly-typed, allowing you to quickly understand what you can pass and helping you avoid mistakes.
    • Carl Rippon
    React Tracked: Creating Web Apps with Global State (educative.io)
    Apr 21, 2020
    In this course, you will create a to-do app. But before diving into creating an application, you’ll first learn how React Tracked can solve common performance issues around render optimization. Once you learn how to work with this library, you’ll then build a to-do app through two different methods.
    • Daishi Kato

    Latest Podcast Episodes

    Smashing Podcast Episode 18 With Mina Markham: How Can I Learn React? (smashingmagazine.com)
    Jun 16, 2020
    In this episode of the Smashing Podcast, we’re talking about learning React. What’s React like to work with, and how can experienced developers get started? Drew McLellan chats to Mina Markham to find out.
    • Drew McLellan
    • Mina Markham
    Michael Chan Encapsulates State (kentcdodds.com)
    May 19, 2020
    Michael Chan talks about co-location, encapsulation, and CSS grid.
    Tanner Linsley Separates UI State And Server State (kentcdodds.com)
    May 19, 2020
    Tanner Linsley talks about creating libraries and separating UI state and server state.
    Matt Perry on Magic Motion and React Performance Anxiety (reactpodcast.com)
    May 14, 2020
    This week Matt Perry tells about Magic Motion — the killer new feature for Framer Motion that makes shared element transitions easy for React developers.
    Chance Strickland on Reach UI and Building Composable Open Source (reactpodcast.com)
    Apr 30, 2020
    Chance Strickland and chantastic talk about Reach UI and building flexible libraries for the web. They talk about separation of logic with statecharts, the cascading complexity of accessibility, unopinionated approaches to styling, and the career effects of great open source.
      Building Full-Stack JS Apps with Redwood.js (fullstackradio.com)
      Apr 22, 2020
      In this episode, Adam is talks to Tom Preston-Werner about Redwood.js, a new full-stack JavaScript framework for building edge-ready web applications.
      • Adam Wathan
      • Tom Preston-Werner

        Latest Library Releases

        pimg (pimg.surge.sh)79
        v1.2.1
        Aug 12, 2019
        Pimg is a Progessive Image Component For React, Preact and Vue.js.
        • Ademola Adegbuyi
        react-hot-loader (gaearon.github.io)10246
        v4.12.11
        Aug 12, 2019
        Tweak React components in real time
        react-intl (github.com)9446
        v3.1.6
        Aug 12, 2019
        Internationalize React apps
        reakit (reakit.io)1573
        v1.0.0-beta.5
        Aug 12, 2019
        Toolkit for building interactive UIs with React
        • Diego Haz
        flow-bin (flow.org)18943
        v0.105.1
        Aug 11, 2019
        Adds static typing to JavaScript to improve developer productivity and code quality
        react-bootstrap (react-bootstrap.github.io)15007
        v1.0.0-beta.11
        Aug 10, 2019
        Bootstrap components built with React.
        • Jimmy Jia
        • Alexander Shemetovskiy
        • Jason Quense
        • Stephen J. Collings
        • Matt Smith
        • Pieter Vanderwerff

        Latest Jobs

        Front End Engineer (React.js) (snap.hr)
        Hostmaker
        Oct 31, 2019
        Hostmaker is a Series B funded fast-growing business backed by institutional funding from technology, hospitality and real estate investors. We’re looking for passionate Front End Engineers to join our global tech and product team. Ideally, you will have at least 3+ years’ on-the-job Front End experience.
            Experienced React Engineer (jobs.lever.co)
            Formidable / Phoenix, US
            Sep 24, 2019
            Formidable is a Seattle, Denver, Phoenix, and London-based boutique engineering consultancy and open source software organization, specializing in React.js, React Native, GraphQL, Node.js, and the architecture of large-scale JavaScript applications. As a React Engineer at Formidable in our Phoenix Office, you will implement new applications, features, and tools for companies ranging in size from startups to Fortune 100s.
                React Native Engineer (stackoverflow.com)
                Codal / Remote
                Sep 17, 2019
                Codal is a UX design and development agency with a focus on blending an Agile process with the latest technologies. Codal is searching for an experienced React Native developer, a software engineer who specializes in the mobile app framework.
                    Frontend Engineer (alacrity.workable.com)
                    Alacrity / London, UK / Remote
                    Sep 04, 2019
                    Alacrity is a well funded early-stage startup founded by seasoned legal, finance and procurement professionals. We're looking for a mid-level frontend engineer to build high-quality, well-tested, and robust web application. You will have a chance to get involved in the application architecture decisions as well as product design. Ideal candidates will be self-motivated, collaborative, passionate, open to new ideas as well as happy to mentor others.
                        Remote Senior Full-stack JavaScript Engineer (React / Node.js) (notion.so)
                        Aula / Remote
                        Sep 04, 2019
                        Aula is a remote-first 50-person team building a social learning platform. Our mission is to enable all educators to engage all students. We’re looking for a seasoned full-stack engineer to build features across the entire stack (front-end, back-end, mobile) and challenge our thinking on architecture.
                            Senior React Native Developer (mobiquityinc.com)
                            Mobiquity / Remote (US)
                            Aug 23, 2019
                            Mobiquity is a digital consultancy that partners with the world's leading brands to design and deliver compelling digital products and services for our customers. We are searching for Senior React Native developers to join our team! We have multiple openings working with a number of different teams to build different solutions for our clients.