Create My Portfolio

Step-by-Step Guide

Follow these steps to create your portfolio and publish it as your own website with GitHub Pages.

Detailed guide with screenshots

A picture for every step. Useful if this is your first time using GitHub. Also available as a Word document (.docx).

Open PDF guide

1. Create your portfolio

  1. 1

    Open the editor

    On the home page, select Create My Portfolio.

  2. 2

    Choose a design

    At the top, pick Professional, Editorial or Dark. You can switch at any time; your content stays the same.

  3. 3

    Add your content

    Click ✎ Edit next to any part of the page to change it, and + Add to add links, projects, experience, education, skills, certifications or your own sections.

    • Upload a profile photo, then drag it or use the sliders to position it.
    • If your name is long, the name size is set automatically. You can also choose L, M or S.
    • Under your title you can add extra lines, such as a minor, a second degree or a Ph.D. plan.
  4. 4

    Preview

    Select Preview to see exactly what visitors will see. Switch between Desktop and Mobile.

Saved in this browser only. Your work saves automatically, but only on this computer and browser. To continue on another computer, use Draft → Download backup, then Draft → Restore backup there.

2. Export your portfolio

  1. 5

    Export Portfolio

    Select Export Portfolio. In Chrome or Edge a Save window opens with the name index.html: choose a folder you can find (for example Desktop) and select Save. If your computer asks to replace an existing file, choose Yes / Replace. In other browsers the file goes to your Downloads folder.

⚠ File name check

Your file must be named exactly:

✓ index.html✗ index (1).html✗ index(2).html✗ Index.html

If your computer added a number, rename the file to index.html before uploading. Windows may hide ".html": if you only see "index (1)", rename it to "index".

  1. 6

    Check the file

    Double-click index.html. Your portfolio opens in your browser. This is the file you will publish.

3. Create a GitHub repository

  1. 7

    Sign in to GitHub

    Go to github.com and sign in, or create a free account.

  2. 8

    Create a new repository

    Click + (top right) → New repository. Name it, for example, my-portfolio. Choose Public, leave Add README off, and select Create repository.

4. Upload and publish

  1. 9

    Upload index.html

    Select uploading an existing file (or Add file → Upload files) and drag in your index.html. Check that the name in the list is exactly index.html, then select Commit changes.

  2. 10

    Turn on GitHub Pages

    Open Settings → Pages. Under Build and deployment, choose Deploy from a branch, branch main, folder / (root), then Save.

  3. 11

    Wait for your site

    Publishing usually takes 1 to 10 minutes. The Actions tab shows a green ✓ when it is done. Refresh Settings → Pages to see "Your site is live at" and your address, for example https://your-username.github.io/my-portfolio/.

5. Share your link

  1. 12

    Test and submit

    Open your link in a new tab (or a private window) to check it. Then submit the GitHub Pages address to your instructor. Do not submit a file:/// address or the repository page.

Your site is public. Anyone with the link can see it. Do not include your home address, phone number, student ID or other private information.

Seeing a "404 File not found" page?

Your portfolio is fine. Check these in order:

  1. File name. In your repository it must be exactly index.html. If it says index (1).html: click the file → ✏️ Edit → change the name → Commit changes.
  2. Address. Use the link shown at the top of Settings → Pages. It ends with your repository name.
  3. Pages is on. Settings → Pages → Deploy from a branch → main → / (root) → Save.
  4. Wait a few minutes. When the Actions tab shows a green ✓, refresh your page.
  5. Public repository. Free accounts can only publish public repositories.
  6. File, not folder. index.html must be on the main page of the repository, not inside another folder.

Updating your portfolio later

Make your changes in Portfolio Creator (or restore your backup with Draft → Restore backup), export a new index.html, and upload it to the same repository so it replaces the old one. Keep the name exactly index.html. If you still see the old version, wait a few minutes and press Ctrl + Shift + R.