React Newsletter #53

The magic behind styled-components, a practical guide to Redux, and what is a thunk function?


Articles

The magic behind đź’… styled-components

Ever wonder what styled-components are doing under the hood? Now you'll know.

A Practical Guide to Redux

This is a hands on guide for setting up Redux in a React project. The post includes a repo and demo app to help you get up and running with Redux as painlessly as possible.

What the heck is a 'thunk'?

Spoiler alert! A thunk is a function that is returned by another function! I am still not sure why they didn't just call it a funfunction but hey, that's just me.

Dave Ceddia talks about thunks and how we can use them effectively in our code!

Should you store your form state in Redux?

In the world of Redux there are a couple different ways people are thinking about how and when to use it. Some people say you should use Redux everywhere, while others say that it should be limited. Gosha Arinich weighs in on this issue with his thoughts on the matter.

Why Redux need reducers to be “pure functions”

You may have heard that Redux depends on “pure functions” from functional programming. Well, what exactly does that mean? Raja Rao DV is going to tell us!

Rules For Structuring (Redux) Applications

It can often be hard to figure out a good application structure when starting with a new technology. Usually documentation isn't going to get deep enough to tell you how to outline your app. In this article Jack Hsu lays out his method for architecting his frontend apps with Redux.


Tutorials

Go React native with restdb.io and Auth0

Building a fully functional react-native app with persistence and authentication is surprisingly easy. Using restdb.io for cloud hosted data and Auth0 for user authentication, you get lots of features right out of the box. Follow the steps in this post and you’ll be up and running in no time.


Projects

React Router + Firebase Auth Example

If you're using Firebase and React Router and are curious how you set up out with React Router V4, check out this guide form Tyler McGinnis

React Native Touchbar

TouchBar for react-native-macos!


Videos

ReactCasts #7: Hot Module Replacement in Create-React-App

Hot Module Replacement (or HMR) is a WebPack feature that allows "on the fly" module updates for your app. Create-React-App uses WebPack internally, but HMR working out-of-the-box only for for stylesheets (and not for React components). This episode discusses the reasoning behind this and shows two ways you can add Hot Module Replacement to projects created with Create-React-App.


made with ❤️ by ui.dev