Visual Studio Code
Free code editor by Microsoft — the most widely used editor in the world.
What it is
Visual Studio Code (VS Code) is a free code editor made by Microsoft. It is the most widely used code editor in the world among professional developers. It has built-in support for JavaScript, TypeScript, HTML, CSS, and hundreds of other languages through extensions.
How to Install
Go to code.visualstudio.com and click the download button for your operating system (Windows, macOS, or Linux).
Open the downloaded file and follow the installation wizard.
On Windows, check the box that says "Add to PATH" during installation — this is important.
Once installed, open VS Code from your applications folder or start menu.
Recommended extensions to install:
- • Prettier — code formatter. Search "Prettier" in the Extensions panel.
- • ESLint — JavaScript error checker. Search "ESLint".
- • Live Server — preview HTML files. Search "Live Server".
To install: click the Extensions icon in the left sidebar (four squares), search the name, click Install.
Verify It Works
Open VS Code. If it opens, you are good.
Common Errors
"code" command not found in terminal
On macOS, open VS Code, press Cmd+Shift+P, type "shell command" and select "Install 'code' command in PATH".
VS Code opens but looks different
Extensions may have changed the theme. Press Ctrl+K Ctrl+T (Windows) or Cmd+K Cmd+T (Mac) to change themes.
Browser DevTools
Built into every modern browser — no download needed.
What it is
Browser DevTools (Developer Tools) are a set of tools built directly into Chrome, Firefox, Safari, and Edge. They let you inspect HTML and CSS, debug JavaScript, monitor network requests, analyse performance, and much more. You will use DevTools constantly as a developer.
How to Open
Chrome and Edge: Press F12, or right-click anywhere on a page and select "Inspect".
Firefox: Press F12, or right-click and select "Inspect Element".
Safari: First enable DevTools in Safari Preferences > Advanced. Then press Cmd+Option+I.
Key Panels to Know
Elements — Shows the HTML structure of the page. Click any element to see and edit its HTML and CSS in real time.
Console — Runs JavaScript and shows errors and log messages. Type any JavaScript expression here and press Enter to run it.
Network — Shows every file the page requested from the server, how long each took, and the response data.
Sources — Shows the JavaScript files running on the page. You can pause execution and step through code line by line.
Verify It Works
Open any webpage and press F12. If a panel appears at the side or bottom of your browser, DevTools is working.
Common Errors
DevTools panel is too small to read
Drag the divider between the page and DevTools to resize. You can also pop it into its own window by clicking the three dots menu inside DevTools and selecting "Undock into separate window".
Git and GitHub
Version control system and cloud code hosting — essential for every developer.
What it is
Git is a version control system. It tracks every change you make to your code, lets you go back to previous versions, and makes it possible to collaborate with other developers. GitHub is a website that hosts your Git repositories online. Almost every professional development team uses Git and GitHub.
Install Git
Go to git-scm.com and download Git for your operating system.
On Windows, run the installer and accept the default options.
On macOS, open Terminal and type "git --version" to check if already installed. If not, macOS will prompt you to install it.
On Linux, run "sudo apt install git" in your terminal.
Set Up Your Identity (required before using Git)
Open your terminal and run these two commands:
git config --global user.name "Your Name"
git config --global user.email "your@email.com"Create a GitHub Account
Go to github.com and click "Sign up".
Choose a username you are comfortable sharing with employers — this will be on your professional profile.
Verify your email address.
Verify It Works
git --versionExpected output: git version 2.x.x (any version number is fine)
Common Errors
"git" is not recognized as a command
Git was not added to your PATH. Reinstall Git and make sure to check the "Add to PATH" option during installation.
"Permission denied" when pushing to GitHub
You need to set up authentication. GitHub recommends a Personal Access Token. Go to GitHub Settings → Developer Settings → Personal Access Tokens and generate a new token.
Node.js and npm
JavaScript runtime and package manager — required for React, Next.js, Vite, and most modern tools.
What it is
Node.js is a JavaScript runtime that lets you run JavaScript outside of a browser — on your computer or a server. npm (Node Package Manager) comes bundled with Node.js and is used to install JavaScript libraries and tools. Most modern frontend tools like React, Next.js, and Vite require Node.js to run.
How to Install
Go to nodejs.org.
Download the LTS (Long Term Support) version — this is the recommended stable version.
Run the installer and follow the steps. npm is included automatically.
Restart your terminal after installation.
Verify It Works
node --version
npm --versionExpected output: v20.x.x or similar for Node, 10.x.x or similar for npm
Common Errors
"node" is not recognized
Restart your terminal after installation. If still not working, the installer may not have added Node to your PATH — try reinstalling.
Permission errors when installing packages
On macOS/Linux, avoid using sudo with npm. Instead, configure npm to install packages in your home directory.
MongoDB
NoSQL database that stores data as JSON-like documents — pairs naturally with Node.js.
What it is
MongoDB is a NoSQL (Not Only SQL) database that stores data as flexible JSON-like documents instead of rows and columns. It is widely used in JavaScript applications because it pairs naturally with Node.js. MongoDB Atlas is the cloud-hosted version that lets you store your database online without managing a server.
Option A — MongoDB Atlas (recommended for beginners)
A cloud-hosted database. No local installation needed. Free tier available.
Go to mongodb.com/atlas and create a free account.
Create a free cluster (M0 tier is free forever).
Create a database user with a username and password.
Get your connection string — it looks like:
mongodb+srv://username:password@cluster0.xxxxx.mongodb.net/Option B — Local MongoDB
Go to mongodb.com/try/download/community.
Download and install for your operating system.
Follow the installation guide for your OS — each one is slightly different.
MongoDB Compass
Compass is a visual interface for browsing and editing your MongoDB data. Download Compass and connect it to your database using your connection string.
Verify It Works
Paste your connection string into MongoDB Compass. If it connects and shows your database, you are set up correctly.
Common Errors
Connection timed out
Your IP address may not be whitelisted. In MongoDB Atlas, go to Network Access and add your current IP address, or use 0.0.0.0/0 to allow all IPs (development only).
Vercel
Cloud platform for deploying frontend applications — built by the team behind Next.js.
What it is
Vercel is a cloud platform for deploying frontend applications. It is made by the same team that built Next.js. You connect Vercel to your GitHub repository and every time you push code, Vercel automatically builds and deploys your site. It is the fastest way to get a frontend application live on the internet.
How to Set Up
Go to vercel.com and sign up with your GitHub account.
Click "Add New Project".
Import your GitHub repository.
Vercel will automatically detect the framework you are using (Next.js, React, Vue etc.).
Click "Deploy" — your site will be live in about 60 seconds.
Vercel gives you a free URL like your-project.vercel.app.
Custom domain
In your project settings on Vercel, go to Domains and add your own domain name. Vercel handles SSL certificates automatically.
Verify It Works
After deploying, visit your Vercel URL. If your site loads you are deployed.
Common Errors
Build failed
Check the build logs in Vercel. The most common cause is a missing environment variable. Add your environment variables in the project Settings under Environment Variables.
404 on page refresh
This is a routing issue. For Next.js this is handled automatically. For other frameworks you may need to add a vercel.json configuration file.
Render
Cloud platform for deploying backend applications, APIs, and databases.
What it is
Render is a cloud platform for deploying backend applications, APIs, and databases. Unlike Vercel which focuses on frontend, Render handles Node.js servers, Python APIs, PostgreSQL databases, and more. It has a free tier that works well for learning and small projects.
Set Up a Web Service
Go to render.com and sign up with your GitHub account.
Click "New" and select "Web Service".
Connect your GitHub repository.
Configure your service:
Name: your project name
Environment: Node
Build command: npm install
Start command: node server.js (or whatever starts your server)
Add environment variables in the Environment section.
Click "Create Web Service".
Free tier note
Render's free tier spins down web services after 15 minutes of inactivity. The first request after inactivity takes 30–60 seconds while the service wakes up. Upgrade to a paid plan for always-on services.
Verify It Works
After deploying, Render gives you a URL like your-project.onrender.com. Hit any of your API endpoints to confirm it is working.
Common Errors
Service keeps crashing
Check the logs in your Render dashboard. The most common cause is a missing environment variable or the wrong start command.
Railway
Modern cloud platform for full-stack apps with managed databases and minimal config.
What it is
Railway is a modern cloud platform that makes it easy to deploy full-stack applications. It supports Node.js, Python, Ruby, and many other languages, and also offers managed databases including PostgreSQL, MySQL, MongoDB, and Redis. Railway is known for being developer-friendly with minimal configuration required.
How to Set Up
Go to railway.app and sign up with your GitHub account.
Click "New Project".
Select "Deploy from GitHub repo" and choose your repository.
Railway automatically detects your framework and configures the build.
Add environment variables in the Variables section.
Your app deploys automatically.
Deploying a Database
In your project, click "New" and select "Database".
Choose your database type (PostgreSQL, MySQL, MongoDB, Redis).
Railway provisions the database and gives you connection credentials automatically.
Link the database to your web service — Railway injects the connection URL as an environment variable.
Verify It Works
Railway gives you a public URL once deployed. Visit it to confirm your service is running.
Common Errors
Build fails
Railway shows build logs in real time. Check for missing dependencies in your package.json or incorrect build commands.
Heroku
Established cloud platform with a powerful CLI — supports Node.js, Python, Ruby, Java, and more.
What it is
Heroku is one of the oldest and most established cloud platforms for deploying applications. It supports Node.js, Python, Ruby, Java, and other languages. Heroku uses a command line interface (CLI) called the Heroku CLI for deployment and management, giving you fine-grained control over your applications.
Install Heroku CLI
Go to devcenter.heroku.com/articles/heroku-cli and download the installer for your operating system.
Run the installer.
Open your terminal and log in:
heroku loginThis opens a browser window for authentication.
Deploy an Application
Make sure your project has a package.json with a start script.
Add a Procfile in your project root:
web: node server.jsInitialize a Git repository if you have not already:
git init
git add .
git commit -m "Initial commit"Create a Heroku app:
heroku create your-app-nameDeploy:
git push heroku mainManaging Environment Variables
heroku config:set KEY=value --app your-app-name
heroku config --app your-app-nameVerify It Works
heroku open --app your-app-nameThis opens your deployed application in the browser.
Common Errors
No default language could be detected
Add a package.json to your project root.
Application error on Heroku
Check logs with: heroku logs --tail --app your-app-name
What to Install for Each Track
Only install what your track needs. You can always add more later.
| Track | Tools needed |
|---|---|
| Frontend Engineering | VS Code, Browser DevTools, Git, Node.js, Vercel |
| Backend Development | VS Code, Git, Node.js, MongoDB, Heroku or Render |
| Data Analytics | VS Code, Git, Node.js (for Jupyter via npm) |
| Data Science | VS Code, Git, Node.js, Python |
| AI Automation | VS Code, Git, Node.js, Python |
| Cybersecurity | VS Code, Browser DevTools, Git |
| Product Design | VS Code, Git, Figma (figma.com) |
| Product Management | VS Code, Git, Notion (notion.so) |
Want more than free lessons?
CareerEx gives you 12 weeks of structured training, live tutor feedback, real assignments, and a completion certificate.
Join CareerEx