Back to blog
AI Tools5 min read

How to Build AND Deploy a Website With Claude Code

Most Claude Code website tutorials stop at localhost. Here is how I build a site with Claude Code and take it live on a real domain in minutes using the free Hostinger Connector.

You have probably seen a hundred videos where someone builds a slick website with Claude Code. They describe a page, Claude writes the code, and it shows up on localhost:3000. Cool. But then the video ends. The site is still stuck on their laptop. Nobody else can see it.

That last step, actually getting it online on a real domain, is the part that used to eat my whole afternoon. Not anymore. Now I say one line to Claude Code and the site is live, with a real URL and real HTTPS, in a couple of minutes.

Here is the exact setup.

Get Hostinger + the Connector plugin (10% off)
The Connector plugin is free. You just need a Hostinger plan, from $3.99/mo. Use code MOE-LUEKER for an extra 10% off.

Why most Claude Code tutorials stop too early#

Writing the code was never the hard part. Claude Code, especially on Claude Opus 5, is genuinely good at front-end now. The hard part is everything after: buying a domain, pointing DNS, setting up SSL, uploading files to a server, and praying it all connects.

That gap is why so many AI-built projects die on a laptop. You build something great and it never goes anywhere.

What you need#

Two things, and one of them is free:

  • Claude Code (the tool you are probably already building with)
  • Hostinger Connector, a free Claude Code plugin that gives Claude direct access to your Hostinger account so it can deploy, not just write code

The plugin is free. You only pay for a hosting plan, and plans start at a few dollars a month. If you want to follow along, grab a plan here and use code MOE-LUEKER for 10% off.

Step 1: install the Connector#

Open Claude Code and run one command:

/plugin install hostinger

You can also install it from the Claude plugin directory. Either way, it opens your browser, you log into Hostinger, and you authorize it. No API keys, no config files to babysit. When you connect it inside Hostinger, you pick which parts of your account Claude can touch (websites, domains, DNS, email, VPS) and generate a token.

Once it is connected, you can ask Claude to check the connection and it will confirm it is ready.

Step 2: build the site#

This is the part everyone already knows. Describe what you want and let Claude Code build it. In the video I take my own liquid glass component library, which was sitting locally on my machine, and just tell Claude:

"Publish this landing page with the Hostinger Connector on a temporary domain."

That is it. Claude builds it out, then the Connector takes over.

Step 3: deploy to a live URL (the payoff)#

Here is the part nobody shows. The Connector provisions the site, sets up SSL, and points the DNS, so the page is actually live. I open an incognito window, paste the URL, and there it is: a real site with a padlock in the address bar, reachable from anywhere.

I never opened a browser dashboard. I never dragged a single file. The whole thing happened inside the same chat I was building in.

~
Start on a temporary URL first so you can review the site before you touch a real domain. When you are happy, connect your custom domain in one step.

Step 4: your own domain and quick edits#

Want it on your own domain like yoursite.com? You can connect it from the Hostinger dashboard, or just ask Claude to check which domains are available and buy one right there. In the video Claude comes back with openglass.dev, openglass.app, and a few others, all checked for availability without leaving the editor.

Changed your mind on a headline or a color? Tell Claude to fix it and redeploy. It is live again in seconds. You are not publishing once and walking away. You manage the whole thing from the same chat.

It is not just websites#

The same connection can manage your domains, spin up a VPS, set up business email, or run a store. It is the deploy step for anything you build with Claude, which is why it fits so cleanly into a normal build session.

If you have ever set up an AI agent on a server, this will feel familiar. I walk through that side of Hostinger in my Hermes agent setup guide.

What it costs#

The Connector plugin is free. You need a Hostinger plan, and I use one that gives me unlimited websites so I can publish as many of these as I want without paying more per site. Plans start at $3.99/mo, you get a free domain for the first year, managed SSL, and a CDN, and code MOE-LUEKER takes 10% off.

Try Hostinger Connector
Build and deploy websites straight from Claude Code. Free plugin, plans from $3.99/mo, code MOE-LUEKER for 10% off.

Grab the free liquid glass library too#

The site I deployed in the video is my own free component library, Open Glass UI. It is 40 accessible liquid glass components for React so your AI-built sites stop looking AI-made. It is MIT licensed and free.

You can download it on Gumroad (you also get the copy-paste skill for your coding agent), see the live demo, or clone it from GitHub. I break down the whole library in this post on Open Glass UI, and if you want the deep dive on the plugin itself, read what Hostinger Connector actually is.

If you liked this, you will probably like how I built a full app with Replit in 2 prompts too.

That is the whole loop. Build it with Claude, say one line, and it is live on your own domain in the same chat. Go ship something.

ML
Moe Lueker
claude codeclaude code websitebuild website with claude codedeploy website claude codehostinger connector

Get new videos in your inbox

Weekly AI workflows. No fluff.

No spam. Unsubscribe anytime.

Want more guides like this?

Subscribe for new videos every week.

Subscribe on YouTube