Easy React Project Set-Up

You know what they say, taking the first step is the key to getting started. Easy as they are, there are a few steps to set up a new project. I put them all in one place so I no longer have to google the individual tasks each time. This post is focused on setting up a project using create-react-app.

Step 1: Create a local React directory

In your terminal run the following commands to use create-react-app, where my-app is the name of your project.

npx create-react-app my-app
code my-app

Step 2: Clean up the create-react-app files

The files created in your new project require some clean up to have a fresh start.

• Open App.js and remove code between the header tags
• Open index.html and change the name and content as well as the text in title tag
• Delete react png files in the public directory
• optionally insert your own favicon
• Delete everything in App.css

Step 3: Create a Github repository

Click the new repository button in GitHub and select a unique name. You don't need to initialize with a README.md if you used create-react-app
create repository

Step 4: Connect your repository to your local project

Use the instructions Push an existing repository from the command line

git remote add origin 'your_url_name'
git push -u origin master

Step 5: Change Master to Main

While this step is optional, I think it's important. @afrodevgirl has created an excellent resource.

Follow this post to change master to main
https://dev.to/afrodevgirl/replacing-master-with-main-in-github-2fjf

You should now have a blank React canvas to begin developing. Five easy steps to start your React project!