I Fired the "One-Click" AI Builders: How I Built a React Portfolio with Gemini (Without Knowing React)

#ai #webdev #career #beginners

The "One-Click" Trap

We’ve all seen the trend. You export your LinkedIn profile to a PDF, feed it into a tool like Gamma or a generic GPT wrapper, and boom—you have a website.

I tried it. It worked. And I hated it.

Technically, the site was functional. But aesthetically? It was a corporate PowerPoint slide pretending to be a portfolio. It lacked soul. As an AI engineer and a creator, I realized I couldn't be represented by a generic template.

So, I deleted it.

The "It Works on My Machine" Nightmare

I decided to go the hard way. I opened Google AI Studio, fired up the latest Gemini models, and decided to build something custom. I wanted a specific vibe—something distinctive.

But then reality hit. I fell into the Perfectionist Trap.

I spent weeks tweaking pixels in the AI preview window. It looked great in the chat interface. But when I finally copied the code to VS Code and tried to push it to GitHub, I faced the classic developer’s nightmare:

"It works on the AI's preview." (But it crashes everywhere else).

Dependencies were missing. Components were hallucinated. The routing logic was circular. The code wasn't deployment-ready; it was just a fragile prototype. Most people would have quit there and gone back to the template.

The Pivot: From Coder to Architect

I didn't quit. I adopted a new rule: Restart from Zero.

I scrapped the broken codebase. But this time, I realized that to build with AI, I had to stop acting like a "coder" and start acting like an "architect."

Here is the truth about building with AI in 2025 that most tutorials don't tell you:

1. It’s not about Syntax, it's about Articulation

I don't technically know React or HTML deeply. If you asked me to write a complex hook from scratch on a whiteboard, I’d fail. But the AI knows the syntax perfectly. My job isn't to type; my job is to describe the architecture.

I stopped prompting: "Make the button blue."
I started prompting: "Create a reusable button component that accepts 'variant' props, using Tailwind CSS for styling, and ensure it glows when hovered."

2. Debugging is a Logic Game

When the AI threw errors, I didn't fix them by knowing the language nuances. I fixed them by understanding the flow of data.

If the page crashed, I didn't look for a missing semicolon. I looked at the logic: Is the data passing from the parent component to the child correctly? Is the state being updated before the render?

I debugged by interrogating the AI about its own logic, not by reading the documentation.

The Result

I battled errors for days. I refined my prompts using structured frameworks. And today, Version 1 is live.

It’s not perfect code. A senior React dev might look at it and find inefficiencies. But it works. It deploys. And most importantly, it’s mine.

The Takeaway

This is the future of development for many of us. You don't need to memorize the dictionary to write a novel. You just need a story and the will to write it.

If you are hesitating to build something because you "don't know the language," stop. You have the most powerful engineer in the world at your fingertips. You just need to learn how to lead them.

(Link to your portfolio here)

Have you tried building a full app purely with AI prompting? Did you find the "deployment gap" hard to bridge? Let's discuss in the comments.