This website: Next.js, Payload and AI in production
Case study
- My role
- I designed, built and shipped the website, from the CMS to the AI.
- Duration
- Started in September 2025
The problem
A portfolio had to show the work, but also prove the stack I offer: Next.js, a CMS people actually use, AI with clear rules and monitoring in production.
What I did and why
- Payload CMS for works, products, posts and settings, with draft previews.
- AI chat with the AI SDK and Claude: answers about services and projects, usage limits, logs and contact capture.
- Quotes: prices computed by the code, texts written by Claude with a number check, online signing and an archived PDF.
- Two languages with translated URLs, sitemap and structured data.
- Sentry and caching with revalidation: errors under control and fast pages.
Results
- IT + ENwith translated URLs
- 2 AI featureschat and quotes, with precise rules
- Sentryerrors monitored in production
Stack highlights
- Next.js 16
- React 19
- Payload CMS 3
- MongoDB
- tRPC
- AI SDK
- Claude
- Sentry
Working on something similar? Let's talk.
Get in touchIt is the most direct proof of how I work, because what I offer clients I use here on myself. Works, products and posts live in Payload; pages are in Italian and English with translated URLs; I follow errors and performance with Sentry and Vercel.
Two parts use AI with precise rules. The chat answers questions about services and projects, with usage limits and conversation logs, and passes contacts to the CMS. In quotes, prices are computed by the code: Claude only writes the descriptive texts from the data, and a check makes sure no number appears that is not in the data. The client signs online and the signed PDF is archived.
What I bring to an agency or a small business from this project
- AI in production with clear limits: what the code decides and what the model writes.
- A CMS set up for the people who write the content, with draft previews.
- Error monitoring and managed caching, not just a website that looks good.
