Publish and maintain a personal website using Muse from Meta and GitHub Pages for free

There's a lot of Artificial Intelligence (AI) talk, but not many examples.

I was vacationing and didn't bring a laptop, however, using this setup, I was able to update my website more in 4 days than the last 4 years using only my phone!

Here's how it works.

How the pieces fit together: Muse talks to GitHub, GitHub Actions publishes, GitHub Pages serves your site.

Software and accounts

Connecting them together

Go to the Settings → Connectors section of the Muse app and follow the instructions.

Opinion me: as long as you don't connect things that spend real money, it's safe. Don't panic, READ BEFORE APPROVING, and be smart.

Setup GitHub Pages plumbing

These are the few things you do yourself in a browser, since Muse can't click through GitHub's setup screens for you (yet). The official docs spell out every click — here's the shape of it:

  1. Create a free GitHub account at github.com/signup.
  2. Create a public repository named <your-username>.github.io — that magic name is what makes it your personal site. (GitHub Pages quickstart)
  3. Publish with GitHub Actions: in the repo's Settings → Pages, set the publishing source to GitHub Actions and add the Static HTML starter workflow. (official steps)
  4. Visit your live site at https://<your-username>.github.io once the first Actions run finishes with a green checkmark.

First Step: index.html

As a simple first step, let's test the setup. We'll have Muse create the standard index.html landing page by writing a prompt for Muse:

Prompt for Muse

Write an index.html for my personal GitHub pages website that says my name. The repository is located at [paste a link to your GitHub repository]. Clone the repo, make changes, commit and push. After pushing, check that the GitHub Action publishes the changes and that the site, [your GitHub Pages site URL], reflects the new changes.

Since this is the first time Muse is writing code and making changes on GitHub, you'll have to approve its tool use. If you're uncomfortable doing “Always allow”, feel free to confirm allow one at a time.

After the AI gets working, and the whole machinery executes, it shouldn't take more than 15min to be able to visit your new site. If anything goes wrong, ask the AI what went wrong and collaborate with you to fix it.

Once you see your index.html working, we'll repeat prompting the AI and ask for more and more complicated designs.

Be curious, be creative

After publishing a simple index.html, the rest is up to you!

While I have been programming computers since I was 10, I've always been weakest in design and frontend development (like making webpages look nice). When I don't know a term or design, I give the AI a few examples and descriptions and ask it “if there is a concise professional term” for the idea. Then use the term in my next prompts. Rinse and repeat!

Here is a sampling of ideas and prompts I ended up incorporating in various parts of my site.

Idea
Evolve the single index.html into a full Eleventy site with shared layouts and data files.
Prompt
“Turn my one-page index.html into an Eleventy-powered site: a shared base layout, Nunjucks templates, a global data file for the site name and URL, and build output into docs/ for GitHub Pages — the same setup as this repo.”
Result
This website
Idea
Reimagine my homepage and resume in 8 completely different design styles as a portfolio showcase.
Prompt
“Design 8 full redesign variants of my Home and Resume pages, each with its own distinct aesthetic — serif letterpress, art deco noir, mid-century modern, brutalist, Swiss grid, minimalist, experimental chaos, and a dark dev-tool tech style — and give me a hub page to browse them all.”
Result
VibeRedesign gallery
Idea
An explorable family tree page, with relatives shown by kinship title only (never real names).
Prompt
“Build me an interactive family tree page using D3.js. Show relatives by Chinese kinship titles with short English labels, highlight the focused person's card, collapse distant branches behind +N badges, and keep it pan/zoom-able in both light and dark themes.”
Result
FamilyTreeMe
Idea
A dark, dev-tool-inspired redesign variant of my site.
Prompt
“Make one redesign variant in a dark dev-tool aesthetic — monospace type, cyan accents, a self-typing terminal in the hero — and keep the hero status line neutral like ‘systems operational’.”
Result
Tech Modern variant

Want more? I've collected more idea → prompt → result examples from building this site.

Browse more ideas & prompts →