From Squarespace to Claude Code: How I Rebuilt My Portfolio and Saved $528 a Year

For years, I paid $44 a month for Squarespace. That's $528 a year for a website that looked like thousands of others, loaded more slowly than I wanted, and was impossible to truly customise.

As a designer, I knew exactly what I wanted my portfolio to look like. The problem? I'm not a developer. I can read code. I understand how things work in principle. But sitting down and building a Next.js application from scratch? It wasn't something I'd done before.

Then I started using Claude Code.

What is Claude Code?

Claude Code is Anthropic's AI-powered coding tool that runs directly in your terminal. Think of it as a senior developer sitting next to you: reading your entire codebase, writing code, fixing bugs, and explaining decisions as it goes. Unlike a chatbot where you copy and paste snippets back and forth, Claude Code works directly on your files in real time.

If you are new to AI in design workflows more broadly, my review of the 7 best AI design tools in 2026 covers the wider landscape designers are reaching for.

Why I switched from Squarespace to Claude Code

• $44/month is too much for a portfolio site I couldn't fully customise.
• Squarespace templates all look the same. I wanted something that actually reflected my work.
• I wanted a blog powered by Notion, where I already write everything.
• I wanted full control over my design: my own dark theme, typography, and booking flow.

Squarespace vs Claude Code at a glance

Here is what the switch actually changes, side by side.

The honest trade-off: Squarespace gives you a visual editor and hand-holding. Claude Code gives you ownership and speed. For anyone who wants something that does not look like every other Squarespace site, that trade-off is worth making.

The real cost breakdown

This is what I was actually paying for on Squarespace, and what I pay now.

Squarespace Business plan, per year

Claude-built site on Vercel, per year

Even with Claude Pro for the full year, I come out $293 ahead. Without it, $533 ahead. And Claude Pro is useful for much more than one website, so it is hard to count it as a Squarespace-specific cost.

