Week 1 - Principles and Practices, Project Management

Assignments


Well... If this site is online, it means I have been able to successfully commit it :-)

For a short introduction to git I suggest you to read the official git tutorial. For a more complete tutorial you can refer to the documentation offered by Atlassian, the company behind BitBucket.

If you want to know how I managed to have this site online, proceed reading this page. Otherwise, discover more about my idea for the Fab Academy final project.

Building a Fab Academy personal site - Tutorial

  1. Download and install Brackets, an open source text editor for web designers.
  2. Create from scratch a Bootstrap-based web site or (better) modify an existing template. You can find a bunch of cool free templates here and here. However, I suggest you to stay with the Fab Academy html template by Massimo Menichinelli - it will perfectly suit all your needs (at least for now). Hence, download the latest release of the FabAcademy template and unzip it.
  3. Now open the unzipped template folder: you should see a lot of html files inside. Locate the index(.html) file and open it with Brackets.
  4. Modify the HTML and the content of your new personal home page. As you modify the code, you can live preview your edits with File > Live Preview, or clicking the lightning bolt icon - brackets will launch Chrome and open your page. Never used HTML before? I suggest you to:
    • have a look at Daniele's presentation;
    • learn by doing - start modifying the template and see what happens;
    • spend some time following an online tutorial here or here.
  5. Modify the other pages of the web site - you should edit (at least) about.html, contact.html, exercise01.html and project01.html
  6. Sign up at fablabs.io - or just sign in if you already have an account (if possible, register with the same email you used for applying to FabAcademy).
  7. Once you have registered at fablab.io, you can login to git.fabacademy.org using the same credentials.
  8. Now you can setup an ssh key pair following this tutorial. This step is crucial: to put it simple, these keys will be used by the online git repository to identify you and to give write access (they are used more o less as an alternative to the well-known username/password-based login).
    If you are on Linux or OS X, read the tutorial carefully to save you time and pain: first try to locate an existing SSH key pair (it will save time), then generate it (if needed) and, eventually, deploy the key on git.fabacademy.org following to the instructions. I suggest you to skip the "Working with non-default SSH key pair paths" unless you know what you are doing ;-)
    Instead, if you are (still) using Windows, you can follow my tutorial published below.
  9. Before moving the next steps, check that you have one SSH key in your gitlab profile
  10. Download and install git
  11. Open a terminal/console and clone the repository of your FabLab (opendot in my case) to a local repository
    git clone git@git.fabacademy.org:fabacademy2017/opendot.git
  12. A new repository named opendot should appear on you computer. Open this new opendot folder, move into students and then into the folder with your ID. If you don't know yet your student ID, open the Fab Academy students list, click on your name and check the URL - your ID is the number at the end of the address.
  13. Save this empty test page within you personal folder and rename it as index.html
  14. Now we are ready to commit this test page to git.fabacademy.org. Open a terminal and move into the opendot local repo with the cd command (in Linux / OS X) or just right click with your mouse within the open folder and choose "Git Bash here..." from the menu (in Windows).
    In the console type:
    git status
    to check the status of the local repo. You should see something like
    On branch master
    Your branch is up-to-date with 'origin/master'
    Untracked files:
      (use "git add ..." to include in what will be committed)
    
    	students/###/index.html
    so add the new file(s) with
    git add *
    commit the changes (remember to add a meaningful comment!)
    git commit -m "first commit"
    and push your changes to the remote repository
    git pull
    git push
  15. If everything went fine, you should see your dummy personal page online and accessible from the student list.
  16. Now you can copy within your personal folder (opendot/students/###) the real index.html and all the other files of your Fab Academy website template; finally, repeat the commands shown above to commit your new site and push it online.

Generating an SSH key pair on Windows 8/8.1/10 - Tutorial

  1. Install git for Windows - you can leave the default settings and just click "Next" all the time.
  2. Run the Git Bash app, which can be found in your Start menu. A blank terminal should open with a blinking cursor after the $ symbol.
  3. Run the command:
    ssh-keygen -t rsa
    It will ask for location and pass phrase. Accept the default location (usually C:\Documents and Settings\username\.ssh\ or C:\Users\username\.ssh) by pressing Enter.
  4. The program will generate your key pair and will output a few information like:
    Your identification has been saved in /c/Users/Emanuele/.ssh/id_rsa.
    Your public key has been saved in /c/Users/Emanuele/.ssh/id_rsa.pub.
    The key fingerprint is:
    SHA256:05L+LkcD7yma87VaxUIKkVnKnO/YsCCZGJ/y99sLNDo Emanuele@Lenovo-G580
    The key's randomart image is:
    +---[RSA 2048]----+
    |      .+.        |
    |     oo+         |
    ...
    Note down the path of the public key (in my case it was /c/Users/Emanuele/.ssh/id_rsa.pub)
  5. Type
    cat /c/Users/Emanuele/.ssh/id_rsa.pub > /dev/clipboard
    to copy your public key.
  6. Now you can open your online gitlab profile and add your new SSH key by pasting it (CTRL+V) in the text box and clicking "Add key".

NOTES - Useful commands