Here are the steps to get our github portfolio going

Note

You will need:

• Github account
• VSCode

Install VS Code Extensions

• Live Server
• Prettier - Code formatter
• HTML CSS Support

Download the Template

1. Go to the Github @ https://github.com/AveryUALibrary/PersonalPortfolioTemplate

2. Click Use this template, then click Create a new repository

3. Name it whatever you wish, then click Create repository from template

4. In VSCode, press Ctrl+Shift+G

5. Click Clone Repository, then click Clone from GitHub

   • If asked The extension 'GitHub' wants to sign in using GitHub, the click Allow

6. Sign into you GitHub and click Open Visual Studio Code - URL Handler

   • If asked Allow an extension to open this URI?, click Open

7. Now click on your personal portfolio repository and pick a folder to download the repository to

8. When asked Would you like to open the cloned repository?, click Open

   • If asked Do you trust the authors of the files in this folder?, just click Yes, I trust the authors

Now your repository should be downloaded

Uploading Repository to Github

When you are done adding changes to the repository, we can upload the changes to github

1. In VSCode, press Ctrl+Shift+G

2. To the right of Changes press the + sign to Stage All Changes

3. Add a message at the top i.e. Uploading files to github

   • Supposed to write a message of what you are doing every time you upload a change, to keep note of what each upload does

4. Press the Blue Down Arrow and click Commit & Push

   • If you get an error, press cancel and follow the steps below to fix the problem

Hosting the Website on GitHub

1. Open your repository on GitHub

2. Click Settings, then click Pages

3. Under Branch, Change None to main, then click Save

   • Takes about 1-2 minutes to complete

4. Now click < > Code and click on github-pages on the right

5. Click View deployment and now you have your website online

   • Save the URL and share it whenever you wish

Fixing the Make Sure you configure your "user.name" and "user.email" in git. error

1. In VSCode, press *Ctrl+Shift+`

   • A terminal should open up at the the bottom

2. Type git config user.name "FIRST_NAME LAST_NAME"

   • Replace FIRST_NAME with your first name and LAST_NAME with your last name

3. Type git config user.email "[email protected]"

   • Replace [email protected] with the email you used for your github account

View the html

Right click on index.html and click Open with Live Server

Begin Coding