Point Zero: how I've made this website using AI in 1h

·4 min read

This is the story of how I built this entire website in roughly one hour, using nothing but natural language prompts and Cursor AI.

The Starting Point

I started with an empty folder and a simple idea: I wanted a personal website with a blog, a portfolio section, and a striking visual design. Instead of writing code manually, I decided to let AI do the heavy lifting.

The Stack Decision

My first prompt was about architecture. I initially had a Strapi + Next.js setup, but quickly realized it was overkill for a static personal site. AI suggested simplifying to:

  • Next.js 16 with App Router
  • MDX for blog posts (no database needed!)
  • Tailwind CSS for styling
  • Static export for deployment

One prompt, and the entire project structure was reorganized.

The Black Hole Effect

The most eye-catching element of this site is the animated black hole background. I found a cool CodePen effect and simply asked: "Add this effect as the background".

The AI converted the vanilla JavaScript web component into a React component, handled all the canvas rendering, and even made it responsive—wider on mobile to avoid the stretched look.

Typography & Fonts

I wanted a specific vibe:

  • Special Gothic Expanded One for the hero headlines
  • Montserrat Light Italic for the subtle accent text
  • Quicksand for body text

Each font change was a single prompt. The AI handled Google Fonts integration, CSS variables, and Tailwind configuration automatically.

The "AI" Glow Effect

The animated gradient glow on the word "AI" in my headline? I showed the AI a reference image and described what I wanted: "violet-purple gradient, animated, with a grainy/noise texture".

After a few iterations (too much glow, remove the rectangle, add animation), we nailed it. The same effect powers the "Get in touch" button.

Contact Dialog

Instead of a boring contact page, I wanted a sleek modal with my contact options. One prompt:

"When clicking Get in touch, open a dialog with 3 channels: X, WhatsApp, Email. With purple icons, super stylish."

The AI created the entire component with animated hover states, gradient icons, and smooth transitions.

Deployment

The deployment conversation went something like this:

Me: "Deploy this to my server at 82.165.94.91"

AI: Creates server setup script, configures nginx, sets up SSL with Certbot, and deploys via rsync

Every subsequent change followed the same pattern: edit → build → deploy. All automated.

Performance Optimization

When Lighthouse flagged HTTP/1.1, I asked: "How complex is it to fix this?"

The AI's response: "Very simple"—and then it SSH'd into my server and enabled HTTP/2 in nginx. One command.

The Workflow

The entire development process was conversational:

  1. Describe what I want in plain English
  2. AI implements it
  3. I review and request adjustments
  4. Repeat

No documentation diving. No Stack Overflow. No debugging cryptic error messages. Just a conversation.

What I Learned

Building with AI isn't about being lazy—it's about speed and iteration. I could try ideas instantly:

  • "Make the glass effect more transparent"
  • "Add an underline to 'literally'"
  • "Change the font to something bolder"

Each iteration took seconds, not minutes. The feedback loop was incredibly tight.

The Future

This is just the beginning. The blog you're reading, the portfolio section, the animations—everything was built through conversation. And I can evolve it the same way.

Want to build something similar? The barrier to entry has never been lower. You don't need to be a senior developer. You need to know what you want and how to describe it.

Welcome to the future of web development.

Built with Cursor AI, Next.js, and a lot of "make it more purple" prompts.