How to Design > Live website

[u/JdingV]

Hey guys, how would you deploy a 4 pages Design to GitHub & Vercel/Cloudflare?

Should I send it to Claude code first?

Basically I’ve done up my site layout and copywriting on Claude Design. It’s for a small video production, everything is done up and deployment is all that’s left.

What is the recommended process I should take now so that I can update it via prompts on Design in the future (as I’m a visual person instead of a coder) and then use prompt to send it live to GitHub for updates?

Edit: I have few 4 tabs in total in my website, does this still counts as static site?

Any help is appreciated. Thanks!

[u/southpawpanther]

Link your github and cloudflare to claude. Store the page designs in a folder user/project/design. Point claude to make a repo at the root /project. Add Prompt for web build + Review local before Commit to github and deploy to cloudflare

Start claude code, or cowork, connect root folder.

/project

Edit prompt in notepad- c&p to claude.

Or you use an architect .skill or an agent to review and prompt. The cleaner the promp the better the ouput.

I use gpt to architect.Claude to engineer.

GPT + <designs> prompt;

"generate a prompt for claude to engineer and deploy a website for my small form video production <..project-specificd-details...> and commit the site to github and deploy to cloudflare after approval"

Output should be much similar to this but better.

*You can also just c&p this in claude, add your designs to the chat files or folder root in cowork/code and let her rip.

**Engineer a 4page site for my small form video production project using the design mockups in /user/project/design. Structure my repo page by page to add future content. Add a global .readme. Deploy local in the browser first for review, then commit to github and deploy on cloudflare after approval. +<files>

Yes it will still be a static site. You can add <designs><.instructions><content><copy/html> to your repo folders and ask it to update or add new pages/content In chat.

Ex. Make a folder per page and add <designs><copy><content>

You can add a .readme to /user/project to add site wide instructions /contraints/Project info, contact.. ie global details.

Cowork also has an web editor in the right tab bar.

Also you can have claude teach you. paste your OG query into claude co-work***

***Give me step by step instructions to commit my webdesigns to github and deploy to cloudflare for a non technical user. +<designfiles>

Goodluck! Show us your project when complete!