What's new in React

Latest Articles & Tutorials

Animated Sparkles in React (joshwcomeau.com)
May 19, 2020
On the web, we have two semantic tags we can use when we want to indicate that part of a sentence is particularly significant: <strong> and <em>.
React Native Accessibility: What, Why, and How? (callstack.com)
May 19, 2020
What is accessibility, why do you need it, and how to implement it in your app?
  • Luke Walczak
What is Tailwind CSS and How Can I Add it to my Website or React App? (freecodecamp.org)
May 19, 2020
CSS is a technology that can be your best or worst friend. While it's incredibly flexible and can produce what seems like magic, without the proper care and attention, it can become hard to manage like any other code. How can Tailwind CSS help us to take control of our styles?
  • Colby Fayock
Unit Testing React components with Cypress (itnext.io)
May 19, 2020
Cypress 4.5.0 is out with a long-awaited feature: first-class support for framework’s components render.
  • Stefano Magni
Handy new features in Next.js 9.4 (netlify.com)
May 18, 2020
Next.js 9.4 came out this past week, and boy howdy, there are some cool things that came out. My favorites though are Fast Refresh, Absolute Imports and Aliases, and Web Vitals Reporting!
  • Cassidy Williams
How To Create A Mobile App In Expo And Firebase (For iOS And Android) (smashingmagazine.com)
May 18, 2020
In this article, based on my experience with creating a GPS and navigation application, I will show you how to create a mobile app using Expo and Firebase services such as Firestore, Firebase functions and Expo push notifications.
  • Chafik Gharbi

Latest Video Guides & Talks

WhatsApp Photos - “Can it be done in React Native?” (youtube.com)
May 19, 2020
In this video, we are looking at the WhatsApp Photos user-interaction.
Google Maps & Google Places in React (youtube.com)
May 18, 2020
This video covers a "Bear Sighting" React App where we learn how Google Maps, Google Places, and browser geolocation works. All using modern React (hooks) and up to date packages for 2020.
    Writing a Custom Hook: useEventListener (youtube.com)
    May 18, 2020
    React doesn't have a great way to create a global click handler, so we're going to be creating a custom Hook to fulfill our needs!
    • Harry Wolff
    Mocking Fetch in React Components (youtube.com)
    May 17, 2020
    In this video we'll test that a react component renders correctly when making a fetch call via the useSWR hook. We then mock the function that calls fetch, rather than fetch itself, to focus on the interface rather than the internal implementation details.
    Writing first React component test (youtube.com)
    May 16, 2020
    In this video, we will write our first React component test using cypress-react-unit-test and Cypress.
    • Gleb Bahmutov
    Expo: Universal React (youtube.com)
    May 16, 2020
    Watch Evan demo universal login, html elements, PWAs and more!

    Latest Books & Guides

    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
    Framer Guide to React (framer.com)
    Oct 01, 2019
    In recent years, React has become the de facto way to build big and fast web apps in JavaScript. This is great news for designers, because React is component-based and naturally aligns with the way designers work today. If you’ve been wanting to dive into React, then this is the e-book for you.
    • Koen Bok

    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

    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
        Continuing to Innovate with Next.js 9.3 (fullstackradio.com)
        Apr 08, 2020
        In this episode, Adam is talks to Tim Neutkens about what's new in Next.js 9.3 and how it's changing the way applications are built at ZEIT.

        Latest Library Releases

        pimg (pimg.surge.sh)79
        Aug 12, 2019
        Pimg is a Progessive Image Component For React, Preact and Vue.js.
        • Ademola Adegbuyi
        react-hot-loader (gaearon.github.io)10246
        Aug 12, 2019
        Tweak React components in real time
        react-intl (github.com)9446
        Aug 12, 2019
        Internationalize React apps
        reakit (reakit.io)1573
        Aug 12, 2019
        Toolkit for building interactive UIs with React
        • Diego Haz
        flow-bin (flow.org)18943
        Aug 11, 2019
        Adds static typing to JavaScript to improve developer productivity and code quality
        react-bootstrap (react-bootstrap.github.io)15007
        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)
        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.