Setup Your Workspace
Install everything you need to start building. VS Code, Node.js, and Git—the holy trinity of web development.
What You'll Install
Your code editor
JavaScript runtime
Version control
Install VS Code
VS Code is the most popular code editor for web development. It's free, fast, and packed with features.
During Installation
- ✓ Check "Add to PATH" (lets you open VS Code from terminal)
- ✓ Check "Add Open with Code action" (right-click folders to open)
Recommended Extensions: Once VS Code is installed, search for and install these extensions:
- • ESLint — catches code errors
- • Prettier — auto-formats your code
- • Tailwind CSS IntelliSense — autocomplete for Tailwind
Install Node.js
Node.js lets you run JavaScript outside the browser. It's required for Next.js and most modern web tools.
Choose the LTS Version
LTS = Long Term Support. It's the stable, recommended version. Avoid "Current" unless you know what you're doing.
After installation, verify it worked by opening a terminal and running:
node -vYou should see a version number like v20.x.x or higher.
Also check npm (Node Package Manager) is installed:
npm -vInstall Git
Git tracks changes to your code and lets you collaborate with others. It's essential for any developer.
Windows Installation Tips
- • Use default options for most prompts
- • For default editor, choose "Use Visual Studio Code"
- • For PATH, choose "Git from the command line and also from 3rd-party software"
After installation, verify it worked:
git --versionYou should see something like git version 2.x.x.
Configure Git
Tell Git who you are. This info appears on your commits.
git config --global user.name "Your Name"
git config --global user.email "your.email@example.com"Use the same email as your GitHub account (if you have one) so your commits are linked to your profile.
Verify Everything Works
Open a new terminal (or restart VS Code) and run these commands:
node -v
npm -v
git --version
code --versionIf all four commands show version numbers, you're ready!
Your development environment is fully set up.
Workspace Ready!
You've got all the tools you need. Time to build something.
Terminal Cheatsheet
| Command | What It Does |
|---|---|
| cd folder-name | Change directory (move into a folder) |
| cd .. | Go up one folder |
| ls | List files in current folder (Mac/Linux) |
| dir | List files in current folder (Windows) |
| mkdir folder-name | Create a new folder |
| code . | Open current folder in VS Code |
| clear | Clear the terminal screen |
Common Issues
"command not found: node"
Close and reopen your terminal. If still broken, reinstall Node.js and make sure to check "Add to PATH".
"command not found: code"
Open VS Code, press Cmd+Shift+P (Mac) or Ctrl+Shift+P (Windows), type "shell command" and select "Install 'code' command in PATH".
"git is not recognized"
Restart your computer after installing Git. If still broken, reinstall and choose "Git from the command line" during setup.
Permission errors on Mac/Linux
Don't use sudo for npm. Instead, fix npm permissions or use nvm (Node Version Manager).