Building My Personal Website with AI Agents as Teammates

I've worked in enterprise software since 2008. That's more than 18 years of integration platforms, data management and delivery work, and these days I'm a Technical Lead and Senior Software Engineer at an IT consulting company in Melbourne. In all that time I'd never built a proper personal website I was happy with. It was always "next quarter."

This year I finally built it. I also used it to try something properly: building and evolving a real production system with AI agents as part of the team. Grok Bot worked as my AI engineering assistant the whole way through. Here's how it went.

Update: since this post first went up on 12 Oct 2026, I've added one-tap publishing from email. That section is new.

Why build it myself?

I could have picked a template and been done in an afternoon. But a personal site is a good place to practise what you preach. I wanted it to show how I actually work: clean architecture, infrastructure as code, automated tests gating every deploy, and sensible privacy defaults. I also wanted a low-risk way to push AI-assisted development further than I usually can on client work.

The stack

It's a MERN-style stack built to run cheaply on AWS serverless:

• Frontend: React + Vite, prerendered at build time (renderToString on the build side, hydrateRoot in the browser). Every page arrives as real HTML, which helps both SEO and first paint, and React takes over once it loads.
• API: Express running on AWS Lambda through serverless-http, behind an API Gateway HTTP API.
• Data: MongoDB Atlas.
• Hosting: S3 + CloudFront, with a small CloudFront Function that redirects www to the apex domain, serves clean URLs and returns real 404s instead of quietly sending back the home page.
• DNS and services: Route 53, and SES for the contact form.
• Infrastructure as code: everything is defined in SAM/CloudFormation, so the whole environment can be rebuilt from the repo.

None of these choices is unusual on its own. Getting them to work together cleanly took most of the effort.

Working with AI agents, not just autocomplete

This is the part I most wanted to write about. I've used AI coding tools such as Claude Code, Grok Bot and Grok Build for a while. On this project I let an AI agent take on whole pieces of engineering work. It wasn't just completing lines of code.

In practice, Grok Bot and I worked like a lead and a capable engineer:

• I set direction and constraints. For example: "prerender every page," "don't store contact messages," "batch changes so we don't burn build minutes."
• The agent did a lot of the legwork. It scaffolded components and API routes, wrote CloudFormation, wrote and extended tests, ran the browser regression suite and dug through cross-browser bugs.
• I reviewed, challenged and decided. Every change still went through tests and my own judgement before it shipped.

What I took away is that working well with AI is mostly an engineering-leadership skill. The useful parts are clear briefs, good guardrails, fast feedback loops and solid review. Tests matter even more than usual, because they let you trust work you didn't type yourself. The agent made me much faster, but how good the result was still came down to how well I framed the problem and checked the output.

CI/CD: boring on purpose

Deploys run through GitHub Actions and AWS CodeBuild, which do the actual build and deploy, and tests gate every deploy: if anything fails, nothing ships.

After each deploy, the full browser regression runs again against the live site and emails me if anything fails.

One small, practical habit: I keep an eye on CodeBuild's free build minutes and batch related changes into a single deploy rather than pushing every tweak on its own. The AI agent picked this up as a standing rule and planned its work around it, which was a nice example of a constraint being followed consistently.

Testing that earns its keep

For a personal site, the test suite is probably more than it needs:

• 54 component and unit tests with Vitest and jsdom.
• 83 API tests using Node's built-in test runner, real HTTP calls and mongodb-memory-server, so the API runs against a real (in-memory) MongoDB.
• Playwright browser regression across pages, 5 screen widths and light and dark mode. It's now 111 checks, including both blog posts.
• A real-tap iPhone menu check in WebKit emulation, added after the bug below.

Having this in place is what made it safe to let an AI agent make wide-ranging changes. When everything is green, I can trust a refactor.

Bugs worth telling

The iPhone menu that did nothing. On iPhone Safari, tapping the mobile menu did nothing. It turned out Safari drops focus on tap, which fired my focus-out handler and closed the menu the moment it opened. The fix was to close the menu only when focus really leaves the header. We added a real-tap WebKit test so it can't come back.

The clipped gradient name. My name in the header uses a gradient text effect, and the bottoms of some letters were being cut off. The fix was a line-height adjustment. Small fix, but very visible.

Graphics missing on some devices. Some illustrations didn't render on certain devices. Debugging it meant comparing behaviour across browsers until we found the differences and fixed them. This is the kind of slow, methodical work where an AI agent that's happy to run the same checks over and over is a real help.

Features and design

The site uses a light-blue, orange and purple theme with dark mode, and a centered layout based on percentage widths so it scales nicely from phones to wide monitors. There's a cloud-and-shuttlecock illustration and an interactive skills network graphic that shows how my skills connect, AI and LLM tooling included, next to React, Node.js, AWS, TestCafe, Keycloak, Elastic Stack, Ansible and Solr.

There are pages for Projects, a Blog, my Resume and Hobbies. Behind the scenes there's a simple admin UI for managing content.

One-tap publishing from my inbox

I wanted the AI agent to be able to help with posts while I stay in control of what goes live. The agent drafts, and I review and approve every post before it's published. It's a nice split: the agent does the writing, and I keep the final say.

Privacy by default

A few deliberate choices:

• Contact messages are emailed to me, not stored. It would have been easy to save them in the database, but I didn't need to keep them, so I don't.
• Cookie-less view counting. I wanted basic analytics without tracking people, so there's a privacy-friendly view counter with simple admin analytics and a /privacy page that explains exactly what's collected.

Security, built in

Security got the same treatment as the rest of the build. Secrets are kept out of the code, the admin area needs two-factor sign-in, and automated security checks run on every push, with browser checks after every deploy.

I also had the AI agent run a full security review of the site. It found a few issues and we fixed them all, including one the agent had introduced itself earlier in the project. That's a good reminder that AI work needs the same review as anyone else's, and that AI is also very good at doing that review.

SEO, done properly

Because pages are prerendered, search engines and link previews see real content. On top of that there are per-page titles, Open Graph tags for link previews, a sitemap, robots.txt, JSON-LD structured data, and the site is registered with Google Search Console.

What I'd tell another engineer

1. Treat AI agents like teammates. Give clear briefs and firm constraints, and review their work the way you'd review anyone's.
2. Invest in tests early. They're what let you move quickly, with or without AI.
3. Make privacy a design decision. The simplest way to protect data is to not collect it in the first place.
4. Keep the pipeline boring. Infrastructure as code and test-gated deploys mean releases aren't stressful.
5. Review AI work, including security, like any teammate's. Check it properly, and use AI for the methodical, repetitive reviews it's great at.

Come have a look around

The site will keep evolving, and I'll keep building it with AI agents in the loop. Browser checks run after every deploy, so the live site stays checked as it changes. Have a look through the projects, the skills graphic and the blog. And if you love badminton as much as I do, check out the Hobbies page and Nova BadmintonSpace, the community I founded. See you on the court.