Modern Web Workshop Guide

2. Clone back end

2.1. Start new Glitch project

Glitch is a service that provides a free web server for learning and experimentation. We can use Glitch to write code, or import existing code from a git repository.

Let’s “clone” our back end repository on GitHub to a new Glitch project.

1. Click the New Project button near the top right
2. Then click the Hello-Webpage option to create a new project

2.2. Open Glitch’s command line

Let’s use Glitch’s command line feature (or “console”) to fully clone our back end code from GitHub.

1. Click the Tools button in bottom left corner
2. Click Logs button in Tools menu
3. Click Console button in Logs interface

2.3. Manually clone the back end repository

Copy and paste each of the following comands into the Glitch console to replace the default Glitch project files with our back end files.

*Pro tip: triple-click each line of code to easiliy highlight it for copying!

1. Move up one directory to the home directory
   
   cd /
   
   
2. Remove all visible files in the app directory
   
   rm -rf /app/*
   
   
3. Remove all hidden files in the app directory
   
   rm -rf /app/.*
   
   
4. Clone your back end repository (replace USERNAME with your GitHub username)
   
   git clone https://github.com/USERNAME/modern-web-back-end.git app
   
   
5. Move into the app directory
   
   cd app
   
   
6. Refresh the glitch web editor to see the new files
   
   refresh
   
   

2.4. Checkout branch 1

Our back end project is currently in its finished state. Let’s “checkout” an earlier state to start from the beginning.

Copy and paste the following commands in the Glitch console:

1. Checkout branch 1
   
   git checkout 1
   
   
2. Refresh the Glitch file system to see branch 1
   
   refresh