Skip to content

Latest commit

 

History

History
102 lines (71 loc) · 3.78 KB

README.md

File metadata and controls

102 lines (71 loc) · 3.78 KB
Raw

React Fundamentals Workshop by Ben Ilegbodu

Maintenance Status Build Status license PRs Welcome

Watch on GitHub Star on GitHub Tweet

A step-by-step workshop for learning React fundamentals. Best if accompanied with live facilitation. 🙂

Many thanks!

To run completed app

Assuming you have a version of node installed, install nvm and then close & reopen your terminal.

Install the latest stable version of node (you need Node >= 6):

nvm install node

Fork the repo and create a local clone (be sure to replace <YOUR-USERNAME> with your own):

git clone https://github.com/<YOUR-USERNAME>/react-workshop.git

Change to end/ directory:

cd react-workshop/end

Install all of the dependencies (yarn is preferred):

# Yarn
yarn

# ...or NPM
npm install

Start API server (running at http://localhost:9090/):

# Yarn
yarn run start:api

# ...or NPM
npm run start:api

In a separate terminal window/tab, making sure you're still in the end/ directory, start the app:

# Yarn
yarn start

# ...or NPM
npm start

After the app is initially built, a new browser window should open up at http://localhost:3000/.

Exercises

All of the exercises make use of ES6 so you may need to brush up on the new JavaScript features if they are not familiar. Each step in the workshop builds on top of the previous one. If at any point you get stuck, you can find the answers in the source code of the given step. Any given step can be used as a starting point to continue on to the remaining steps.

You can start at the beginning. Afterwards follow these steps:

  1. JSX
  2. Environment setup
  3. Lists
  4. Fetching from server
  5. Email View
  6. Email Form
  7. Submit email form
  8. Delete email
  9. Mark unread/read
  10. Styling
  11. Email Form Modal
  12. API lib
  13. Action-Reducers
  14. Redux-y Actions and Reducers
  15. Connect App and Store

Questions

Got questions? Need further clarification? Feel free to post a question in Ben Ilegbodu's AMA!

License

MIT