Quick overview of Create-React-App

Create-React-App already does all of the hard work of setting up a development environment for you. From here, you just need to create the components and stylesheets (if any).

For this chapter, we’re going to keep all components and their children in their own directory.

src/
- components/
  - Login/
    - Login.jsx
    - LoginForm.jsx
    - styles/ (if any)
      - Login.css

Login.jsx will act as the container with LoginForm.jsx nested inside it. Setting up the components this way will let you move or add your login form anywhere in the application.

The app structure

You are going to be renaming some files, creating directories for your assets, and creating directories for your components. At a very high level, your directory structure inside the src folder should resemble this...

src/
  - assets/
  - actions/
  - components/
    - ComponentName/
      - ComponentName.jsx
      - ComponentNameChild.jsx
      - ComponentNameOtherChild.jsx...