DNXAI

How I Built My Website With Claude, From Front End to Backend, Without Being a Programmer

By the DNX AI editors5 min read

This website you're reading, dnxai.com, I built with Claude. First I tried Lovable and Bolt, but I couldn't get it to this level. I didn't understand how to deploy it or host it. Now, with Claude and Hostinger, everything works: the front end, the backend, payments, security and this blog.

Here's how I did it, and how you can too.

Focus on the backend first

If you want to use Claude to build a website, focus on the backend results. Think about your users and how they're going to use the website. That's how you get good results. The backend is very important.

The best part: I can wake up in the morning, type to Claude, and it updates my website. I can change the colours or anything else, any day.

My workflow: Gemini plans, Claude builds

Here's exactly how I start every website:

  1. Ask Google Gemini to research your idea. Tell it about the site you want to build. Ask it to find the gap in the market and the problem your site will solve.
  2. Ask Gemini for a landing page. Have it design the landing page and give you two things: an HTML file and a prompt that describes the website.
  3. Design the look with Gemini images. Use Gemini's image tool to create front-end designs: how your pages, buttons and sections should look.
  4. Take everything to Claude. Upload the HTML file and the design images, and paste in the prompt. Claude uses them to build your user interface. Tell it what you want, for example: "Don't make the website look like AI."
  5. Let Claude build the rest. Claude creates the website, then builds the backend: the database, users and payments.
  6. Test it yourself. Open the site in Claude's preview, then browse it like a real visitor. Is it easy to use? Can people find what they need? Ask Claude to fix anything that feels confusing.

Gemini handles the research and design; Claude does the building; and I test it like a user.

Add payments

I use Claude for payments too. If you want to add a payment gateway like Stripe, Dodo Payments or Paddle, Claude will help you set it up and connect everything.

Connect a database with Supabase

To build a real backend, you need a database. Supabase is the best option for beginners:

  1. Create a Supabase account.
  2. Connect it to Claude.
  3. Let Claude create your database for you.

You can also connect your Google Search Console, your Gmail and other tools to Claude.

Use the Claude desktop app

Even if you're not good at backend work, you can do this. You need a laptop or desktop. Download the Claude desktop app, and Claude can do the tasks for you, including creating the database.

The only thing Claude needs from you: when it gets to your API keys and passwords, you type them in yourself. That keeps your accounts safe, and Claude does the hard part of the website.

Example: building a chat website

Say you want to build a chat website. Claude can build the chat and everything behind it: the messages, the logs and the rest.

My advice: do more research on the backend. Ask Claude: "How can you help me get a better backend for my chat app?"

You can also:

  • Learn from GitHub. Look at chat apps other developers have already built and study how they work. If you reuse their code, check their licence first.
  • Use Claude's deep research to teach you how to build the site and how to get the best results.
  • Add tools from GitHub. Maybe your website needs a tool that collects information, or a tool that does something special. Find it on GitHub, then ask Claude to combine it with your website.

Make your website secure

Security is where many beginners get hurt. Here's what I do:

  1. Ask Claude to check your security. Tell Claude to find all your security loopholes and fix them. It will work on the backend and fix them for you.
  2. Get a second opinion from Google's AI. Ask Gemini about security too, then have Claude put its suggestions into practice.
  3. Protect your admin login with 3 layers: a strong password for your admin panel, an email code that arrives when you log in (Supabase can send these), and a PIN code. With three layers, even if someone steals your password, they still can't get in.
  4. Use SSL. Your hosting should give you SSL (the padlock in the browser). Hostinger includes it for free.

My real example: I asked Claude to check dnxai.com for security problems. It found weak spots and fixed them. Then it built a Security tab in my admin panel that:

  • logs hacking attempts
  • blocks attackers automatically
  • locks the login after too many wrong passwords
  • emails me if any of my website files change

Use GitHub tools for SEO and speed

When your site is built and secure, look on GitHub for more free tools:

  • SEO tools that help your site rank on Google
  • Front-end tools that make your website smoother and faster

Find a tool, then ask Claude to add it to your website. Collaborate, learn, and you'll finish what you're building.

Connect APIs for more features

Claude can also connect your website to APIs, services that give your website extra powers. For example:

  • Tools that collect information from websites (only from sites that allow it)
  • Google's official APIs, like Search Console, Maps or YouTube data
  • Payment, email and AI services

With APIs, your website can do much more, and your customers get a better experience.

The tools you need

  • Hostinger: the best hosting for this. Claude can work with your Hostinger account to get everything set up.
  • Google Chrome with the Claude extension: Claude can then do research, post and help develop your website right in your browser.
  • The Claude desktop app: for the heavy work on your computer.
  • Supabase: for your database.
  • Google Gemini: for research and design.

When you put all of this together, you can build what you need, from front end to backend, without being a programmer.

More guides