🗺️ Presentation Layer Phase 0 Progress Matrix Map
Visualizing how code travels from your brain to a local editor and then onto remote version systems:
📊 Primary Environment Telemetry Indicators:
The Big Idea — Why your environment matters
A FAANG engineer doesn't "just open a laptop and code." They sit inside a precisely configured environment — tools that autocomplete their thoughts, catch errors before they run, track every change they make, and deploy code with a single command.
Most beginners ignore this step. They Google something, copy-paste a command, and end up with a half-working setup that causes mysterious errors six months later. You are not going to do that.
Your development environment is the sum of every tool on your machine that lets you write, run, test, and ship software. Get it right once, and every essay that follows becomes dramatically easier. Skip it properly, and you will waste hours debugging problems that have nothing to do with your actual code.
You are building toward FAANG interviews where you might be asked to code on a screen share or whiteboard. Interviewers notice your environment. A clean, professional setup signals that you are serious. A messy, confused one signals the opposite.
This essay installs and configures everything. By the end, you will have: a professional code editor with smart extensions, Node.js and Python running on your machine, Git and GitHub connected, a working terminal, and PostgreSQL ready for databases. And you will understand why each piece exists — not just that it does.
Where This Fits — Your position in the journey
Here is where you are and where this is taking you:
Everything installed in this essay will be used in every single essay that follows. When Essay 1.1 asks you to open VS Code and write HTML, you will have it. When Essay 3.5 asks you to commit to GitHub, you will be ready. When Essay 6.2 asks you to run a Node.js server, Node will already be installed.
The PDF says it clearly: every topic must be learned in order. This essay is the foundation the entire series stands on. Two hours here saves you twenty hours later.
The next essay (0.2) teaches you to be fast and comfortable in the terminal — the command line interface that all your tools live inside. Together, essays 0.1 and 0.2 are your Phase 0: Setup. After that, the real learning begins.
The Intuition — The Formula 1 cockpit analogy
Think of a Formula 1 driver. Before the race, they don't just sit down and start driving. They spend hours getting their cockpit exactly right — seat position, steering wheel angle, button layout, pedal feel, mirror angles. Everything is configured for maximum speed and minimum thinking.
Your dev environment is that cockpit. Every tool is a button or lever. Configure it once, and then everything flows. The code editor (VS Code) is your steering wheel — your primary interface. The terminal is your dashboard — it shows you everything happening under the hood. Git is your race data recorder — it logs every single change you make so you can always go back. Node.js and Python are your engines — they run your code. The browser and DevTools are your mirrors — they show you how your code looks and behaves from the outside.
Imagine you want to write a book. First you need: a desk (computer), a good pen (VS Code), paper (project folder), a filing system (Git), a printer to share drafts (GitHub), and a way to check if the book makes sense (the terminal). Your dev environment is just setting all of that up before you write word one.
Here is what each tool does in one line:
The Visual — Environmental flow maps
Here is the full picture of how your dev environment fits together. When you write code, this is the chain from your brain to the internet:
This chain is the lifecycle of every piece of software you will write. Right now you are setting up the top half — your local machine. Later essays will cover the bottom half — databases, deployment, and live projects.
Your machine is the workshop. GitHub is the warehouse. Vercel/Render is the shop front. Code starts in the workshop, gets stored in the warehouse, and gets shown to customers at the shop front.
The Depth — What each tool really is and why it exists
Every tool has a reason. Understanding why each one exists makes you use it correctly — and impresses interviewers who expect you to know more than "I installed it because the tutorial said to."
VS Code — The Editor
VS Code (Visual Studio Code) is a text editor made by Microsoft. That sounds boring. It is not. It is the most popular code editor in the world by a massive margin — used by engineers at Google, Meta, Amazon, and virtually every startup. It is free, open-source, and extensible, meaning thousands of people have built plugins (extensions) for it. When you write code in VS Code, it understands what language you are writing in and helps you: it suggests what to type next (IntelliSense), highlights syntax errors as you type, lets you debug line by line, and integrates directly with Git. The reason it beats all alternatives for beginners is that it is both simple enough to start immediately and deep enough to use for the rest of your career.
You may hear about Vim, Emacs, Sublime Text, WebStorm, PyCharm. Ignore them for now. You will use VS Code for all 63 essays. Some engineers use Vim for terminal-based editing (you will learn the basics in essay 0.2) — but VS Code is your primary tool.
The Terminal — Your Command Center
The terminal is a text-based interface to your computer. Instead of clicking icons, you type commands. This sounds primitive. It is the opposite. Everything that is truly powerful in software development happens through the terminal. Installing packages, running servers, committing code, configuring databases, SSH-ing into remote servers — all terminal. On Windows you will use either WSL2 (Windows Subsystem for Linux, which gives you a real Linux terminal) or PowerShell. On Mac, you use the built-in Terminal app or iTerm2. On Linux, you have the terminal natively. Essay 0.2 teaches you terminal mastery in full depth.
Node.js — JavaScript Everywhere
JavaScript was originally a browser-only language. In 2009, Ryan Dahl built Node.js, which took the V8 JavaScript engine from Chrome and let it run JavaScript on a server. This was a revolution. Suddenly you could use one language (JavaScript) for both your frontend (the webpage) and your backend (the server). Node.js also comes with npm — the Node Package Manager — which is the world's largest library of reusable code. You will use npm from essay 2.1 (React) all the way through essay 9.4 (CI/CD). When you install Node.js, you get both Node and npm together.
Git — The Time Machine
Git is version control software. It tracks every change you make to your code over time. You can go back to any previous state. You can work on multiple versions of your code simultaneously (branches). You can see exactly what changed between versions. Git was created by Linus Torvalds — the same person who created the Linux operating system — in 2005. Every software company in the world uses Git. Without it, teams of engineers would be emailing each other zip files of code, overwriting each other's work constantly. Git solves this. At your level, Git's most important function is: if you break something and don't know how to fix it, you can always go back to when it worked.
GitHub — Git on the Internet
Git lives on your machine. GitHub is a website that stores your Git repositories online. It lets you: share your code publicly (your portfolio), back up your code in the cloud, collaborate with other developers, and show recruiters your work. GitHub is owned by Microsoft but is free to use. Your GitHub profile is literally your resume as a developer. Recruiters look at your GitHub before your LinkedIn. The contribution graph (green squares for each day you commit code) tells a story — 180 green squares over 6 months says "this person is serious and consistent."
PostgreSQL — Your Database
Most applications store data. PostgreSQL (pronounced "post-gres-Q-L") is a relational database — it stores data in tables with rows and columns, like a very powerful spreadsheet. It is open-source, free, and used at scale by companies like Instagram (early days), Reddit, and many others. You query it with SQL (Structured Query Language). Essay 6.4 goes deep on SQL and PostgreSQL. Here you are just installing it so it is ready when you need it.
Code Lab — Step-by-step setup guides
Every command below is explained. Do not copy-paste things you don't understand. Read each explanation first, then run the command.
Step 1 — Install VS Code
Go to code.visualstudio.com and download the installer for your operating system. Run it. When installation finishes, open VS Code. You should see a welcome screen with a dark theme by default.
Step 2 — Install these VS Code Extensions
Press Ctrl+Shift+X (or Cmd+Shift+X on Mac) to open the Extensions panel. Search for and install each of these:
# Search and install each of these in VS Code Extensions panel
Prettier - Code formatter # Auto-formats your code on save
ESLint # Catches JavaScript errors as you type
GitLens # Shows Git history inline in your code
Thunder Client # Tests APIs from inside VS Code (like Postman)
Live Server # Refreshes your browser when you save HTML/CSS
Pylance # Python language support and autocomplete
Path Intellisense # Autocompletes file paths when you import things
Error Lens # Shows errors inline next to the problem line
Step 3 — Configure VS Code Settings
Press Ctrl+, to open settings. Search for "format on save" and enable it. This makes Prettier automatically clean up your code every time you save. Search for "tab size" and set it to 2 (the JavaScript standard).
Step 4 — Install Node.js
Go to nodejs.org. Download the LTS version (Long-Term Support — more stable than the latest). Run the installer. Open your terminal after installation and verify it worked:
If you see version numbers, Node.js is installed correctly. If you see "command not found", close and reopen your terminal and try again. If still failing, reinstall.
Step 5 — Install Git
On Mac: Git comes pre-installed. Type git --version to confirm. On Windows: download from git-scm.com and install. On Linux: sudo apt install git. After installation, configure your identity — Git needs to know who is making commits:
# Tell Git who you are — this appears in every commit you make
git config --global user.name "Rahul"
git config --global user.email "your@email.com"
# Set VS Code as your default Git editor
git config --global core.editor "code --wait"
# Set main as the default branch name (modern standard)
git config --global init.defaultBranch main
# Verify your configuration
git config --list
user.name=Rahul
user.email=your@email.com
core.editor=code --wait
Step 6 — Create GitHub Account and Connect SSH
Go to github.com and create an account. Use a professional username — your real name or something close to it. Use no numbers or "coder" suffixes. Recruiters will see this. Now, set up SSH so you can push code without typing your password every time:
# Step 1: Generate an SSH key pair
ssh-keygen -t ed25519 -C "your@email.com"
Generating public/private ed25519 key pair.
Enter file in which to save the key: [press Enter]
Enter passphrase: [press Enter for no passphrase]
# Step 2: Start the SSH agent
eval "$(ssh-agent -s)"
Agent pid 1234
# Step 3: Add your key to the agent
ssh-add ~/.ssh/id_ed25519
# Step 4: Copy your PUBLIC key to clipboard
# On Mac: cat ~/.ssh/id_ed25519.pub | pbcopy
# On Windows: cat ~/.ssh/id_ed25519.pub | clip
# On Linux: cat ~/.ssh/id_ed25519.pub | xclip -selection clipboard
# Step 5: Go to GitHub → Settings → SSH and GPG Keys → New SSH Key
# Paste the copied key and save it
# Step 6: Test the connection
ssh -T git@github.com
Hi Rahul! You've successfully authenticated.
Step 7 — Install Python
On Mac: Python 3 is usually pre-installed. Check with python3 --version. On Windows: download from python.org — during installation, check the box that says "Add Python to PATH" (this is the most common beginner mistake). On Linux: sudo apt install python3 python3-pip.
Step 8 — Install PostgreSQL
Download from postgresql.org/download for your OS. During installation, you will set a password for the default "postgres" user. Write this down — you will need it every time you connect to your database. Also install pgAdmin (often bundled) — it is a visual interface to explore your database, which helps a lot when learning SQL.
Step 9 — Install Postman
Download from postman.com. Postman is a tool for testing APIs. When you build a backend server in essay 6.2, you will use Postman to send requests to it and see the responses — before you have a frontend built. Think of it as a browser specifically for APIs.
Step 10 — Windows only: Install WSL2
If you are on Windows, do this step. WSL2 (Windows Subsystem for Linux version 2) gives you a real Ubuntu Linux environment inside Windows. Most servers in the world run Linux. Learning on Linux from the start means no surprises later. Open PowerShell as Administrator and run:
# Install WSL2 with Ubuntu (one command, may take 10-15 minutes)
wsl --install
# After restart, WSL2 will ask you to set a username and password
# Use your first name as username, set a password you remember
# Verify installation
wsl --list --verbose
NAME STATE VERSION
* Ubuntu Running 2
After this, open VS Code and install the "WSL" extension — it lets VS Code work directly inside your Linux environment. From now on, always open your terminal in VS Code and use the Ubuntu (WSL) terminal, not PowerShell.
Common Mistakes — Environmental Pitfalls
These are not hypothetical. Every one of these is something that has burned hundreds of beginners. Knowing them in advance means you will not lose days to them.
Installing the "Latest" Node.js instead of LTS
Beginners choose "Current" because newer feels better. This is wrong. "Current" means bleeding-edge — it may have bugs, and many packages don't support it yet. LTS is stable and tested.
On Windows: Not adding Python/Node to PATH
If Node or Python is not in your PATH, your terminal says "command not found" even though the software is installed. During Python installation, check the box that says "Add Python to PATH".
Forgetting the PostgreSQL database password
PostgreSQL asks you to set a password for the default "postgres" superuser during installation. Many beginners forget this password. Six weeks later, they cannot connect to databases.
Using an unprofessional username for GitHub
Your GitHub username and email are visible to every recruiter who visits your profile. Avoid handles like "coder_rahul99". Use your real name or a clean, professional variation.
Installing too many VS Code extensions and slowing it down
Each extension slows down VS Code's startup and can cause conflicts. Install only the eight extensions listed in this essay. You will add a few more in later essays when you actually need them. Extensions you don't use are just weight.
Real World — Setup standards at big companies
The tools you are setting up today are not "learning tools." They are production tools. The exact same tools — used by the same standards — power the software at the biggest tech companies on earth.
Recruiters at Google, Meta, and Amazon routinely check GitHub profiles before phone screens. A profile with 6 months of daily commits, 3 deployed projects, and clean README files communicates dedication more powerfully than any resume line. Your GitHub profile page is a living document of your growth. Start building it today.
Interview Angle — FAANG screen observation
Dev environment questions are not common in FAANG technical rounds, but your environment speaks for you before you say a word.
"Can you share your screen and solve this problem?"
"What tools do you use day-to-day and why did you choose them?"
"Can you explain Git versus GitHub? Many people confuse them."
Explain It Test — Dynamic Revision Cards
Say each answer out loud before clicking a card to reveal its answer. This is how understanding becomes yours.
Do This Today — Workspace Verification Tasks
Complete these setup tasks to establish your local development cockpit before advancing to terminal commands. Click each row to toggle its status.
Open VS Code, open the integrated terminal (Ctrl+`), and run node --version && git --version && python3 --version. If all three show version numbers, your environment is complete. Move to Essay 0.2.