React Newsletter #82

Fixing the callback hell of over-parenting with React, how to separate React components, and testing React apps with Jes for beginners


Articles

Fixing the callback hell of over-parenting with React

Borrowing the concept of delegation from native iOS, this is a new approach to solving the callback mess you can end up in with React.

How do you separate React components?

Sometimes it can be easy for React components to get a bit bloated, and that's not always a bad thing. James K Nelson talks about the different types of components and how they are each different in their own special way.


Tutorials

Testing React Apps with Jest and chai-enzyme for Beginners

If you're new to testing in React, check out this article. It covers testing tools, folder structure, thought process , creating tests , running the tests, and recommended resources.


Projects

ReactVT

React VT presents a live view of the React component structure of your app, along with current state and props.

Users can define assertions and test them in real time while interacting with their application. Once the user is satisfied with their defined tests, they can export their assertions into an Enzyme file."

Introducing downshift 🏎️ for React ⚛️

downshift 🏎 is the primitive you need to build simple, flexible, WAI-ARIA compliant React autocomplete/typeahead/dropdown/select/combobox/etc (AKA “item selection”) (p)react ⚛️ components.

Redux-tiles: less verbose Redux code

Redux is my favorite way to manage state in my React apps, but for most people it can feel a bit verbose. Seva Zaikov attempts to solve this problem with Redux-tiles, a minimal abstraction on top of Redux.

Create-react-library!

When create-react-app was first conceived, there was a lot of talk of a similar project for React libraries. This project has taken a shot at this problem with create-react-library.

Redocx: 📄 Create word documents with React

redocx is a library which lets you create word documents with React. It provides a set of components which renders your declarative views and components to word documents.


Videos

bitcoin price chart with vx

Join @hshoff as he walks you through making a 30 day Bitcoin price chart with react + vx + next.js. Recommend watching at 2x speed.


made with ❤️ by ui.dev