- Create React App.
- Matt Zabriskie for his react-workshop upon which this one is based.
- React Docs. Some examples have been lifted from there.
This repository has been used to teach React several times and has been updated a few times as well.
If you're following along from this recording,
then you can get to the right spot by running git checkout aca94d7
before running the setup script.
You need to have the latest node
, npm
, and git
installed. Then run:
git clone https://github.com/siirila/react-workshop.git
cd react-workshop
npm run setup
If you didn't get any errors running the setup scripts, you're ready to start the workshop! ๐ ๐
If you want to explore a bit, there are a few things you can do:
- go ahead and open
intro/exercises-final/01-js.html
in a browser (don't peak at the solution!). It should sayHello World
. Go ahead and open the others if you like. - Then you can run
yarn run storybook
and openhttp://localhost:9009
and poke around the storybook for our exercises :) - Then you could run the app with
yarn start
. This should pop open a window with a stopwatch which we'll be building.
If you see any errors, read the output and try to follow any instructions. If that doesn't work, feel free to file an issue to ask for help and I'll help if I can. Good luck!
- Bare-bones React rendering -
intro/exercises/01-js.html
- React rendering with JSX -
intro/exercises/02-jsx.html
- Custom React Components -
intro/exercises/03-components.html
- Re-rendering -
intro/exercises/04-re-rendering.html
- Props -
src/exercises/01-props.js
- PropTypes -
src/exercises/02-prop-types.js
- Styling -
src/exercises/03-styling.js
- Composition -
src/exercises/04-composition.js
- State -
src/exercises/05-state.js
- State -
src/exercises/06-state.js
- Uncontrolled Form -
src/exercises/07-uncontrolled-form.js
- Controlled Form -
src/exercises/08-controlled-form.js
- Data Fetching -
src/exercises/09-data-fetching.js
- Higher Order Components -
src/exercises/10-hoc.js
- Render Callback -
src/exercises/11-render-props.js
Check out react-jest-workshop
Check out react-github-profile
Thanks goes to these people (emoji key):
Matt Zabriskie ๐ป |
Kent C. Dodds ๐ป ๐ ๐ |
Jordan Nielson ๐ป |
Siddharth Kshetrapal ๐ |
Ray Gesualdo ๐ป |
Igor Konovalov ๐ป |
---|
This project follows the all-contributors specification. Contributions of any kind welcome!
MIT