From Code to Live Website: Deployment
See how code on your computer becomes a website anyone can visit.
What Is Deployment?
Deployment is the process of taking your code from your local computer and making it accessible on the internet. When you type a URL and see a website, someone has deployed that code to a server that's running 24/7.
The Publishing Analogy
Deployment is like publishing a book
You write the manuscript (code) on your computer. The publisher (Vercel) takes your manuscript, typesets it (builds), prints copies (deploys to servers), and distributes them to bookstores worldwide (CDN edge network). Readers (users) can then access your book from their nearest bookstore.
Vercel: Our Deployment Platform
StudyTracker uses Vercel — the company behind Next.js. When you push code to GitHub, Vercel automatically detects it, builds your project, and deploys it. This is called Continuous Deployment (CD). No manual upload, no server configuration.
Environment Variables: Keeping Secrets Safe
Your app needs secrets — database URLs, API keys, auth tokens. These are stored as environment variables on Vercel, NOT in your code. The .env file on your local machine holds your development secrets, but production secrets live only on the server.
Environment Variable
A key-value pair stored outside your code that configures your app for different environments. DATABASE_URL points to your test database locally and your production database on Vercel — same code, different config.
Watch a Deployment Happen
Click the button below to simulate the full deployment process — from git push to a live website:
CI/CD: Automation at Every Step
CI (Continuous Integration) runs tests and checks automatically when you push code. CD (Continuous Deployment) deploys the build if all checks pass. Together, they ensure that broken code never reaches production. Vercel handles CD; you can add CI via GitHub Actions.
Test Your Knowledge
What triggers a deployment on Vercel?