Skip to main content
Vercel is the recommended hosting platform for this project. It has native Next.js support, automatic deployments on every push, and a free tier that covers personal portfolios.

​
Prerequisites

Before you deploy, make sure you have:
  • A GitHub account with your customized portfolio repository pushed
  • A Vercel account (the free Hobby plan is sufficient)
  • A Groq API key — see Environment Variables for instructions on obtaining one

​
Deploy to Vercel

1

Push your code to GitHub

Make sure all your customizations are committed and pushed to your GitHub repository.
git add .
git commit -m "Customize portfolio content"
git push origin main
2

Import the project in Vercel

Go to vercel.com, sign in, and click Add New Project.Select Import Git Repository and choose the repository you just pushed. Vercel will automatically detect that it is a Next.js project.
3

Configure environment variables

Before clicking Deploy, expand the Environment Variables section in the Vercel project setup screen.Add the following variable:
NameValue
GROQ_API_KEYYour Groq API key
Never commit your .env.local file or paste API keys directly into source code. Always set secrets through the Vercel dashboard.
4

Click Deploy

Click the Deploy button. Vercel will install dependencies, run next build, and publish your site. The initial build typically takes 1–2 minutes.
5

Access your live portfolio

When the deployment finishes, Vercel provides a generated URL in the format your-project-name.vercel.app. Open it to confirm your portfolio is live and the AI chatbot is responding.

​
Custom domain setup (optional)

You can point a custom domain (e.g., yourname.dev) to your Vercel project.
  1. In the Vercel dashboard, open your project and go to Settings → Domains.
  2. Enter your domain name and click Add.
  3. Vercel will show you the DNS records to configure. Add them at your domain registrar:
    • For a root domain (yourname.dev): add an A record pointing to Vercel’s IP.
    • For a subdomain (www.yourname.dev): add a CNAME record pointing to cname.vercel-dns.com.
  4. DNS propagation typically takes a few minutes to a few hours. Vercel will automatically provision an SSL certificate via Let’s Encrypt.
Use the root domain as your primary domain and set up a redirect from www to the root, or vice versa, in the Vercel dashboard under Domains.

​
Automatic deployments

Once connected to GitHub, Vercel automatically handles deployments for you:
  • Production deploys: Every push to the main branch triggers a new production deployment. Your live URL always reflects the latest commit on main.
  • Preview deployments: Every pull request gets its own unique preview URL. This lets you review changes before merging them to main without affecting the live site.

​
Other platforms

The portfolio runs on standard Next.js 16 with the App Router and can be deployed to any platform that supports Node.js or Next.js.
Regardless of platform, you must set GROQ_API_KEY in that platform’s environment variable dashboard. Never commit .env.local to your repository — it is already listed in .gitignore.

Netlify

Netlify supports Next.js deployments. Add the @netlify/plugin-nextjs plugin to enable full App Router and API route support. Configure environment variables under Site configuration → Environment variables.

Railway

Railway provides full Node.js server support and works with Next.js out of the box. Connect your GitHub repo, set GROQ_API_KEY as a Railway environment variable, and deploy.

AWS Amplify

AWS Amplify is compatible with Next.js and handles SSR. Add your environment variables under App settings → Environment variables in the Amplify console.

Docker

The project can be containerized using a standard Next.js Dockerfile. No Dockerfile is included in the repository, but Next.js provides an official example. Pass GROQ_API_KEY as an environment variable at runtime.

Build docs developers (and LLMs) love

Get started for freeTalk to us