Stop Paying Your Developer: Build Your Website with Claude Code

CloudCode can build you a genuinely great business website. One that looks like your brand, that is able to take payments, collect sign-ups, get found on Google and AI search, and one that updates itself. I built my own website using just CloudCode, and I didn't code a single thing. But, there are a few things that you should keep in mind when you design one. And believe me, I really wish that I knew these before I started with it.

And just a bit of context first. I know that a lot of people, myself included, uh use the website builders like Framer or Webflow or WordPress in order to build their own website. And there's nothing wrong with it. But, I found that actually when you use CloudCode, you're able to do so much more. And the biggest difference that I found is the fact that a lot of things can run automatically.

So, for example, on my website, whenever I publish a new podcast episode on YouTube, that episode is put on my website straight away, along with the transcript to it, Spotify link, Apple link, all of it. So, it saves me so much time. And secondly, making updates to the website is so, so quick. Because, let's say that I want to change a contact email on the website. Instead of actually having to look for all of the pages, checking where I actually have mentioned that contact email, I can just ask Claude to update it, and it will find each subpage where it is mentioned.

And it's actually much cheaper than using those website builders. So, if you're just starting or you want to move your website away from those website builders, this is a video for you. So, if you're designing website from scratch, first think about what job does it serve. What do you want people to do on that website? Because a lot of people like how a website looks like, but they don't actually think about what action do I want the user to make on that website, whether that's signing up to my newsletter or filling in their contact information or maybe it's making a sale.

So I would start by asking Claude to interview you and explain that you want to build a website for your business and ask Claude to ask you questions like how people should feel when interacting with your website, what is the action they should be taking, what kind of things are a priority for your business, things like that. And when that brief is done, I would say add the key points of this brief to Claude.md file, which is basically this series of instructions that Claude will read whenever it will be updating or making a website. Secondly, make it your own design. And the reason why I'm saying it is that on the internet right now, there's so many websites which look like a carbon copy of each other.

And whenever you land on that website, within a few seconds, you can feel like it's AI generated. And the way to prevent people from feeling like this is making it your own. So I would start by feeding it two things. The first one is references. So I would find two or three websites that you love.

And actually I would recommend that they're not in your industry. And I would drop Claude the link to them and explain what do you actually like about it. Don't ask it to copy it, ask it to learn from them. For example, you like the fact that there's a lot of white space which makes the website look more elegant or you like on the website the way that the navigation bar works. Whatever it is, be quite specific about it.

And secondly, your brand kit. Your logo, your exact color codes, your font and real photos of you. So not a nice red, but the exact codes of the color that you use. Because if you don't have those written down, this is your homework before you even start making a website. You need to have brand guidelines.

Now, finally, let Claude pick a boring, proven setup. And you'll hear words like next.js, React, Tailwind. And you don't actually need to understand them. All you need to do is just paste this prompt in.

For most people, that ends up as your website lives in a folder, it's backed up on GitHub, and a host like Vercel puts it live. And this is exactly how my Women Need AI website works. Tip number four is plan the whole site and then build one page properly before you build the rest. And when doing that, I switch on plan mode and ask Claude to first plan the pages from your brief, like home, about, services, whatever you need. Then you read that plan, cut out what you don't need, and go with making a single page.

And the reason for it is that you want to get it right, the fonts, the spacing, the buttons. Cuz the thing is you need to get it right before you repeat it. Cuz what often ends up happening is you're stuck with all of the pages on the website, and they all have the same mistakes. It is so much easier to just start with the homepage and get it working really well in the design that you want, and then move on to working on the other pages. On my website, I got free resources page, and I got the first one perfect, and then for every other one, I just said, "Make a new page exactly like this one for this lead magnet.

" And once you're happy with it, I would use this prompt so that Claude knows exactly what to do as you're going to expand on that website. Number five is focus on the mobile. Because most of your visitors nowadays come from a mobile phone, and Claude defaults to designing for big screen, which is a big difference. So every time I would say, check this page at phone size and fix anything that is not working. And Claude needs to resize its own preview and take screenshots and check if it actually works on the mobile phone.

