Fullstack React is a weekly newsletter about the React ecosystem with an emphasis on useful libraries, tutorials and code. Subscribe to read the best articles each week on React, Flux, GraphQL, Relay, and friends.

Subscribe with Email

Email

No spam, ever. We'll never share your email address and you can opt out at any time.

Tutorials

Twitter’s mobile website is on a new web stack which includes React and Redux 🎉. Ryan Johnson uses React Developer Tools to dig deep into Twitter's Redux store and deconstruct how they've organized all those tweets.

Last week we highlighted Part 1 of Alex Grigoryan's series on how WalmartLabs builds reusable components. This week he takes a look how to build React components for multiple brands and applications. WalmartLabs' application architecture is centered around multi-tenancy/multi-branding — which is the act of building a component for one brand and then adopting it for other brands with different visuals or content. In the article you’ll find their multi brand strategy for React components.

JavaScript single-page applications (SPAs) have made a huge leap in the last couple of years. Even in 2017, not everything is a SPA. So what do you do when you need to add some interactive widget to a mostly static backend-driven website? For all those sliders, tabs, feedback forms and so on, is jQuery still the best option?

In this article, Dmitri Pisarev offers an overview of the architectural steps between a jQuery plugin and a full-fledged SPA. At each step you decide if pros outweigh the cons and move on. The trick is to bring in as many abstractions as you need and not more.

Code

Last September, The New York Times announced kyt: a web application configuration tool similar to create-react-app.

Every sizable JavaScript web app needs a common foundation: a setup to build, run, test and lint your code. Fortunately, there’s a multitude of tools to assist you, but they have one downside: extensive configuration. It’s not uncommon to see a combined several hundred lines of configuration and script before you can start building your product.

kyt is designed to abstract away complicated configurations and allow developers to focus on writing their source code, while still having the power to make important choices about their app.

Reactivemaps is a React based components library for building realtime maps. It is built on top of the appbase.io realtime DB service and ships with 20+ components for Lists, Dropdowns, Numeric Range, Sliders, Data Search, Places Search, Distance Slider and Dropdowns, Calendars, Feeds and Maps.

redux-query is a library for querying and managing network state in React/Redux applications. The engineers at Amplitude investigated similar tools such as GraphQL, Relay and Falcor and didn't find they met the right requirements for their needs.

redux-query is a solution for any React/Redux-based web apps that depend on REST APIs. It lets you store all of your network state inside your existing Redux store with minimal boilerplate and some great features like automatic request cancellation, optimistic updates, response caching and deduplication.