Uploading your project on Github

Introduction

In order to turn your local HTML/CSS project into a “live” website, you need to upload it to a server. We will use Github pages (a free option that also allows us to familiarize ourselves with a very popular platform: Github).

What is Github?

GitHub is a code hosting platform for version control and collaboration. It lets you and others work together on projects from anywhere. Learn more about the Github platform and how to use it to share and edit files here.

You can use GitHub Pages to host a website about yourself, your organization, or your project directly from a GitHub repository. You can read more about Github Pages here.

Steps to upload your project

  1. Make sure all your files for the project are correctly organized and named: The home page should be index.html, and none of your file names should include spaces. The project should include at least five .html files, one .css file, and images ( .jpg, .jpeg, .png, .gif, or .svg )
  2. Go to github. com and create a free account (or login if you already have one).
  3. Click the Start a project button
  4. On the Create a new repository page:
    1. Name your repository in the Repository name box (i.e: adventure)
    2. In the Initialize this repository with section, check the Add a README file box.
    3. Click the Create repository button
    4. Your newly created repository is displayed on the next page
  5. Upload your files:
    1. Click the Add file button at the top and select Upload files
    2. Drag and drop all the files comprising your project
    3. Make sure Commit directly to the main branch is checked
    4. Click the Commit changes button
  6. Turn your repository into a website:
    1. Go to Settings
    2. Select Pages in the left hand side menu
    3. Click button under the Source section, select main
    4. Click the Save button
  7. Your files are now on the web, ready to be viewed. To access them, enter the correct URL: yourUserName.github.io/repositoryName/index.html