BYOS
1. Git
2. npm
3. Babel
4. Webpack
5. Compile
6. Express
7. React
Done

Build Your Own Starter

Warning: This tutorial was not designed for smaller screens and may not be formatted well.

Have you ever been overwhelmed by a React starter project? Too many dependencies that you don't understand?

Put that all aside. This tutorial will walk you through the process of building your own React starter project... from scratch.

How it works

In each step, you'll add one feature or dependency to your starter project.

When you're done, you'll have a starter project exactly like ahfarmer/minimal-react-starter.

If you use that starter on future projects, you'll understand every line and be able to easily add additional dependencies.

Step structure

Each step has some discussion at the top, and below a list of directions to follow.

On the right side is the file structure, with a display similar to your IDE. Files that are new for the current step show up in green. Files that have changed are orange.

Prerequisites

Before beginning this tutorial, you should have the following:

  • Basic knowledge of JavaScript, CSS, and HTML.
  • Basic knowledge of the terminal. We'll tell you what to type but you should know how to open your terminal and how to navigate directories within it.
  • Node and npm should be installed on your computer.

Press Next to move on to the first step!

foldermy-project
In the next step, project files will appear here.