Week 1

Principles and practices
Project Managment


  1. Work through a git tutorial
  2. Build a personal site in the class archive.

Personal objectives

  1. Develop a personal site to show the progress in the assignments and final project
  2. Learn how to use an html editor, as well as html, css and java code.
  3. Use Git repositories to project management.

Git repositories and tutorial

In order to update the weekly assignments and the development in the final project is necessary to clone the git repository in to my files system. This is made through a very simple procedure (in Ubuntu). The Steps are as follow:

~$ ssh-keygen -t rsa -C "c********@gmail.com" (Generate a key)
~$ cat ~/.ssh/id_rsa.pub (Show the key generated)
~$ clip <~/.ssh/id_rsa.pub (copy the key)
~$ git clone git@git.fabacademy.org:fabacademy2017/ciudaddemexico.git (clone the git repository into the file system)

Once the folder is clone in the file system, this must appear in your Home folder. It´s a very good practice to keep the folder with the webpage files in a different folder and sync this one with the one in the clone repository. This is made with the next command in a terminal:

~$ rsync -r [source folder] [destination folder]

This is a very convenient way to keep all the changes up to date. The next steps are necessary to synchronize the local files with the remote repository:

~$ cd ~/ciudaddemexico/students/403 (Go to the clone repository)
~$ git add . (update the index based in the local files)
~$ git commit -m "[comment]" (commit the changes. The "-m" option allows to insert a comment)
The comment option is useful to keep a control of the different version
~$ git push origin master (send the project to the remote repository)

Personal Website

For the development of the personal site I decide to use a template available in Start Bootstrap which is an open-source front-end framework whit HTML, CSS and JavaScript based design templates. Specifically the freelancer template

I made the necessary modification in the html and css files using Atom, which is an open source text editor. Personally I think Atom is a very helpful tool to edit html, css and js files. Thanks to Atom and html tutorials I was able to modify the template to make more personal modifying the colors, the hyper-references and off course the contents.

The images in the webpage are going to be hosted in my personal dropbox. The images are showed as modal images, which requires a complement with the css file and javascript.
The files are going to be hosted in the same server of the webpage, except when the size is to big; in that case an external host (mediafire) will be use.

Update: After many struggle with the images and pictures hosted in dropbox, I decided to include the images in the root directory of my web page. Using the software Pinta, very Photoshop look alike, I keep the size of the images low.

Project Managment

The idea for a final project is to create a didactic crystallographic model. This will be a RGB LEDs cube (5x5x5), which means it will be an array of 125 LED.
The purpose is to help the understanding of three-dimensional crystallographic structures. In my own experiences is always challenging to explain an 3D arrangement on a plane. My idea is to make it easier for students as well as teachers.
Operation of the model will be through an Android App which only have the function to select the structure and via bluetooth will command the coordinates and the color of the LEDs that should be on to show the crystal structure selected. The progress of the final project will be documented in the final project page.



In this section the files generated during the development of the assignment will be available to download