What you’ll be able to do

You’ve got hundreds of good images sat in Lightroom and no website worth sending a client to. Maybe you tried Squarespace once and hated fighting the templates. Maybe you paid for a portfolio site years ago and it still looks like it. This guide is the route I’d take now: Claude Code builds the actual site from a folder of your images, GitHub stores it, Cloudflare Pages puts it online for free, and none of it needs a developer or a monthly fee for hosting. It’s just files. A portfolio doesn’t need a database, it needs to load fast and look like your edit.

By the end of this you’ll have a portfolio at your own domain, loading fast on mobile data, with a handful of your best shots on the home page, separate galleries for weddings, portraits and events (or whatever your work actually is), an about page with a real photo of you, and a contact form that lands enquiries straight in your inbox. Colours will match what you saw in Lightroom. Adding new work later will take one sentence and a couple of minutes, not another round of faffing with a template.

Before you start

You’ll need a few accounts set up before any of this works. A paid Claude plan, because Claude Code (the terminal tool) needs that access. A GitHub account, which is free. A Cloudflare account, also free, for Cloudflare Pages. And a folder of images already exported for the web, not your full-size masters, somewhere around 2000 to 2500 pixels on the long edge, JPEG at about 80 quality or WebP if you’re comfortable with that format.

One more thing, and it matters more than the tech: permission. If clients are in your images, especially children, you need their sign-off before anything goes public. Sort that before you build, not after.

Get set up

Start with GitHub. Create a new repository, keep it simple, call it something like portfolio. This is where your site’s code and images will live, and where Claude Code will push its work.

Next, Cloudflare Pages. In your Cloudflare dashboard, connect it to that GitHub repository. Every time you push a change, Cloudflare rebuilds the site automatically, usually within a minute or two, and gives you a free address ending in pages.dev. Once you own a domain, you add it in the same dashboard and point it at the Pages project. No separate hosting bill, no separate DNS headache elsewhere.

For the contact form, set up a free Tally form. It’s quick: build the fields you want (name, email, message, maybe event date if you’re a wedding photographer), then grab the embed code. Google Forms works too if you already use it, but Tally looks less like a form dumped on a page.

Then open Claude Code in your terminal, point it at your project folder, and run your first prompt. This is where the site actually gets built.

Try it yourself

Here are three prompts, each doing a distinct job. Paste them as they are, swap in your own details.

The first builds the whole site:

Build a static portfolio site: home page with 6 featured images, gallery pages for weddings, portraits and events, an about page and a contact page with this Tally form embed: [paste]. Add a script that resizes every image in /originals to 2400px on the long edge as WebP into /images and makes 600px thumbnails. Lazy-load everything below the fold. Real text, no frameworks.

That last bit matters. “Real text, no frameworks” keeps things simple and fast, and means your headings and descriptions are actual text search engines can read, not images pretending to be text. Drop your web exports (the 2000 to 2500 pixel ones) into /originals, keep the full-size masters out of the repository altogether, and let the script do the final shrinking and the thumbnails.

The second prompt is for later, when you’ve shot a wedding and want it up quickly:

Add these 14 images to the weddings gallery in filename order and push.

Number your files before you do this, something like 001-ceremony.jpg, 002-ceremony.jpg, so the order comes out right without you having to think about it again.

The third prompt is a bit of housekeeping most people skip and shouldn’t:

Check every image has alt text and write it from the filename where missing; list the ones you could not describe.

Alt text is what search engines and screen readers actually get from your images. It’s easy to forget once you’re twenty galleries deep. Running this occasionally catches the gaps.

Check the result

Don’t just look at the site on your laptop over office wifi and call it done. That tells you nothing about how a client on their phone, on a train, with two bars of signal, will experience it.

So: open the site on your phone, on mobile data, wifi off. Click into one gallery and count how long it actually takes to load, properly count, don’t guess. If it’s dragging, that’s a sign, and we’ll get to what that sign means in a minute.

Then run Lighthouse. In Chrome, right-click anywhere on the page, choose Inspect, find the Lighthouse tab, run it. Look specifically at the image warnings, it’ll flag anything oversized or not properly compressed.

Check your colours too. Open a gallery image next to the same file in Lightroom. If you exported in sRGB, as you should have, they’ll match. If they don’t, that’s a clue as well.

Last thing: send yourself a test enquiry through the contact form. Actually fill it in, actually submit it, actually check it lands in your inbox. Five minutes now saves you finding out three months later that a bride’s enquiry vanished into nothing.

If it doesn’t work

Three things go wrong most often, and all three are fixable without touching code yourself.

Images looking washed out or slightly off compared to your edit: this is almost always a colour profile issue. You exported in something other than sRGB, probably Adobe RGB, and browsers don’t render that the way you’d expect. Go back to Lightroom, re-export as sRGB, drop the new files into /originals, and ask Claude Code to rebuild.

Page loading slowly, especially galleries: your images weren’t actually resized before they hit the live site, or the resize script didn’t run properly. Ask Claude Code to run the resize script again, and check the output files in /images are genuinely smaller, not just renamed.

Gallery images showing in the wrong order: tell Claude Code to sort by filename, and make sure your files are numbered, 001, 002, and so on. Alphabetical sorting on unnumbered filenames does strange things once you’re past nine images.

On privacy: don’t hand an AI tool anything you wouldn’t want stored or repeated. Keep client names, addresses, or any personal detail out of your repository entirely, filenames included. Strip location data from images before publishing, resizing for the web usually does this automatically by stripping EXIF data, but check one image afterwards to be sure. A full-size export can carry the GPS coordinates of a client’s home, which is not something you want sat in a public folder. And don’t paste anything into an AI chat that you wouldn’t be comfortable with a stranger reading, client contracts, invoices, personal messages, none of that belongs anywhere near this workflow.

Right-click blocking, incidentally, doesn’t protect your images. Anyone can screenshot a screen. A copyright line in your footer and sensible export sizes (2000 to 2500 pixels, not your full 6000-pixel master) are the honest version of protection here.

If this whole approach feels like more setup than you want, the hosted alternatives exist for a reason. Squarespace, Pixieset, Format, and Adobe Portfolio all skip this entirely for a subscription. They’re a fair choice if you’d rather pay monthly and not think about repositories or scripts. This guide is for the version where you want your own files, no monthly site fee, and speed that a template builder often can’t match.

Keep exploring

“How to get AI to build me a website as a designer” is the same chain (Claude Code, GitHub, Cloudflare Pages) starting from a Figma design rather than a folder of images, if you want the layout to be exactly yours. “How to get AI to edit a photo” covers what the assistants can and cannot do to an image before it goes on the site. And “How to get AI to build me a website” lays out the other routes, including the hosted builders, if this one turns out to be more than you want.

Sources and review notes

https://code.claude.com/docs/en/overview https://docs.github.com/en/get-started https://developers.cloudflare.com/pages/ https://tally.so/help https://developer.chrome.com/docs/lighthouse/overview

Review date: 2026-09-16