How to create a blog with Vercel + Next.js

🧱 1. Start with blog-starter-kit

You can fork or clone the official repo here:
👉 https://github.com/vercel-labs/blog-starter-kit

Install dependencies:

pnpm install
# or
npm install
Then run the dev server:

bash
Copy
Edit
pnpm dev
# or
npm run dev
Now you can start editing content from the /content folder or customize layout/components in /components.

🌐 2. Deploy to Vercel
Push your project to GitHub.

Go to vercel.com, log in with GitHub, and import the project.

Vercel will detect the Next.js framework and auto-configure the build.

Click Deploy!

After deployment, Vercel will give you a public preview domain like:
https://your-blog.vercel.app

🔗 3. Add a custom domain from P.A Vietnam
If you've purchased your domain from P.A Vietnam, here's how to connect it:

Step 1: Go to Vercel → Your Project → Settings → Domains
Add your domain (e.g. yourdomain.vn)

Vercel will show you the required A Record or CNAME Record

Step 2: Go to P.A Vietnam’s DNS Manager
Login to https://dns.pavietnam.vn/

Add or update your DNS records:

If Vercel shows a CNAME, add a CNAME pointing to cname.vercel-dns.com.

Or if A record, add the given IPs from Vercel

Save and wait for DNS propagation (~5–10 minutes)

Step 3: Back in Vercel, click Verify Domain
You should see a ✅ success message, and your blog will now load on your custom domain!

🛠️ 4. Customize Your Blog
You can:

Edit components/intro.tsx for homepage intro

Create posts in /content/*.mdx

Change site config in lib/config.ts

📝 Bonus Tips
Use Contentlayer to manage markdown content with type-safety

Add SEO tags in components/meta.tsx

Write about what you're learning (Test Automation, AI in Testing, etc.)

That’s it! You now have a professional-looking tech blog running on Next.js + Vercel, with your own domain powered by P.A Vietnam 🚀

Follow for more dev tips & QA insights!
— Hung