Your first tech stack: what to install and where to click

Create a GitHub account

GitHub is where your code will live. Not in a folder called New Folder 4, not in a chat with a neural network, but in a proper change history.

1. Open github.com/signup.
2. Enter your email, password, and username. Keep your username short and human.
3. Confirm your email. Without confirmation, it will be painful from here on.
4. If GitHub suggests enabling two-factor authentication - enable it. This is code, not a throwaway account.

If you want to check the official instructions, here is the GitHub page: Creating an account on GitHub.

Open the right terminal

The terminal is not hacker decor. It is where the project runs. The names differ on Windows and macOS, but the meaning is the same.

pwd

Install Git

Git keeps your project history. Without Git, an agent turns into a person with a marker by a wall: wrote something, ruined it, left.

git --version

Set up your name and email for commits right away:

git config --global user.name "Your Name"
git config --global user.email "you@example.com"

Use the same email you used for GitHub. No need to make things complicated too early.

Install Cursor

Cursor is a code editor. You can live in VS Code, but it is easier for a beginner to start with Cursor: files, terminal, and AI together, without the circus of extensions.

1. Open cursor.com/download.
2. Download the version for your system: Windows or macOS.
3. Install the app.
4. Launch Cursor and sign in if prompted.

Do not configure anything yet. Do not turn your first day into editor setup. We have not even created a project yet.

Install Node.js LTS

You need Node.js to run Next.js and package managers. On the Node page, choose LTS. Not Current. Current is for people who get bored living.

1. Open nodejs.org/en/download.
2. Choose the LTS version for your operating system.
3. Download the installer and complete the installation.
4. Close the terminal and reopen it.

node -v

npm -v

Current Next.js requires a modern Node.js. The Next.js documentation lists Node.js 20.9 as the minimum version. Choose LTS - and do not overthink it.

Install pnpm

pnpm is a package manager. It will install dependencies and run the project. You can use npm, but this guide uses pnpm. One guide - one way.

First, try the official route through Corepack:

npm install --global corepack@latest
corepack enable pnpm
pnpm -v

If you see the pnpm version - you are done. If not, install it directly:

npm install -g pnpm@latest-11
pnpm -v

The official pnpm instructions are here: pnpm.io/installation.

Create your first Next.js project

Now we make a project. Not later, not after a JavaScript course. Right now. An empty project is better than a perfect plan.

Create the app:

pnpm create next-app@latest first-vibe-project --yes
cd first-vibe-project
pnpm dev

Open http://localhost:3000. If you see the Next.js starter page - the project is alive.

Next.js itself says that the `pnpm create next-app@latest my-app --yes` command creates a project with TypeScript, Tailwind, ESLint, App Router, and basic settings. That is exactly what we need.

Open the project in Cursor

Now the editor should be looking at the project folder, not empty space.

1. Open Cursor.
2. Click File -> Open Folder.
3. Select the first-vibe-project folder on your desktop.
4. Open the built-in terminal: Terminal -> New Terminal.
5. The built-in terminal should already be inside the project folder.

pnpm dev

Make your first commit

A commit saves the project state. No commit - no save. Simple.

git status
git add .
git commit -m "Initial Next.js app"

If Git complains about your name or email, return to step 03 and configure `git config`.

Create a repository on GitHub and push the code

Now put the code on GitHub. Not by uploading a zip file. Through git.

1. Open GitHub.
2. Click the plus in the top-right corner.
3. Choose New repository.
4. Name: first-vibe-project.
5. Public or Private - it does not matter for learning. If you feel self-conscious, choose Private.
6. Do not add a README. A README may already be in the local project.
7. Click Create repository.

GitHub shows similar steps in its official quickstart: Quickstart for repositories.

Run the commands in the project terminal. Replace USERNAME with your username:

git branch -M main
git remote add origin https://github.com/USERNAME/first-vibe-project.git
git push -u origin main

If Git asks you to authorize - sign in through GitHub. On Windows, Git Credential Manager will usually help. On macOS, a browser or a system prompt may open. This is normal.

Connect Convex when you need data

If the project just displays one page, you do not need Convex yet. If submissions, posts, users, tasks, counters, or any list appear - you need a backend. Here, we use Convex.

In the project folder:

pnpm add convex
pnpm convex dev

Convex will ask you to sign in through GitHub, create a project, and add a `convex/` folder. Official Next.js quickstart: docs.convex.dev/quickstart/nextjs.

Do not try to connect a backend before the regular page opens locally. First the page. Then the data.

Deploy to Vercel

Deployment is the moment when the project stops living only on your laptop.

1. Open vercel.com/signup.
2. Sign in through GitHub.
3. On the dashboard, click Add New, then Project or New Project.
4. Choose the first-vibe-project repository.
5. Framework Preset should be Next.js. Vercel usually detects it automatically.
6. Click Deploy.
7. Wait for the build and open the provided link.

Vercel documentation describes the same principle: choose a Git repository, configure the project, and click Deploy. Details: Vercel Git deployments.

Final check

At the end, it should look like this:

• GitHub account created and email confirmed.
• Git installed: git --version works.
• Node.js installed: node -v works.
• pnpm installed: pnpm -v works.
• Project created: the first-vibe-project folder is on your computer.
• Local server works: http://localhost:3000 opens.
• Cursor opened the project folder.
• First commit made.
• Code pushed to GitHub.
• Vercel provided a public link.

If every item is checked off - your stack is ready. Next, you can ask the agent to change the page, add components, forms, and data. But now you have a foundation: a project, history, repository, and deployment.

If something goes wrong

`pnpm` not found.

Close the terminal and open it again. If that does not help, repeat step 06.

PowerShell complains about running scripts.

Do not fight PowerShell on day one. Install pnpm through npm: `npm install -g pnpm@latest-11`.

Git will not commit and asks for a name/email.

Run `git config --global user.name` and `git config --global user.email` from step 03.

localhost:3000 does not open.

Check that the `pnpm dev` command is still running and did not end with an error.

Vercel build failed.

First run `pnpm build` locally. If it fails locally, Vercel is not to blame.