How to Create React/Next.js App with a Fresh GitHub Repo

#react #github #nextjs #javascript

In this article, you will be creating a super-simple Nextjs/React application locally and a GitHub repository linked to this application.

What do I need? (software used)
Visual Studio Code — for writing the code.
Google Chrome — f_or viewing your application._
Nodejs — for installing other required packages.
GitHub — for hosting your source code online.
Git — for file tracking.

How do you Install it?
Installation information is not provided here. Bookmark this page, while you find out how to install it.

Let’s get to the fun part.
In three steps,

Step 1 — Create a GitHub Remote Repository

Go to GitHub’s website here. Log in or Create an account.
Click the + icon on the menu bar of your account. And create a new repository.

Configure your repository, by giving it a name. (in my case, newapp)

IMPORTANT: Do not select “Add a README file”. Similarly, Do not “Add .gitignore”.

Step 2 — Create your Application Locally

In your desired folder/directory on your PC, run the following command to create your Nextjs app.

npx create-next-app@latest newapp
cd newapp

Optionally, to create your react app, run the following commands in your terminal

npx create-react-app newapp
cd newapp

Step 3 — Connect Local Application to Remote Repository

In the specified folder/directory, run the following commands on your terminal.

git init
git add .
git commit -m "first commit"
git branch -M main
git remote add origin https://github.com/your-username/your-repo-name.git
git push -u origin main

Replace “your-username” and “your-repo-name” with your GitHub username and repository.