Who this is for (and who it isn't)

Claude Code replacing Squarespace is a strong fit if you are:

• A designer, freelancer, or founder who wants a portfolio or marketing site
• Comfortable in a terminal for a few hours (no prior coding required)
• Annoyed by template limitations and platform lock-in
• Willing to spend an afternoon or two upfront to save hundreds a year

It is probably not the right fit if you are:

• Running a large Squarespace Commerce store with dozens of SKUs and Stripe already wired up (migration is possible but more work)
• Unwilling to touch a terminal at all (Webflow or Framer might suit you better)
• Publishing multiple times a day with multiple non-technical authors who need a full WYSIWYG workflow

If you are in the first group, keep reading. If you are in the second, there is a short comparison further down that might help you pick the right tool.

Can Claude really build a Squarespace replacement?

Short answer: yes. I gave Claude Code a brief: build me a portfolio site. Dark theme. Clean. Fast. Here's what I need on it. Within a single session, I had a working Next.js 14 application with TypeScript, my own design system using CSS variables, a homepage with a typing animation hero, portfolio case study pages, and a contact form.

What surprised me was how collaborative it felt. I could describe what I wanted in plain English, push back on suggestions I didn't like, and ask why something was built a certain way. It never felt like I was fighting the tool. It felt like working with someone who actually listened.

Step-by-step: rebuild your Squarespace site with Claude Code

This is the actual path I took, in the order I took it. Start to finish was about two afternoons.

1. Install Claude Code

Claude Code runs in your terminal. Install it with one command:

npm install -g @anthropic-ai/claude-code

Then authenticate with your Claude account. You need either a Claude Pro or Claude Max subscription.

2. Create an empty project folder

Make a new folder for your site and open it in your terminal.

mkdir my-portfolio && cd my-portfolio
claude

That opens a Claude Code session inside your project.

3. Describe the site you want

This is where the magic happens. You do not write code. You write a brief. Mine was something like:

Build me a portfolio site. Next.js 14 with the app router and TypeScript. Dark theme with a pink accent colour. Homepage with a typing animation hero. Case study pages for three of my projects. A blog that pulls posts from Notion. A Book a Free Consultation button that opens a Setmore calendar in an overlay.

Claude Code asks clarifying questions, scaffolds the project, installs dependencies, and starts building. You see every file it creates.

4. Iterate section by section

Rather than building everything at once, I worked through the site one section at a time. Hero first. Case studies next. Blog. Contact. Every new section got its own short prompt and a round of feedback. This keeps the AI focused and makes it easy to reverse course if a direction is not working.

5. Hook up Notion as your CMS

Ask Claude Code to wire up Notion. Give it the Notion database URL you want to use as your blog source. It will install the Notion SDK, set up API routes, cache responses, and slugify post titles. The workflow after that is: write in Notion, flip Status to Published, wait a minute for the cache to refresh, and your post is live.

6. Deploy to Vercel

git init
git add .
git commit -m "Initial commit"

Then ask Claude Code to set up Vercel. It can run the Vercel CLI, link the project, push environment variables, and configure automatic deployments. Every push to main goes live within two minutes.

7. Move your domain

In the Vercel dashboard, add your domain. Vercel will show you two DNS records (an A record and a CNAME for www). Copy those into Squarespace Domains. Then, and this is the step most guides miss, set your Squarespace site to Private. Squarespace intercepts traffic on your primary domain even after you change DNS, and private mode is the only way to release that grip without unlinking the domain. Within fifteen minutes the new site should be live on your domain. Worst case, an hour.

8. Add tracking and polish

Google Analytics, Vercel Analytics, Speed Insights, Open Graph images, a sitemap, robots.txt, and security headers are all a single prompt each. Claude Code also adds schema.org markup, which helps Google understand your pages and can earn you rich snippets.

That is the whole path. A portfolio rebuild done in a couple of afternoons, saved forever, and yours to modify any time.

Connecting Notion as a CMS

The feature I was most excited about was using Notion as my blog CMS. The idea of publishing a post just by changing a status from Draft to Published inside Notion, where I already write everything, was exactly the workflow I wanted.

Claude Code set-up a Notion database with the right properties (Title, Status, Date, Author, Tags, SEO Keywords), installed and configured the Notion client library, built API routes with server-side caching, and auto-generated URL slugs from post titles. No extra configuration required. I just write and publish.

The booking integration

This was probably the most interesting build. I use Setmore for client bookings and wanted a Book a Free Consultation button on every page that opens an overlay, with no redirecting users away from my site.

The first approach failed. Claude Code diagnosed the issue, scrapped the broken implementation, and rebuilt it from scratch as a two-step custom modal. Users first pick a service (App Design, Product Design, Web Design, or Branding), then see the Setmore calendar to choose a slot. Mobile-friendly, with a bottom sheet on small screens and proper iOS safe-area handling.

Deploying to Vercel

GitHub plus Vercel is the best free hosting stack for a Next.js site. Claude Code initialised the Git repo, pushed it to GitHub, set-up the Vercel project, added environment variables via CLI, and configured automatic deployments. Every push to main goes live within two minutes.

I also added Google Analytics, Vercel Speed Insights, Vercel Analytics, and security headers, all in a single session.

Migrating your domain from Squarespace to Vercel

This was the trickiest part of the whole Squarespace to Claude Code migration. My domain (sanjaytarani.com) was registered through Squarespace and connected to my old site. Even after adding the correct DNS records pointing to Vercel, the old site kept showing.

The issue was that Squarespace was set as the primary domain host and was intercepting all traffic before DNS could kick in. I couldn't disconnect it through the normal settings, either. Squarespace blocks you from disconnecting your primary domain.

The fix was to set the Squarespace site to Private. That stopped Squarespace serving anything on that domain, and within minutes the Vercel DNS records took effect. Total visible downtime was around ten minutes.

Adding a Subscriber List (Without Paying for It)

One thing I knew I'd need on the new site was a way to collect email subscribers. On Squarespace, this was baked in — but of course, that convenience was part of the $44/month I was trying to escape.

I looked at a couple of options. Resend caught my eye first since it's developer-friendly and fits the whole "build it yourself" ethos. But when I compared pricing, Kit (formerly ConvertKit) won out for one simple reason: it has a genuinely usable free tier. For someone rebuilding a portfolio site to save money, paying for yet another SaaS to handle a sign-up form felt like defeating the purpose.

Setting it up was surprisingly painless. I created a Kit account, built a form through their dashboard, and grabbed the embed code. That was really it on Kit's side — no complex integrations, no webhook plumbing, no API keys to wrangle.

Then came the fun part. I dropped the form details into my Claude Code session and asked it to wire everything up on the site. A couple of prompts later, the subscribe form was sitting on the page, styled to match the rest of the design. I asked Claude to test it, and it just worked — submission went through, subscriber showed up in my Kit dashboard, confirmation email landed in my inbox. No debugging, no Stack Overflow rabbit holes, no "why is CORS blocking me" meltdowns.

It's one of those moments that really drives home why I made the switch. What would've taken me an evening of reading docs and troubleshooting took about five minutes of conversation with Claude. And the subscribe form I ended up with? It looks exactly how I want it to, not how a template decided it should.

The real prompts I used

The quality of Claude Code's output is a mirror of the prompts you give it. Here are five that did the heavy lifting on my site.

On the overall build

Scaffold a Next.js 14 app router project with TypeScript. Use CSS variables for theming with a dark theme as default. Mobile-first. No UI library, I want to control the design system. Add sensible ESLint and Prettier config.

On the hero typing animation

Build a hero section where the word after "I design" cycles through "apps", "products", "brands", and "experiences" with a typewriter animation. Blinking cursor. Accessible reduced-motion fallback. No external dependencies.

On the Notion CMS

Set up Notion as a headless CMS for a blog. Use the official Notion client. Fetch posts by filtering Status = Published. Pull title, date, tags, SEO description, and cover image. Cache responses for five minutes. Auto-generate URL slugs from titles. Proxy Notion image URLs through an API route because the S3 signed URLs expire after an hour.

On the booking modal

Build a two-step booking overlay. Step one: four service cards the user picks from. Step two: embed a Setmore calendar for that service. Mobile shows a bottom sheet with proper iOS safe-area padding. Desktop shows a centred modal. Keyboard accessible, traps focus, closes on Escape.

On SEO

Add Article, FAQ, and Breadcrumb JSON-LD schema to every blog post. Generate Open Graph images for each post at build time using Vercel's OG image library. Set canonical URLs, proper meta descriptions, and keywords from post tags.

Notice how specific they are. I did not ask for "a good hero". I asked for a typing animation with specific accessibility behaviour. That specificity is what makes Claude Code feel like a collaborator instead of a gamble.

Claude Code vs Webflow, Framer, and WordPress

Claude Code is not the only Squarespace alternative. Here is how it stacks up against the three people ask about most.

Claude Code vs Webflow

Webflow is a visual builder with a design-tool feel. It is the right choice if you want a polished no-code experience and you are willing to pay the monthly fee (roughly $18 to $39 for personal sites). You get templates, CMS, and hosting in one package. The lock-in is real: exporting Webflow to plain HTML/CSS drops the CMS. Claude Code gives you more ownership, less hand-holding, and zero monthly fees.

Claude Code vs Framer

Framer is the closest thing to a designer-native website builder. If you come from Figma, it feels familiar. The free tier is generous for personal sites, paid plans start at around $15/month. But like Webflow, you are renting. Claude Code is a one-time build that you own forever.

Claude Code vs WordPress

WordPress still runs roughly 40% of the web. If you need a massive plugin ecosystem or a content team used to the WordPress editor, it is a safe choice. But managed WordPress hosting runs $20 to $40 a month, you are responsible for updates and security, and performance depends heavily on your theme. Claude Code with a Next.js and Vercel stack is lighter, faster, and cheaper to run.

The short version: Webflow and Framer are the right answer if you will never, ever want to touch code. WordPress is the right answer if you need an enormous plugin catalogue. For almost everyone else, including every designer or founder I have spoken to about this, Claude Code wins.

What Claude Code can't do yet

I want to be honest about the limitations, because the "just use AI" pitch is too often dishonest.

• Claude Code is not a visual editor. If you want to drag a button three pixels to the right with a cursor, you cannot. You tell Claude in plain English and it moves the button. Fine for most, a deal breaker for some.
• Complex ecommerce still takes work. If you are migrating a Squarespace Commerce store with dozens of products, variants, and Stripe integrations, Claude Code can build it, but you will spend more than an afternoon.
• You need a terminal. Claude Code is a command-line tool. It is not scary, but if the terminal genuinely intimidates you, that is friction.
• Quality depends on the prompts. Vague prompts give vague output. The prompts I shared above took me a few rounds to refine. Expect a small learning curve.
• Design taste is still on you. Claude Code builds whatever you ask. Without opinions about type, spacing, and colour, the output will look generic. This is why a designer makes the best Claude Code user.

None of these were dealbreakers for me, but they might be for you. Worth knowing upfront.

What designers should know about using Claude instead of Squarespace

If you're wondering whether Claude can replace Squarespace for your portfolio, the answer is yes. You don't need to be a developer to build a custom site in 2026. Claude Code bridges that gap better than anything I've used. I could describe what I wanted in plain language, question decisions I wasn't sure about, and get clear explanations throughout.

The result is a site that's 100% mine. Faster than my old Squarespace site. Free to host on Vercel. Connected to Notion. With a booking flow built exactly the way I wanted it.

And I'm saving $528 a year.

If you're considering making the switch from Squarespace to a Claude Code-built site, feel free to book a free consultation and I'll walk you through how I did it.

---

About the Author

Sanjay Tarani is the Head of Design at DoxAI, helping entrepreneurs and business owners build scalable, user-focused digital products. Sanjay has led design system initiatives behind 50+ successful projects and has been recognised with the Website Wizard award. Sanjay brings experience from high-growth startup environments, including learning within the Startmate ecosystem, and shares practical insights on design, product strategy, and building profitable apps. Connect with Sanjay on LinkedIn.