Part 0.1 — Setting Up a Modern Dev Environment

When you start your journey into full-stack development, your environment becomes your daily workspace—the engine room where ideas turn into running code. Let’s make sure it’s fast, consistent, and ready for scale.

1. Install Node.js and pnpm

You’ll need Node.js (version ≥ 20 LTS) as the foundation for both frontend and backend tooling.
Instead of npm or yarn, we use pnpm for its deterministic installs and space-efficient package management.

# On macOS
brew install node
npm install -g pnpm

# On Linux
curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
sudo apt install -y nodejs
sudo npm install -g pnpm

# Verify
node -v
pnpm -v

Why pnpm? Because it stores packages in a global content-addressable store and links them via symlinks. This makes monorepos, like our React + NestJS setup, lightning fast and consistent across machines.

2. Install and Configure PostgreSQL

PostgreSQL is our only database—no MongoDB, no MySQL. It’s battle-tested, transactional, and integrates seamlessly with Prisma.

# macOS
brew install postgresql
brew services start postgresql

# Linux (Ubuntu)
sudo apt install postgresql postgresql-contrib

# Verify connection
psql -U postgres

Create a development database:

psql -U postgres
CREATE DATABASE fullstack_dev;
\q

Store your connection string in a .env file later:

DATABASE_URL="postgresql://postgres:password@localhost:5432/fullstack_dev"

3. Set Up VS Code and Extensions

A well-configured editor saves hours per week.
Install Visual Studio Code and these key extensions:

• ESLint — for static analysis and consistent formatting

• Prettier — auto-formatting

• Prisma — syntax highlighting for .prisma files

• REST Client — to test API endpoints directly

• Jest — integration with the test runner

• Docker — container management

• GitLens — advanced Git insights

In your workspace settings (.vscode/settings.json):

{
  "editor.formatOnSave": true,
  "typescript.tsdk": "node_modules/typescript/lib",
  "eslint.validate": ["javascript", "typescript", "typescriptreact"],
  "editor.defaultFormatter": "esbenp.prettier-vscode"
}

4. Verify Your Toolchain

Let’s check that the core components talk to each other.

Create a project root folder:

mkdir fullstack-app && cd fullstack-app
pnpm init

Install basic dependencies to confirm your toolchain:

pnpm add typescript ts-node -D
pnpm tsc --init

You should now see a tsconfig.json. Open it in VS Code—if IntelliSense works, your TypeScript environment is live.

5. Optional: Dockerized PostgreSQL (for Clean Isolation)

To keep your local machine clean or ensure consistency across teams, you can use Docker Compose for PostgreSQL:

# docker-compose.yml
version: "3.9"
services:
  postgres:
    image: postgres:16
    container_name: fullstack_postgres
    restart: unless-stopped
    environment:
      POSTGRES_USER: postgres
      POSTGRES_PASSWORD: postgres
      POSTGRES_DB: fullstack_dev
    ports:
      - "5432:5432"
    volumes:
      - pg_data:/var/lib/postgresql/data
volumes:
  pg_data:

Spin it up with:

pnpm dlx docker compose up -d

Your PostgreSQL instance is now ready, isolated, and reproducible.

6. Verify Everything Works Together

Try connecting to PostgreSQL using Prisma’s CLI (we’ll install it in Part 3, but here’s a preview):

pnpm add prisma -D
pnpm prisma init

This creates a .env and a prisma/schema.prisma. Adjust the DATABASE_URL, then run:

pnpm prisma db pull

If no errors occur, your stack foundation is complete: Node, pnpm, PostgreSQL, and VS Code are ready for full-stack development.

7. Commit and Version Control

Initialize a Git repository:

git init
git add .
git commit -m "Initial setup with pnpm and PostgreSQL"

Then create a GitHub repo and push it.
This prepares you for future CI/CD steps in Part 11.

Final Words

A professional setup is the silent multiplier of developer productivity. Every command you run, every dependency you install, every environment variable you define—it all builds the foundation for the stack we’ll grow in the next parts.

You now have a clean, reliable, and production-ready local environment. Next, we’ll move into how the web works—requests, responses, and the client-server model that ties this all together.