0. Assignments for week1

The assignments for week1 were as below;

  1. Build a personal site describing you and your final project.
  2. Upload it to the class archive. Do a git tutorial.
  3. Plan and sketch a potential semester project and add it to your website.

1. Building personal website

Before enter the explanation, I would like to show my system environment below.;

System Emvironment:

  • PC: Macbook Air(2015)
  • OS: iOS Yosemite v10
  • Coding Soft: Sublime text 2.0
  • Browse: Google Chrome / Opera
  • Command line tool: iTerm

Fortunately, I worked as server side engineer, using Ruby on Rails, I had already set up my coding environment before the class start, so mainly I am using the same system environment as bofore.

Though I can write code to a certain extent, I had never developed website using HTML/CSS/JS from scrach since my high school days, that is over 5 years ago, so I have to learn basic skills for HTML/CSS/JS again.

For my study, I took simple and free tutorial of codecademy, which is an online interactive platform that offers free coding classes in 9 different programming languages(Ruby, HTML, CSS or so). After I complete HTML/CSS course in codecademy for 3-4 hours, I started to build my website.

In additon to that, I used Bootstrap, which is free and open-source collection of design template, and it will help me greatly. Regarding to the other parts, I implemented functions(fixed navigation bar/respond navigation/or so) by using tips from Google and by trial and error.

Coding HTML/CSS on Sublime Text

2. Using version control protocols

In the class of week1, Prf. Niel taught us how to use version control protocols, which called "Git", which is widely-used source code management system for software development.

Fortunately, I had already known how to use version control protocols with Git because I was using Github flow in system development when I worked as server-side engineer at ICT startup in Africa last year, then I was able to setup and operate Git easily.

I summarize and write briefly how to set up and operate Git as below.

Basic setup

  1. Make account of Gitlab

    First, I signed up Gitlab, which is a web-based Git repository manager Fab Academy Organizers directed us to use. (The function itself is almost same as Github)

  2. Generate SSH key
  3. Next, steudents had to generate ssh key for Gitlab by referring to the web manual on Github("Generating an SSH key"). SSH is a encrypted network protocol to allow users remote login and other network services to operate securely. As for me, I had already generated, so I registered my ssh key to Gitlab.

  4. Register ssh key and setup connection

    After generating ssh key, copy and past the key to gitlab to setup secure connection betweek our PC and remote repository.

Prepare working directory

After finishing basic setup, I prepared working directory in local envirnment. First, to clone remote repository to local by, put the code below to terminal.

git clone (remote-repository-url) . # Clone a repository into a new directory

Record working output in remote repository

After we finished your temporary work, we have to uplaod your work. To do so, every time finishing and updating our work, we have to do sequent process below, so that we can record changes we made to remote repository and deploy our up-to-date version to server.

git add . #Add current file contents and changes to the index.
git commit #Record changes to local repository.
git pull #Fetch from and integrate with remote repository
git push  #Post working record to rocal repository

Other frequent Git code

Thogh there's no explanation in the class, I will list up frequent used and userful git codes below.

Git Code explanation
git status Show the working tree status
git config Get and set repository or global options.
git remote manage set of tracked repositories.
git branch List all branches.
git branch (branch name) Create new branches.
git checkout Switch branches or restore working tree files.
git merge Join two or more development histories together.
git log Show commit logs.

3. Making proposal of final project

Outline of this page

1. Building personal website
2. Using version control protocols
3. Making proposal of final project

Material for Wk1

Handbook and Assesment Sheet

Here is the Fab Academy Handbook and the shorter version of the Evaluation Checklist 2015 on google docs:

Lecture Note


Learning Support

Here is the english tutorials for all of Fab Academy lectures

Here is the english tutorials for Wk1

Videos of Wk1

Here you can find this weeks's lectures on week1 on VIMEO:



Checklist for Wk1

  • Build a personal site describing you and your final project.
  • Plan and sketch a potential semester project and add it to your website.
  • Upload it to the class archive. Do a git tutorial.
Learning outcomes:
  • Explore and use website development tools
  • Formulate a final project proposal
  • Identify version control protocols
Have you:
  • made a website and described how you did it
  • introduced yourself
  • made a sketch of your final project
  • pushed to the class archive
  • documented steps for uploading files to archive