Week 01:
Build a website; upload to GitHub

Objectives

• Explore and use website development tools
• Identify version control protocols (i.e., git commands)
• Formulate a final project proposal

Software

• HTML editors: Bracket, Atom
• Terminal
• GitLab

Practices

 First, build it.

In order to understand HTML better, I started this week with building a site by hand. This meant establishing a file structure to organize my HTML files as well as my image (also called media) files, downloading an open-source HTML editor with live preview capabilities (I'm trying Brackets and Atom), and looking at w3 schools a lot! A note for other newbies: Firefox has an easier-to-read code inspector window than Chrome. Also, Brackets is a smarter editor than Atom, auto-filling out code tags for you and previewing images in cute and helpful thumbnails; Atom is more swish, more handsome, and has better style for tabbing your code into nice arrow-forms; however, I prefer Brackets' better functionality to Atom's better color and style.

After establishing some familiarity with the basics, I started working with Massimo Menichinelli's great Fab Academy template to make this site.

 Then, upload it. Git theory.

Git is a distributed version control system, which is useful for managing multiple versions of a file / set of files, and managing multiple users -- perfect for the situation of having a changing repository for the globally distributed for Fab Academy. Distributed version control takes the complexity of multiple users and turns it into a virtue: Git takes "snapshots" of a file structure and stores those snapshots, or versions, locally on the different computers of all the users. This means, in essence, a lot of backups of the same work. Here is an image of how it looks diagrammed, taken from Git's main documentation of itself.

Three levels: blobs, trees, and commits.

The file is called a "blob." A bunch of files are organized in a "tree." The tree is referred to in a "commit object," that is like the snapshot that pulls up the metadata that can reconstruct the files at the moment you entered the "commit" command.

Each subsequent commit refers to the commit before it, thus organizing the commit objects in time.

It's most fun to think "git" is the good ol' boy version of "get," but Linus Torvalds, its inventor, writes that, when you are in a good mood and it works, it's "global information tracker."

 Establishing Git

• Install Git -- these instructions are for my Mac system 10.12.5 (Sierra) and Git v.2.13.1.
• Download here.
• Use the Installer to install.
• Establish a link between the Fab Lab repository and your terminal.
• Pair using the commands described here.
  • Open Terminal.
  • Get into your root user directory. The command will look something like cd /Users/name -- this will change directory to your root user folder.
  • Type the command to pair: ssh keygen -t rsa -C yourFabAcadEmail@server.com
  • When you get the random art key, you know this part is achieved.
• Copy your private key to your FabLab GitLab profile.
  • Type cat ~/.ssh/id_rsa.pub to see the key that was generated. It will be a long string.
  • Copy that with the command pbcopy < ~/.ssh/id_rsa.pub
  • Go to http://git.fabacademy.org/ to enter the key. See "My SSH Keys" section under the "SSH" tab in your user profile. Enter it starting with "ssh-rsa" and ending with your username and host.
• See the series of commands in the image.

establishing an identity recognizable to the Github

 Using Git

• Create a folder to store your project files on your computer.
• Navigate to it using the Terminal.
• pwd means show where you are in the file structure
• cd means change directory
• ls means list directory
• Clone the Fab Lab repository into that folder on your machine.
• Find the SSH key for the directory on the Fab Academy git user page. Enter it in the next command.
• Enter the Terminal command: clone "SSH key for Fab Acad repo"
• Use the navigation commands to get into your student numbered folder in your lab. It will look like ~ /FabLab/fablabbcn2016/students/#.
• Type terminal sequence:
• git pull - This checksums the repository.
• git add . - This checksums the objects in your local directory.
• git status - If changes are green, fine; if not, you need to pull again.
• git commit -m - This stages changes; add a "-m" message of explanation.
• git push - This uploads the changes to the global repository.
• wait for message saying the commit is done

(on the GitLab site, a message shows that the upload is complete)

Final Project concept drafts

To see initial ideas for Final Project, see here and here.

Some Interesting Ideas

A few quotes from an online recitation with Massimo Banzi, co-creator of the Arduino:
 “The beginner had to suffer to learn.” He was referring to his own start in computing as a child.
 “Designing the experience is more important than how powerful is the technology.” He references Ettore Sottsass and Dieter Rams (see Rams' simple design principles.)

one of Sottsass' beautiful interfaces

Arduino uses open source software and proprietary production on its hardware. It's one of many ways to modify open source so it can be "sustainable," i.e. by generating profit.