Skip to content

Beginner · What full-stack development is · topic 4 of 34 · 30 min

Setting up your tools

Explanation

You need a code editor (VS Code), Node.js (the current LTS version) with npm, Git with a GitHub account, and basic terminal skills. Then you create the Notes app folder with client and server parts, a package.json with scripts, a .gitignore that keeps node_modules and .env out of Git, and a README.

The tools and what each one does

ToolWhat it isCheck it works
VS CodeA free code editor with a built-in terminalOpen a folder and create a file
Node.jsRuns JavaScript outside the browser, on your computer or a servernode -v
npmInstalls packages (ready-made code) and runs scripts; comes with Node.jsnpm -v
GitSaves versions of your code on your computergit --version
GitHubA website that stores your Git projects online and shows them to othersSign in at github.com
Think of it like this: Setting up is like opening a new kirana shop. You fix the shelves before stock arrives (the project folders). You keep a stock register listing every item and supplier (package.json). You write every day's changes in a ledger, so you can always look back at what changed and when (Git commits). And the cash goes in a locked drawer that customers never see (the .env file with secrets).

Node.js: pick the LTS version

LTS means Long-Term Support: a version that gets bug and security fixes for a long time. Even-numbered major versions (22, 24, 26 and so on) become LTS; odd-numbered ones are short-lived. At the time of writing (October 2026), Node 24 is LTS and Node 26 is due to become LTS soon. Always install the version nodejs.org marks as LTS on the day you install.

The terminal in five commands

The terminal is a window where you type commands instead of clicking. VS Code has one built in (View, then Terminal). On Windows, PowerShell or Git Bash both work.

bash
pwd                 # print the folder you are in
ls                  # list files (dir also works in Windows cmd)
mkdir notes-app     # make a new folder
cd notes-app        # go into it
cd ..               # go back up one folder
Enough terminal to start. The text after # is a comment, not part of the command.

npm and package.json

package.json is the project's ID card and stock register. It lists the project name, the packages it depends on, and scripts: short names for longer commands. You run a script with npm run <name>, for example npm run dev. npm also writes package-lock.json, which records the exact versions installed; commit it so everyone gets the same versions.

json
{
  "name": "notes-server",
  "version": "1.0.0",
  "type": "module",
  "scripts": {
    "dev": "node --watch src/index.js",
    "start": "node src/index.js",
    "test": "node --test"
  },
  "dependencies": {
    "express": "^5.1.0"
  }
}
A small package.json for the Notes app server. node --watch restarts the server when you save a file.

Git and GitHub basics

A commit is a saved snapshot of your project with a message saying what changed. Pushing sends your commits to GitHub. A branch is a separate line of work: you can try a feature on a branch without breaking the main code, then merge it back when it works. Note that GitHub does not accept your account password for git push: sign in through the browser window Git opens for you (Git for Windows includes this), or set up an SSH key.

bash
git init                      # start tracking this folder
git add .                     # choose all changed files for the next commit
git commit -m "Set up project folders"
git branch -M main            # name the main branch "main"
git remote add origin https://github.com/<your-name>/notes-app.git
git push -u origin main       # send commits to GitHub
git switch -c add-search      # make and move to a new branch
The first commands for a new repository. Replace <your-name> with your GitHub username.

The Notes app folder layout

output
notes-app/
  client/          React frontend (its own package.json)
  server/          Express backend (its own package.json)
  .gitignore
  README.md
  package.json     optional: "workspaces": ["client", "server"]
Two parts in one repository. npm workspaces let one npm install at the top set up both. With Next.js instead, there is just one project folder.

.gitignore and README

A .gitignore file lists files Git must never save. node_modules holds downloaded packages: it is huge and can be rebuilt with npm install, so it is ignored. .env holds secrets such as database passwords, so it is ignored too. Commit a .env.example with the variable names and fake values instead. The README.md explains what the app is and how to run it.

Tip: Commit small and often, with messages that say what changed ("Add notes table", not "update"). Small commits are easy to understand and easy to undo.
Careful: Never commit a .env file or any password or key. If you push one by mistake, deleting the file later is not enough, because it stays in the Git history. Change (rotate) that password or key at once.

Watch the lesson

Setting up your tools · 1/7

VS Code Node.js + npm Git + GitHub

Before writing code, we set up our tools: VS Code, Node.js with npm, and Git with GitHub.

Prefer a video by a teacher? Find free videos on “setup vs code node js npm git github for beginners web development” on YouTube ↗

In real life: A college project team that lost a day

Four students start a canteen pre-order app. One of them commits the node_modules folder, so every push takes minutes and the repository grows past hundreds of megabytes. Another commits a .env file with the database password to a public repository. They spend a day cleaning up and changing the password. The next semester, they start with a .gitignore, a .env.example, a README with "how to run" steps and package.json scripts for dev and test. A new teammate runs the app in ten minutes on the first day.

Practice (0/3 done)

Task 1 · Code · Javascript

Write missingScripts(pkg, required) that returns an array of the script names in required that pkg.scripts does not have, in the order of required. A script whose command is an empty string counts as missing. If pkg has no scripts at all, every required name is missing.

Task 2 · Code · Javascript

Write missingIgnores(lines, required) that checks a .gitignore. lines is the file split into lines. Ignore blank lines and comment lines (starting with #) and trim spaces. Treat "node_modules", "node_modules/" and "/node_modules" as the same entry (remove one leading and one trailing slash before comparing). Return the entries from required that are not covered, in the order of required.

Task 3 · Practice

Set up the Notes app repository on your computer and on GitHub. You will build in it for the rest of the course. Tick each item when it is done.

Quick quiz

Question 1

1.Which Node.js version should a beginner install?

Question 2

2.Why is node_modules listed in .gitignore?

Question 3

3.You pushed a .env file with a real database password to GitHub. What must you do?

Question 4

4.What does npm run dev do?

Question 5

5.What is a Git branch for?

Read more (free)

Pass the quiz (60% or more) or mark this topic as done when you are ready.

Your progress is saved on this device only.

Next: Requirements and user stories →

← Previous: Popular stacks and how to choose