VS Code + Git + GitHub Setup for Beginners (Push Your First Project)

Every deployment guide on this site starts with the same three tools: VS Code to write code, Git to track changes and GitHub to store the project online. Once your code is on GitHub, hosts like Vercel and Hostinger can deploy it automatically.

1. Install the tools

• Node.js (LTS version) from nodejs.org. It gives you node and npm.
• Git from git-scm.com.
• Visual Studio Code from code.visualstudio.com.

Check everything in a terminal:

node -v
npm -v
git --version

2. Useful VS Code extensions

• ESLint: highlights code problems while you type.
• Prettier: formats code automatically on save.
• Tailwind CSS IntelliSense: class-name suggestions if you use Tailwind.
• GitHub Pull Requests: manage GitHub from inside the editor.

3. Tell Git who you are (one time)

git config --global user.name "Your Name"
git config --global user.email "you@example.com"

4. Create a GitHub repository

Sign in to github.com, click New repository, give it a name and create it. Leave it empty; do not add a README, because you will push your existing project.

5. Add a .gitignore

Before your first commit, make sure secrets and heavy folders are excluded. In a Next.js or Node project, your .gitignore should contain at least:

node_modules
.next
.env
.env.local

6. First commit and push

Open the project folder in VS Code, then run these in the integrated terminal (Ctrl + `):

git init
git add .
git commit -m "Initial commit"
git branch -M main
git remote add origin https://github.com/YOUR-USERNAME/YOUR-REPO.git
git push -u origin main

The first push opens a browser window to sign in to GitHub. Refresh the repository page and your files are there.

7. The daily workflow

git status                  # what changed?
git add .                   # stage changes
git commit -m "Add blog page"
git push                    # send to GitHub

You can do the same from the Source Control panel in VS Code without typing commands.

8. Branches (safe experiments)

git checkout -b feature/new-tool   # create and switch
# ...work and commit...
git push -u origin feature/new-tool

Then open a Pull Request on GitHub and merge it into main when it is ready. Vercel can build a preview link for every branch, which is covered in the Vercel guide.

Note: Never commit passwords, API keys or .env files. If you do it by accident, rotate the key immediately; deleting the file later does not remove it from Git history.

Next steps

With your project on GitHub, follow the guide to deploy on Vercel (best for Next.js) or on Hostinger (WordPress, static files and Node.js apps).