React Newsletter #173

New React DevTools, a comprehensive introudction to React Hooks, and building custom React hooks


News

Introducing the New React DevTools

The React team is excited to announce a new release of the React Developer Tools, available today in Chrome, Firefox, and (Chromium) Edge!

What’s changed?

A lot has changed in version 4! At a high level, this new version should offer significant performance gains and an improved navigation experience. It also offers full support for React Hooks, including inspecting nested objects.


Articles

A Comprehensive Introduction To React Hooks

This is meant to be a basic introduction to React hooks, so if all that jargon seems intimidating, don't worry, you'll go step by step into what it all means and how hooks can be useful to you. Hopefully, this article can give you some insight into the power of React hooks, the methodology behind them and at least a starting point to begin implementing them in your own projects.

Building Custom React Hooks

React hooks simplify the process of creating reusable, clean and versatile code, and advanced optimization techniques like memoization are now more accessible and easier to use. The focus of this article is going to be primarily on building custom React hooks and best practices.


Tutorials

React Projects for Beginners

This collection of 14 basic React projects gives you a chance to brush up on some React basics while building classic tutorial projects like a quote generator, tic-tac-toe game, calculator, and more.


Sponsor

React developers are in demand on Vettery

Vettery is an online hiring marketplace that's changing the way people hire and get hired. Ready for a bold career move? Make a free profile, name your salary, and connect with hiring managers from top employers today.


Projects

Reactide is the first dedicated IDE for React web application development.

Reactide is a cross-platform desktop application that offers a simulator, made for live reloading and quick React component prototyping. React brings an integrated suite of development tools to streamline react development. The days of flipping between browser, IDE, and server are over.

React Transitions

A downloadable library of 18 transitions built with React in mind, but also works well with Angular, VanillaJS, etc. This library is designed for transitioning full pages as opposed to single elements.

Divjoy - The React Codebase Generator

Divjoy is a free, web-based React codebase generator. You simply select your stack, choose a template, and then it exports a complete React codebase. You can also create new React components, write JavaScript, and tweak styles inside the tool.

NodeGUI & React NodeGUI

NodeGUI is an open source library for building cross platform native desktop applications with JavaScript and CSS like styling. NodeGui apps can run on Mac, Windows, and Linux from a single codebase. React NodeGUI is a React renderer for NodeGUI. This means you can create native views using React components.

mc.js

Open source Minecraft clone built with ThreeJS, ReactJS, GraphQL, and NodeJS.

React Final Form

Redux Final Form emphasizes its primary goals: strong typing, via both Flow and Typescript, modularity, minimal bundle size, and optional subscription based control for fine-tuning exactly when your components redraw. It's a great fit for everything from a simple login form to a complex database list of clients.


Videos

React Tetris

In this video series you'll learn to create a Tetris game using React Hooks. You'll learn to build it from scratch using useState, useEffect, useCallback, and a few custom Hooks.


made with ❤️ by ui.dev