Publish AI, ML & data-science insights to a global community of data professionals.

How to Code Your Own Website with AI

Learn how to vibe-code your own website

In this article, I’ll show you how easy it is to move from a drag-and-drop editor for your website, to coding it yourself using coding agents. Image by ChatGPT.

WordPress is a common hosting platform for your own website, where you can showcase your portfolio and other useful resources about yourself. Before making my switch, I had been using WordPress for about 1 year, and I started thinking about a few things that were difficult when using WordPress:

  • Creating the website – It was hard to achieve the design I wanted
  • Slow – Creating and updating in WordPress is slow because it’s a drag-and-drop editor
  • Lack of flexibility – you have to use premade components. Alternatively, you can use custom HTML code, but you then still have to copy the code over, which is slow

I then thought about how easy it is to program up my own website using an agentic coding tool like Claude Code or Cursor.

Why am I spending a lot of time drag and dropping components, and still not getting exactly the design I want, when I can simply prompt Claude Code to do exactly that in just 1 minute?

That’s when I decided to make the switch from hosted WordPress to managing my own website, deployed in Vercel (for free). The main point of this article is to show you how to do this and why you don’t really need any programming experience to do it.

Infographic: Make your own website
This infographic highlights the main contents of this article. I highly recommend moving from a drag-and-drop editor for your website to a self-coded website made using coding agents. This makes it way easier and faster to both create and update your website. Image by Gemini.

You can find my website, which I designed, in this article here.

Why code your own website

The main reason you should start coding your own website, instead of using a drag-and-drop editor like WordPress or Webflow, is:

  • It is super easy to do – You literally don’t have to touch any code
  • It’s way faster to create and update your website
  • The designs are much better, since the coding agents are good at making high-quality designs
Speaking Page
This image shows the Speaking page on my website. You can see the navbar at the top, and the specific contents of the page below. Image by the author.

Because it’s faster, you can also iterate on your website designs more quickly, which is super useful when you try to make the best website possible.

Quick iteration speed is the key to quick progress

Of course, there are some arguments the other way around, for example, that WordPress has a lot of integrations that can be useful. However, for me, the pros far outweigh the cons.

Being able to update my website by simply inputting one prompt, such as:

Make all the buttons on the website fade in on hover

This literally updates my entire website in around 1 minute (including Claude Code updating the code and deploying to Vercel). Doing this same action in WordPress would probably take me at least 30 minutes.

Now imagine you have to do this change several times a week. Whenever adding new content to your website, or when you realize you want to change something. Changing it directly in code with coding agents is simply far more efficient.

Claude to code your own website

Creating the website

Hopefully, you’re convinced why you should start coding your own website (or let Claude code it for you), instead of using a drag-and-drop editor. Now, let’s move into how you can do it.

The main secret here is that you don’t really have to do that much yourself, considering how good the coding agents are at creating websites. I created the website from my previous WordPress-hosted website.


I started off by prompting Claude Code with the following, where eivindkjosbakken.com was my WordPress site:

Given my website here: eivindkjosbakken.com, copy this website exactly, 
by using React. Create a GitHub repository and push the code there

Claude’s code then created a near-exact replica of my previous website, which I could now run locally. I checked the designs and made sure everything was okay, which it was for the most part, except for a few things, which I’ll cover in the next section.

Hosting the website

I then moved to hosting the website. I use Vercel since it offers free deployments of your website, and it’s simple to use and can be fully managed from the terminal. Having it managed from the terminal is super nice, so Claude can take care of the deployments and other issues with Vercel.

However, when first deploying, I had to create a project on vercel.com and connect my codebase to that project. You can ask any LLM on how to do this, and they will give you an accurate step-by-step guide to connecting your code to Vercel. Vercel also offers you 100 free deploys per day, which should be more than enough.

After connecting to Vercel, everything was good to go, and I could access my website through the web.

Updating the website

After copying my WordPress website, I also discovered some updates I wanted to make to my website. I, for example, wanted:

Article highlighting
This image highlights one of the design improvements I made to my website. Whenever you hover over an article on this page, you can see that the article card is highlighted. Image by the author.

These changes were quick to make, and I simply had to prompt Claude with a description of my change (i.e., make the articles card highlighted on the over), and it made the change in less than one minute. Making this change with a drag-and-drop editor would likely take a lot longer.

Now, only your imagination can stop you from updating your website, and you can, in reality, make any change and quickly iterate on designs by simply prompting your coding agent.

Challenges I had to resolve

Claude mostly one-shot the recreation of my old WordPress website into code, just from the URL of my website. However, there were some issues I had to resolve, as you can see listed below:

  • My WordPress had the option to send emails to me
  • I had to copy over some images from the old website, for example, for my articles (manual processes)
  • Some issues with the social links – both finding the correct ones, and making sure they’re high quality
  • WordPress has a mailing list, and I had to manage that somehow myself now
  • Moving over the domain from WordPress to NameCheap

For the emails, I used EmailJS to have the option of sending emails from my website. This service is free and simple to set up after asking for a step-by-step guide from your coding agent.

For the image copying, I simply downloaded the images locally, put them into the code repository, and told Claude’s code where it could find the images. Claude then copied the images into a specific image folder, so they could be hosted on the website.

With the social links, I simply had to prompt Claude a few times, with a screenshot of what the social links looked like (at one point, they looked very grainy, for example), and Claude would solve the issue with three to four prompts and feedback.

For the mailing list, I decided to move to MailerLite, which offers embedded forms you can use on your website to have people subscribe with their email. You can simply give the embedded form to your coding agent, which will embed it into your website.

Moving domains was the most time-consuming task. I had purchased my previous domain in WordPress, which made the process a bit trickier. However, I made Gemini 3 provide me a step-by-step tutorial, which worked well, and I transferred domains to NameCheap, where I have full control over the domain myself.

Conclusion

In this article, I have discussed how you can move your website from a drag-and-drop editor like WordPress or Webflow to your own managed website. This process is relatively simple using Coding agents and Vercel, which then provides you with a lot more control over your own website. Additionally, it allows you to iterate more quickly on your website and makes it simple to update your website.

I believe we are moving away from drag-and-drop editors altogether, when we see how well today’s coding agents work, and with the fact that you don’t really need coding experience anymore, to perform simple programming like updating the design of a website.

👉 My Free Resources

🚀 10x Your Engineering with LLMs (Free 3-Day Email Course)

📚 Get my free Vision Language Models ebook

💻 My webinar on Vision Language Models

👉 Find me on socials:

📩 Subscribe to my newsletter

🧑‍💻 Get in touch

🔗 LinkedIn

🐦 X / Twitter

✍️ Medium


Towards Data Science is a community publication. Submit your insights to reach our global audience and earn through the TDS Author Payment Program.

Write for TDS

Related Articles