Advanced React Concepts

Understand why patterns in React is such an important topic, and learn why they are used and what problems they came to solve.

I’ve written about the challenges of creating user interfaces before. But this post talks about React in a different way — more as a programming runtime.

2018 has reached its end and it makes sense for me to start the new year with an article about Higher-Order Components!

This time I’m going to tell you about this great superpower called “render props”

React 16.6 brought code-splitting to a new level. You can now load your components when it’s really needed without installing additional libraries.

Hooks have learned from the trade-offs of mixins, higher order components, and render props to bring us new ways to create contained, composable behaviors that can be consumed in a flat and declarative manner.

In the following article, I’m going to discuss 5 concepts that will bring your React skills and knowledge to the next level.

This time I’m going to tell you about this very useful pattern in React called the container pattern or container component pattern.

Learn which component pattern will make your codebase better in which use case.

This talk is going to focus on some advanced patterns in building your react components. More over we do not know what the best way to do things and we end up feeling stressed out.

This is a livestream of part of my Advanced React Component Patterns in Portland at ChainReactConf 2018.

There are patterns that have emerged in React that allow you to promote code reuse without sacrificing the simplicity or flexibility of the component. In this talk we’ll go over 5 of these patterns that will make your React components more useful.

Making React components that can be used in multiple places is not hard. What is hard is when the use cases differ. Without the right patterns, you can find yourself with a highly complex component that requires a lot of configuration props and way too many if statements. With this course, you'll not only learn great patterns you can use, but also the strengths and weaknesses of each so you know which to reach for to provide your components the flexibility and power you need.

This talk will focus on the creative exploitation of React component architecture to render not only to DOM elements, but other targets as well, at the same time. We will explore techniques you can use to achieve this, common pitfalls, useful applications of these patterns and not so useful, but wildly entertaining applications of these patterns.

You build components with the linux philosophy. Do one thing and do it well. 👆Then assemble for bigger things. Higher order components, render props, function as children, and composite components take a different approach.

This is a livestream/recording of a (remote) talk by me at Phoenix ReactJS.

In this talk, we will explore advanced patterns and techniques in Redux inspired by old and proven design principles of large scale messaging-based systems.

Talk by Michael Chan at Full Stack Talks

Learn how to write cross platform React Native code by using effective design patterns in the JavaScript world

Notes for the Complete Intro to React v4 course on Frontend Masters.

A book about common design patterns used while developing with React. It includes techniques for composition, data flow, dependency management and more.

SurviveJS - React shows you how to build a simple Kanban. The idea is that if you can build a simple application, you can probably build something more complex after that. The first application is always the hardest.

Entire React code base explanation by visual block schemes (Stack version).

The up-to-date, in-depth, complete guide to React and friends.

A compilation of React Patterns, techniques, tips and tricks

Functional Web Development with React and Redux

Become a Senior React Developer! Build a massive E-commerce app with Redux, Hooks, GraphQL, ContextAPI, Stripe, Firebase.

Lean Modern React 16.8+ Including Hooks, Context API, Full Stack MERN & Redux By Building Real Life Projects.

Learn everything you need to build a full stack application with React.js and GraphQL

Boost your JavaScript skills by building a real-world SPA with React

Learn to build scalable React applications using the tools and techniques available in the React ecosystem

Learn to build real-world applications in React!

A series of 5 minute videos to level up your React skillset

Start building real ReactJS apps. Jump in with best practices, solid understanding and confidence.

In this course we'll be learning what React is and how to use it to make awesome, reactive SPA's. We'll also look at how we can use Redux to help with our app's state management.

Learn about the enhancements found in React 16 and how to leverage key features to build better React apps

Sophie Alpert is a core contributor to React and is currently the engineering manager for the React team at Facebook. She has been contributing to React for over 3 years now, making her first contributions while she was working as an engineer at Khan Academy.

In this episode of React Round Up, the panel discusses simple React patterns with Lucas Reis. He recently wrote a blog post about simple React patterns that really took off and became popular on the web. They talk about this blog post, what defines a successful pattern, and then they discuss the different patterns that he has discovered in his years of React programming.

In this episode of React Round Up, the panel discusses advanced component patterns and Downshift. They talk about different component patterns, especially render prop patters, and the fact that Downshift allows for your components to be much more useful generally for more people. They also note that the render prop patterns can help to separate logic from view, which makes things easier to develop.