This workshop will give a whirlwind tour of React and Redux, demonstrating the core principles and providing a platform to build on.
We will learn about React and build React components using the well-known Todo application as our use-case. After making a few components and making them render to the screen, we'll install Redux. We'll then move our state over to be handled by Redux and inject it back into React.
Time estimate: 4-6 hours
- Google Chrome
- Extension: "React dev tools"
- Extension: "Redux dev tools"
- An text editor that understands JavaScript and React (Atom, Visual Studio Code, Sublime Text, etc). If you're using Atom, you'll need to install the plugin
react
as well. - NodeJS (latest) and npm (latest). Run
node -v
andnpm -v
to check what version you have. Check the latest version at NodeJS.org and upgrade if you're out of date.
- Start by cloning this repository into a folder on your computer. If you've never used git before, you can alternatively use the the "Download ZIP" button to the right.
- Although you have this
README.md
file on your computer it's easier to read it on GitHub, so we recommend you keep this page open with the exercise tasks.
This repository contains a set of exercises organized in folders. Each folder contains a README.md
describing the exercise.
- Exercise 1 (start here)
- Exercise 2
- Exercise 3
- Exercise 4
- Exercise 5
- Exercise 6
โ๏ธ - A task you should do ๐ - A section of text to read (no tasks, just information). ๐ก - Additional information. โ - Something important. โ - Open-ended question for the reader ("What do you think would happen if...") ๐ฉ - Bad practice (don't-do-this) โญ - A bonus task (not required)
Will look like this:
CTRL + ALT + C
Emphasizes how lines of text should change.
- this text was removed
+ and replaced with this text
These excercises were originally forked from the excellent React and Redux workshop materials by Bergen Nerdschool.