Zuitt Guide: How to Deploy the Free Coding Bootcamp Portfolio


What will be discussed:

  • File navigation using the CLI (Command Line Interface)
  • Steps on how to push (upload) your project in Github
  • How to check if deployment was successful

What will not be discussed:

  • The purpose of each git command
  • How to change authentication credentials
  • How to resolve deployment errors

Helpful Links to improve your FCB Portfolio:


File navigation using the CLI (Command Line Interface)

Open Git Bash (Windows) / Terminal (Linux / Mac)

Go inside the Documents folder using the cd Documents command

Inside the Documents folder, run the ls command to check if your project folder is inside
your current working directory.

Go inside your project folder. The name of my project folder is fcbportfolio. I will go inside
the folder by executing the command, cd fcbportfolio. Check your project folder name and
execute the same command but change the fcbportfolio to your project’s folder name.


Steps on how to push (upload) your project in Github

Inside the fcbportfolio folder, run the git init command. This will initialize Git to our project
folder.

Next, run the git status command. It will return all the files and folders with untracked
changes

Next, let’s tell git to track these changes by executing the command git add -A. Running the
git status command again will show that the files and folders are now in green. This
means that git recognizes the changes in the said files/folders. If there are still files in red,
execute the git add -A command again.

Running the git commit -m “v1.0 fcb portfolio” command to finalize the changes and
creates a new version of your project. Running the git status command again will show
that Git was able to track all the changes inside the current folder.

Do not close your Terminal. Go to Github(https://www.github.com) and Login using your registered email.

Once logged in, click on the New Repository button or the Start a Project button

Name your project/repository as fcbportfolio. Leave the Permission to Public and click on
Create Repository.

Copy the HTTPS URL of your new project

Go back to the Terminal and run the command git remote add github <paste the HTTPS URL from your Github repository>

Upload the changes by executing the git push github master command


As of Aug 13, 2021, Github changed its authentication when using git.

To be able to supplement this, we have to create a personal access token to use instead of
a password:


Go back to your Github profile and go to your settings:

Then, in your settings, in the left pane, scroll down and select developer settings:

Then, in the developer settings, on the left pane, select Personal Access Tokens

Then, generate a new personal access token

Then, add the note and expiration date for your personal access token:

Add the following scopes for your personal access token:

Then, generate your token:

Once generated, you may now use your personal access token instead of your password when pushing updates into github:


How to check if deployment was successful

Go back to your fcbportfolio repository in Github and refresh the page. You should see the newly uploaded files and folders.

Go to your project’s Settings -> Pages

Click on Source and change it from None to the master branch

Click on Save. The URL of your live website will appear below the Github Pages header. Enjoy!


This is the Zuitt Guide on How to Deploy the Free Coding Bootcamp Portfolio. This blog post is intended for Zuitt’s FCB: Basic Web Development Workshop participants only.

If you’ve stumbled upon this blog post and aren’t a bootcamper, you can begin your bootcamp journey with Zuitt by clicking this link:

Leave a Reply

Your email address will not be published. Required fields are marked *