Last Updated on December 1, 2024 by Neil Murray
Table of Contents #
DEVELOPMENT #
React.js #
React | A JavaScript library for building user interfaces
Documentation #
React Docs
React.Component
Introducing Hooks
React Tools #
Create React App
React Developer Tools
React DevTools tutorial
React Bits – A compilation of React Patterns, techniques, tips and tricks.
Storybook #
Storybook Website | Docs | Github
React Storybook: Develop Beautiful User Interfaces with Ease
React Storybook Tutorial with Examples – Getting Started with React Storybook
React Component Libraries #
- Gutenberg Storybook – view and work with the Gutenberg UI components
- Semantic UI React – official React integration for Semantic UI
- Material-UI – comprehensive React Component Library based on Google’s Material Design
- Absolutely Awesome React Components & Libraries
- Why Should You Use a React Component Library for your Project?
- When to use a UI component library in a React project?
React DnD – drag & drop #
- react-beautiful-dnd | Demos | Tutorial – drag and drop for lists with React
- Sortable list with React-DnD – CodePen
React CSS Styling #
PostCSS
css loader for webpack
extract text plugin for webpack
classnames – a simple utility for conditionally joining classNames together
Passing in class names to react components
Dynamically Add Classes with React – Using classnames instead of classSet
CSS Modules #
CSS Loader – implements CSS Modules in webpack
CSS Modules
CSS Modules Webpack Demo
CSS Modules – Welcome to the Future
What are CSS Modules and why do we need them?
Getting Started with CSS Modules
CSS Modules and React
Understanding the CSS Modules Methodology
Flux Frameworks #
8 no-Flux strategies for React component communication
Reflux
Reflux
Flux vs. Reflux
Why use Redux over Facebook Flux?
What is the core difference of redux & reflux in using react based application?
Redux #
Redux
Understanding Redux: The World’s Easiest Guide to Beginning Redux
Learning Redux
Get Started with Redux – free video course by Dan Abramov
What Does Redux Do? (and when should you use it?)
Code Examples #
LEARN #
Tutorials #
Basic
Getting Started with React – An Overview and Walkthrough
React Introduction For People Who Know Just Enough jQuery To Get By (2019 version)
Start Learning React
Learning React.js: Getting Started and Concepts
Intro to the React Framework
I Learned How to be Productive in React in a Week and You Can, Too
Free React Fundamentals Course – NO LONGER FREE
Advanced
React DevTools tutorial
build with react – a periodical of tutorials and advanced articles for the react.js library
5 Steps for Learning React Application Development
Presentational and Container Components
Container Components
8 no-Flux strategies for React component communication
Articles #
20 best tools for React development
Making Sense of Hooks – An introduction to hooks by Dan Abramov
Creating Multistep Forms With React and Semantic UI
8 Key React Component Decisions
React Binding Patterns: 5 Approaches for Handling `this`
Avoid using .bind(this)
React Pattern: Extract Child Components to Avoid Binding
Another way to avoid binding in render in simple cases
Use a Render Prop!
The 100% correct way to structure a React app (or why there’s no such thing)
Writing Scalable React Apps with the Component Folder Pattern
React Demystified
Videos #
Getting Started With React Semantic UI
React Today and Tomorrow and 90% Cleaner React With Hooks
8 Tips For Getting Better At React
React Storybook Tutorial with Examples – Getting Started with React Storybook
Command Line Power User – free video series
30 Day Vanilla JS Coding Challenge – free video series
Introduction to the Command Line – by Zac Gordon
Slides #
Books #
Collections #
JavaScript Stuff
Awesome React – a collection of awesome things regarding React ecosystem
Other #
5 Projects to Help You Learn React
Formidable Playbook – a practical guide to building modern applications
Amazing open source React projects
React Blogs #
React Blog
ReactJS News
scotch.io