The complete website-building guide.
A readable, step-by-step guide to briefing an AI agent, testing locally, using GitHub, deploying and connecting your domain.
01. Start with a clear brief.
Give your agent enough context to build something useful.
You’ll need: A coding agent, a project folder and an idea.
Be specific about what visitors should be able to do. ‘A one-page site for a local architect, with three projects and an email link’ gives the agent more direction than ‘make a modern website’. Review the proposed scope and keep the first version small.
- Open your coding agent in an empty project folder. Codex, Claude Code or another capable agent can work.
- Describe the purpose, audience, content and visual direction. Add a reference if you have one.
- Adapt the starter prompt below. Ask the agent to create the files and explain how to preview the result.
02. Run it. Look at it. Refine it.
Turn the first draft into a site you are happy to share.
You’ll need: Your project folder, Node.js and a terminal.
Try ‘Make the heading smaller’, ‘Reduce the spacing between these sections’, or ‘Stack this layout on mobile’. Make one clear request at a time and check it. If a command fails, share the full error with your agent instead of guessing at a fix.
- Install a current Node.js LTS release if it is not already available. Open a terminal in the project folder.
- Run the commands below, then open the local address printed in the terminal. Keep the terminal running while you work.
- Review the copy, links and layout at desktop and mobile sizes. Tell the agent what to change, then check the result.
- Before publishing, ask the agent to run the production build and fix errors. Run the project’s lint command too, if configured.
npm install
npm run dev03. Give your code a home.
Save a version of your site outside your computer.
You’ll need: A GitHub account and Git or GitHub Desktop.
The repository holds the project. A commit records a set of changes locally, with a message describing them. A push sends those commits to GitHub. Commit and push after meaningful updates so you have a history to return to. A private repository can still be connected to Vercel.
- Create an empty repository on GitHub. A repository is the project’s home: its files and change history.
- Ask your agent to initialise Git and review which files will be included. Exclude passwords, .env files, node_modules and build output.
- Make a commit: a named snapshot of your changes. Connect the local project to your new GitHub repository.
- Push the commit to GitHub, then open the repository online and check that your source files are there. Your agent may be able to run these steps with your permission.
Local project → commit → push → GitHub04. Put your site on the internet.
Make the website available to visitors.
You’ll need: Your GitHub repository and a Vercel account.
Once GitHub and Vercel are connected, a push to the production branch can automatically build and publish the next version. Other branches can get preview links so you can review changes before they reach the main site.
- Sign in to Vercel. Choose Add New → Project, connect GitHub and grant access to the repository you want to deploy.
- Import the repository. Check that Vercel detects Next.js and that the root directory contains package.json. Keep the default build settings for this simple site.
- Select Deploy. If the build fails, copy the relevant build log into your agent and fix the source, then commit and push again.
- Open the supplied .vercel.app address. Test navigation, mobile layout and video playback on the deployed site.
05. Make the address your own.
Let people find your website at an address you own.
You’ll need: A registered domain and access to its DNS settings.
DNS changes need time to reach different networks. Use Vercel’s domain status to check progress. If verification fails, confirm which provider actually manages your nameservers and compare every record with Vercel’s instructions. Use the values shown for your project; do not copy a random IP address from an old guide.
- Buy a domain from a registrar, or use one you already own. In Vercel, open your project’s Settings → Domains and add it.
- Vercel will show the DNS records it needs. At the provider managing your DNS, copy the exact record types, names and values it gives you.
- Keep unrelated records, especially those for email. If you want both the root domain and www, add both in Vercel and choose the primary address.
- Wait for DNS verification and HTTPS to complete, then visit the domain. Update your site’s canonical domain configuration and redeploy if it has changed.
Keep moving at your own pace
The book and webinar cover the same learning path. Keep checking the actual result as you build. If you would like support with the next step, speak with Valid Agenda.