React Newsletter #48

A Visual Guide to State in React, Using iOS Image Picker with React Native, and Building a Todo App with Create-React-App


Articles

A Visual Guide to State in React

React’s “state” is one of the more difficult concepts to learn. Not just what to put in state, but what it actually is and what it’s for. And also how Redux is related to React state. Dave Ceddia hopes to clear up some of the confusion in this article.


Tutorials

Using iOS Image Picker with React Native

Playing with React Native the other weekend, Gosha Arinich was building a simple messenger UI. One of the features was that messages could be text, but they could also be images or location. Location is easy, but getting the camera roll picker was not as well documented.

In this tutorial Gosha builds a simple app that will prompt the user to pick an image, and then display that image.

Building a Todo App with Create-React-App, Part 1

React has been notoriously difficult to get started with as a beginner, but a lot of people have jumped into the fray to help lower the barriers of entry. Tools like create-react-app make it a lot easier to dive right into making apps with React. Edem Kumodzi walks us through making an app with React using create-react-app.


Projects

Introducing Flow-Typed

Having high-quality and community-driven library definitions (“libdefs”) are important for having a great experience with Flow. Introducing flow-typed: A repository and CLI tool that represent the first parts of a new workflow for building, sharing, and distributing Flow libdefs.

JSX 2.0?

Want to bikeshed on some changes to JSX?

Simple React Bootstrap 4 Components

Easy to use React Bootstrap 4 components compatible with React 0.14.x and 15.x.

The official Semantic-UI-React integration

A lot of people's initial reaction to React is to make a bunch of reusable components for their apps. A lot of people then learn that making truly reusable components is a lot harder than it looks. You've got to cover tons of edge cases, and weird issues that components have.

Semantic-UI's react integration is the best reusable component library I've encountered. It is tested, well maintained, and has almost all of the features you might need in a typical UI. Oh and it's also 100% jQuery free, even for dropdowns and modals.

Redux for WebExtensions

This package allows you to use Redux for managing the state of your WebExtension, which is pretty freaking cool.


made with ❤️ by ui.dev