React Newsletter #240

Chakra UI v1, Gatsby's new file system route API, and optimizing React Native at Coinbase


News

New TypeScript Course + Black Friday Sale

Some business news to start off the issue. We just released a new TypeScript course. It contains everything you need to feel comfortable writing production-ready TypeScript applications. And by everything, we mean everything -- check out these stats.

  • 55 Topics
  • 316 Minutes of Video
  • 52,304 Words of Text
  • 30 Quizzes
  • 9 Exercises
  • 2 Projects

And for the next week, you can get 25% off during our Black Friday sale which gets you access to all our courses (including the new TypeScript course), exclusive weekly events, and private newsletters.

And if you order within the next 10 minutes we'll also throw in a free, limited-edition ShamWoW.

Chakra UI v1 Released

This release was a long time coming, and we're super excited for the Chakra UI team! Highlights include:

  • Additional support for React 17 and Emotion 11
  • Component Theming API
  • Color mode improvement
  • Better TypeScript support
  • Theme-aware sx prop

Gatsby Announces new File System Route API

In the past, Gatsby has created individual routes for files inside the pages folder and programmatically created pages via APIs that are exposed inside gatsby-node.js. The new File System Route API will let you move this route creation logic out of gatsby-node.js and into the file name of a file inside the pages folder.

Relay 10.1.0 Released

Facebook's production-ready GraphQL client for React had a new minor release last week, which added two new declarative mutation directives for inserting a node to connections, various minor improvements and fixes to the loadQuery API, and the ability for useQueryLoader to now accept an initial query reference (and lots more).


Articles

Understanding React's useReducer Hook

In this comprehensive post (and video), you'll learn everything you need to know about React's useReducer Hook for managing complex state.

Optimizing React Native

Over the past eight months, Coinbase has been rewriting its Android app from scratch with React Native. Read about some of the performance challenges the encountered and overcame along the way.


Tutorials

Optimize React Apps PageSpeed Insights Score

In this tutorial, Ziad demonstrates how he would optimize the performance of his company's server-side rendered web app using Google's PageSpeed Insights tool.

How to Build a Full Stack App with AWS Amplify and React

Sam walks through how to use AWS Amplify and React to create the app login, add a database and work with the data, add file storage and use those files, and to allow users to upload their own files and data.


Sponsor

React Table component

ReactDataGrid is a feature-rich, blazing fast pure React component, available in MIT or Commercial editions. It comes with built-in support for data binding, sorting, paging, grouping, inline edit, locked columns, row pining, movable/resizable columns and much more...


Projects

Wasp - Web Application Specific Language

A new declarative language for building full stack Javascript web apps with as little boilerplate as possible. It's open-source and integrates with React/Node.js/Prisma. The creators just released the alpha and are looking for contributors to help out with what looks to be a pretty ambitious project.

beautiful-react-diagrams

A collection of lightweight React components and hooks to build diagrams with ease.

Valtio

Valtio makes proxy-state simple for React and Vanilla. Check out the CodeSandbox to see it in action.


Videos

React meetup videos from October 2020

A collection of three great React talks from three different virtual React conferences and meetups in October.

made with ❤️ by ui.dev