Building My Website as an AI-Native Digital System

Building a website differently

mariohodzelmans.nl is more than my personal website. It is also a live experiment in how websites and digital products can be built, managed and continuously improved with artificial intelligence.

Instead of using AI only to generate text, images or pieces of code, I use AI as part of the development process itself. I define what I want to achieve. AI helps me analyse the existing system, develop solutions and implement changes.

Behind that conversational layer is still a professional web development stack. The difference is how I interact with it.

From idea to production

The basic workflow is deliberately simple:

Idea → AI → Development → GitHub → Deployment → Live

I use AI systems such as ChatGPT and Claude to help translate ideas into technical implementations. GitHub is the source of truth for the application. Changes to the code are stored and versioned there, while Vercel connects the repository to the production environment and handles deployment.

AI does not replace the infrastructure. It becomes an intelligent interface to it.

The system behind the website

The website is built with Next.js, React and TypeScript. Around this foundation are several specialised layers.

GitHub manages the source code and development history. Vercel handles deployment and hosting. Payload CMS provides structured content management. Puck adds a visual editing layer using React components. Supabase and PostgreSQL provide the underlying data infrastructure.

The result is not one large platform doing everything. It is a collection of specialised technologies working together.

Three ways to interact with one system

1. Natural language

ChatGPT and Claude allow me to work from intention. Instead of beginning with individual files or lines of code, I can begin with a problem or idea. AI can help analyse an existing implementation, investigate an issue, propose an improvement or help implement new functionality.

2. Visual editing

Puck provides a visual layer on top of React components. Content and components can increasingly be managed through interfaces that feel closer to a visual website builder while the underlying website remains a real React application.

3. Code

The technical foundation remains accessible through Next.js, TypeScript and GitHub. AI and visual editors do not replace the underlying application. They provide additional ways to interact with it.

Conversation when that is easiest. Visual editing when that is easiest. Code when that is necessary.

Human-directed, AI-assisted

I do not consider this an autonomous AI website. I deliberately remain part of the process. AI can analyse, suggest and implement at remarkable speed, but someone still needs to decide what should exist, whether an implementation makes sense and whether it actually improves the experience.

My role increasingly moves from manually executing every technical step toward directing the system.

Why this matters

The most interesting development is not that AI can generate websites. The bigger change is that natural language is becoming an interface to software.

AI reduces the distance between intention and implementation. That does not make good architecture less important. It makes good judgement more important. When producing code becomes easier, knowing what to build, why to build it and how everything should work together becomes increasingly valuable.

A website that keeps evolving

This case study has deliberately been marked LIVE. There is no final version.

I use mariohodzelmans.nl as a working environment to experiment with AI-assisted development, visual editing, automation, structured content and new ways of interacting with software. When the architecture changes or an important capability is added, the development log is updated.

Current architecture

AI-assisted development → Next.js + React + TypeScript → Puck + Payload CMS → Supabase + PostgreSQL → GitHub → Vercel → mariohodzelmans.nl

The individual technologies will change. The principle behind the project is designed to last longer:

Human intent → AI assistance → structured systems → real-world output.

That is the experiment. And it is still running.

Development log

August 2026 · Living case study published
The website development workflow is now documented as an ongoing AI-native case rather than a time-sensitive blog post.

August 2026 · Puck visual editing added
Puck was introduced as a visual editing layer alongside conversational AI and direct code development.