Website Documentation

Open public/theme.config.json to update brand colors

Replace public/logo.png with your logo

Update src/app/layout.tsx metadata with your business name and description

Update social links in src/components/layout/Footer.tsx

Create a new .md file in src/content/blog/ directory

Add frontmatter with title, date, author, excerpt, image, and tags

Write your content using Markdown formatting

Images go in the public/ folder and reference them as /image-name.jpg

The blog automatically updates when you add new files

Homepage: Edit src/components/sections/HeroSection.tsx

About page: Edit src/app/about/page.tsx

Services: Edit src/app/services/page.tsx

Contact: Edit src/app/contact/page.tsx

All images should be added to the public/ folder

Create a new folder in src/app/ with your page name (e.g., src/app/pricing)

Add a page.tsx file inside that folder

Copy structure from an existing page as a template

Add navigation link in src/components/layout/Header.tsx if needed

Sign up for an email service (ConvertKit, Mailchimp, etc.)

Get your API key from your email service dashboard

Add API key to your .env.local file as EMAIL_SERVICE_API_KEY

Update src/app/api/subscribe/route.ts with your service API endpoint

Test with a real email address to confirm it works

Install n8n on your server or use n8n.cloud

Import workflow files from n8n-workflows/ folder

Update webhook URLs in each workflow

Connect to your email service API

Test each workflow with sample data

Activate workflows in n8n dashboard

Contact submissions are sent to your email (configured in .env.local)

Update CONTACT_EMAIL in .env.local to your business email

Optionally save to a database by updating src/app/api/contact/route.ts

Consider using a service like Airtable or Google Sheets for submissions

Push your code to GitHub repository

Sign up for Vercel.com and connect your GitHub

Import your repository and deploy

Add environment variables in Vercel dashboard (Settings > Environment Variables)

Your site will be live at [project-name].vercel.app

Connect custom domain in Vercel dashboard

NEXT_PUBLIC_SITE_URL - Your website URL

EMAIL_SERVICE_API_KEY - Your email service API key

CONTACT_EMAIL - Email to receive contact form submissions

NEXT_PUBLIC_GA4_ID - Google Analytics 4 measurement ID (optional)

Add these in .env.local for development and in hosting platform for production

Purchase domain from registrar (Namecheap, GoDaddy, etc.)

In Vercel: Go to Settings > Domains > Add

Enter your domain name

Update DNS records at your registrar with values from Vercel

Wait 24-48 hours for DNS propagation

Your site will be live at your custom domain

Create Google Analytics 4 account at analytics.google.com

Get your measurement ID (starts with G-)

Add NEXT_PUBLIC_GA4_ID to your environment variables

Deploy and verify tracking in Google Analytics Real-Time report

Update metadata in src/app/layout.tsx with your business keywords

Write blog posts regularly (2-4 per month minimum)

Submit sitemap.xml to Google Search Console

Get backlinks from other reputable websites

Optimize images with descriptive file names

Use heading tags (H1, H2, H3) properly in content

Images not loading: Check file names match exactly (case-sensitive)

Email forms not working: Verify API keys in environment variables

Build failing: Run "npm install" to update dependencies

Styles not applying: Clear browser cache and hard reload (Cmd/Ctrl + Shift + R)

Page not found: Check folder structure matches URL path exactly

Check this documentation first

Review error messages in browser console (F12 > Console)

Search error messages on Google or Stack Overflow

Contact your developer for custom modifications

Join Next.js community on Discord for framework questions