Because there is nothing more annoying than being on someone's website and the way it loads on mobile phone is just terrible. Tip number six, use GitHub. Ask Claude to set up GitHub for your website. And that means that whenever you make any changes to it, all of the changes go into the cloud and it's really easy to do them. Tip number seven is if your site collects anything, know exactly where it goes.

And I mean by that contact forms, newsletter sign-ups, lead magnet downloads, payments, etc. Because each one is a real person that is trusting you with their details. So, I would ask Claude three questions. One is where does this data get saved? Who gets notified when someone signs up?

And three, are there any secrets that are visible in the website code? Because for anything that is involving money or passwords, you need a proper service. Payments have to go through something like Stripe, sign-ups go into a proper database. On my side, I use Superbase for example. And if you're collecting emails, you need to add a consent checkbox so that people actively agree to hear from you.

And then you test it yourself. You fill in your own form, check where it lands, check that the email arrives, check that the download actually works. And you do that every time you change a form. Number eight, a beautiful website nobody finds is a hobby. Because the technical side of being found is exactly what Claude is actually great at.

Because once the website is built, you need to do an SEO and EEO check and give it a prompt like this. And I made a whole video about how you can get your business to show up in AI search, which is going to be somewhere here. But, in general, there are a few things that will make the biggest difference. First, a title and description for every page, a share image, which it means that's the picture that people see when they see the preview of the website. Next one is a site map, which is a list of every page so that search engines don't miss it.

And then finally, a TXT file, which is a plain summary of your business written for AI assistants. And if you make videos or podcasts, give each one its own page with a transcript. Because Google and AI tools can't watch your videos, but they can read it. And every episode on my website works this way. Tip number nine, before the very first launch, ask Claude for a launch track list.

And it should cover things like, does every link work and there are no dead pages? There should be a friendly page not found page. Every form should be tested end-to-end. Images should have descriptions for screen readers and for search. Text should be easy to read with enough contrast.

There should be a privacy policy if you're connecting any kind of contact details. And analytics, so that you know if anyone actually visits your website. And this is probably the most important one, because you need to find out what actually works. Because when you're just starting, you have actually no idea how people will use your website. And to do that, you need two kinds of data, and you can get both for free.

Firstly, the numbers, like how many people visit which page and where do they come from? From Instagram, from Google, from your podcast. And this tells you what marketing efforts are actually working. And the second is the heat map and recordings. And this is really fun, because it shows you what people actually do once they're there.

A [snorts] heat map is a picture of your page with color on top, and red is where a lot of people click, blue is where hardly anyone goes to. And you'll often find people clicking on things that aren't buttons, like a photo or a heading, because they expect it to do something. And that's a free lesson for you in what your visitors want {slash} expect. Then there is the scroll map, which shows you how far down the page people actually go. Because if only 30% of visitors even reach your sign-up form, it should be moved up.

And then there are session recordings, which are anonymous replays of real visits. We can watch the mouse move around, hesitate, scroll back up, give up. It's like sitting behind someone while they use your site. It's a bit uncomfortable, but incredibly useful. And the tool that I would recommend to set that up is Microsoft Clarity.

Uh it's a free tool, it does heat maps, it does recordings, and it even flags rage clicks, which is where someone clicks on the same spot over and over in frustration. For the visit numbers, if your site is on Vercel, like mine is, Claude can switch on Vercel's own analytics, which doesn't need cookies at all. Otherwise, Google Analytics is the usual choice, and you can ask Claude to set that up for you. And I would actually set up a routine where you ask Claude to go over your analytics once a week and summarize what's working, what is not, and what you can improve. And this is the real superpower of building your site with Claude Code.

The first version is never going to be perfect, but you can improve it really easily with Claude. And finally, don't just build a website, build one that keep itself up to date. On my site, for example, new podcast episodes appear by themselves, and the homepage always shows my latest YouTube video, and I never touch it. So, ask yourself, what do I update on my website by hand and how I can make it automatic? Maybe testimonials, prices, events.

And just ask Claude to do it for you because most of the time it can do it really well. Thanks for watching this video. If you want my website starter pack and the launch checklist, check out the description of this video and please subscribe to this channel. Currently, only 6% of people that watch my videos are actually subscribed and it would make a world of difference. Thanks and I'll see you in the next one.