Method 1: How to host your sketch on GitHub via GitHub Desktop version

  1. Download and install GitHub Desktop https://desktop.github.com/
  2. Sign in to GitHub.com from the app.
  3. Configure git. You can use the GitHub account name and email or configure manually. The name and email are going to be displayed in the commits that you push to your code. (For this tutorial just use the GitHub name)
  4. Download your p5 sketch from p5 editor.
  5. In the GitHub Desktop app choose Add an Existing Repository from your Hard Drive, choose the path to the p5 sketch you have downloaded, you will see the warning that your directory does not appear to be a Git repository. Press Create a repository. Give it a name and description that is going to be displayed on your GitHub account.
  6. Once you create the repository, you should see the changes page. Currently it should show you "No local changes". Press Publish repository.
  7. Go to your GitHub account and in the Repositories tab you should see a newly created repository with your p5 sketch.
  8. Now go to your repository on GitHub and go to the settings tab and scroll down to the GitHub Pages section, click on it. Provide the source branch that the GitHub Pages will get the code from, in our case it is main. Save.
  9. Wait and see the result! You should see the pop-up in the Settings tab that your website is ready with the url <your_username>.github.io/<your_repo_name>

Method 2: How to host your sketch on GitHub via terminal

  1. Install git in your terminal

    For Mac open your terminal and do:

    brew install git

    For Windows (video: https://www.youtube.com/watch?v=nbFwejIsHlY&ab_channel=TheGrokShop):

    1. Download git: https://git-scm.com/downloads
    2. Install with "Use Fit and optional Unix tools from the Command Prompt" option
    3. Open git bash on your computer and check your git: git status
  2. Link your GitHub account to git

    1. Set up git username — this is the name displayed in every commit associated to you: git config --global [user.name](<http://user.name/>) "John Doe"
    2. Confirm the configuration: git config [user.name](<http://user.name/>)
    3. Go to your GitHub account and go to settings.
    4. Go to emails and check your primary email. You are going to use it to link it to your local git.
    5. Go to your terminal and link the email via git config user.email ["[email protected]](mailto:%[email protected])"
    6. Check whether it is set up correctly via git config user.email
    7. Generate the SSH key on your computer and add it to your GitHub account:
      1. Open the terminal and do ssh-keygen -t ed25519 -C ["[email protected]](mailto:%[email protected])"
      2. When you're prompted to "Enter a file in which to save the key," press Enter. This accepts the default file location.
      3. At the prompt, type a secure passphrase. — it should be an easy to remember word
      4. Add a new SSH key to your GitHub account
  3. Download your p5 sketch.

  4. cd to your p5 sketch. cd Downloads/<your_project_folder>

  5. Initialize the git inside your project. git init

  6. Go to GitHub and create a repository.

  7. Git add remote origin to your local directory. In your repository on Github copy the https link in Code → Clone → HTTPS and then run the following command in the terminal: git remote add origin[<https://github.com/><your_username>/<your_github_repo>.git](<https://github.com/bradtraversy/vue-crash-2021.git>)

  8. Git add, commit and then pushhhh:

    1. git add .
    2. git commit -m "Push the code for the GitHub pages"
    3. git push origin master