React Examples

This repository houses React examples used as part of The Odin Project's React course.

How To Add A React Example

These steps should only be done if a maintainer has assigned you to make a new React example for a lesson. This will only happen as part of a discussion in an issue in our curriculum repo.

1. Read through the contributing guide.

2. Make sure you have Node and npm installed. You may use the Installing Node.js lesson to install these tools.

3. Fork & clone this repository. Install dependencies by running npm install.

4. Create a new example folder by copying the boilerplate folder, then cd into it. You do not need to add dependencies or npm scripts as these are shared in the repo root.

   cp -R ./boilerplate ./<example-name>
   cd ./<example-name>

5. Code out your example.

6. Start the dev server with npm run dev to make sure the example runs as expected. Make sure you are in the example directory (not a subdirectory or the repo root) when you run this.

7. Run npm run lint for ESLint and Prettier to lint and format the code.

8. Create a pull request. Make sure to provide a link to the PR in the curriculum repo for the associated lesson changes (if you make this PR first, you can edit the curriculum PR link in once done).

Naming Examples

Make sure that examples are clearly named, meaning they should convey what the example is about on a glance. Examples:

// bad
example-1
state-example
arrays

// good
hello-world
passing-props
rendering-arrays-in-jsx