Create a New Project

Create the Web Project

Before setting up Git, you need a web project that you are ready to track and eventually deploy.

If you already have a frontend project, you can use that project and continue with this guide. You do not need to create a second project.

If you are starting from scratch, a simple project can begin with a structure such as:

my-project/
├── index.html
├── css/
├── js/
└── assets/

The exact structure depends on the frontend technology you are using. A framework-based project may contain additional directories, configuration files, and a package.json file.

The important requirement for this chapter is that the project exists as a complete folder on your computer and can be run and tested locally.

Run It Locally

Before introducing Git, verify that the website works on your computer.

The command you use depends on how your project was created.

For a project that uses a Node-based development tool and defines a dev script in package.json, the usual command is:

npm run dev

The development server normally displays a local URL in the terminal. Open that URL in your browser and verify that the website loads.

A simple static HTML project may instead be opened using a local development server provided by your editor or another tool. There is no universal npm run dev command for every web project.

The important goal is not the specific command. The goal is to confirm that the project works locally before Git begins tracking it.

Understand the Project Files

Before initializing Git, it is useful to know which files belong to your project and what they are responsible for.

A simple frontend project might contain:

Framework-based projects may use a different structure. Do not change your project’s structure just to match this example.

What matters for this guide is understanding which files are part of the project and which files are generated, temporary, or local-only. This becomes important when Git is initialized and a .gitignore file is introduced.

Test the Project

Before moving on to Git, make sure the project works locally and that the files you intend to deploy are present.

At this point, check the website in your browser and verify the important parts of the project, such as:

• the main page loads correctly
• stylesheets are loading
• JavaScript works where required
• images and other assets are available
• important links and navigation work

Fix any local development problems before continuing. Git will track the project in its current state, so it is better to start with a working project.