Week1 : Principles and practices, project management
About Myself
I am a father of two beautiful kids. Spent some time of my life building different sort of things. A big part was doing performance art, in theater which started at a very young age. I did my studies and part of my proffesional career in the medical field. After almost 16 years between studies and clinical practive, I decided to explore a domian related to the medical field yet satisfy my passion for technology as transformation force. I did a graduate degree in Biomedical engineering and worked as a researcher for sometime. From the start of this journey I set a goal to help address local problems facing my community with localy concived and built solutions, by local talents. Starting a FabLab was a natural progression in my quest to create an echosystem and identify peers to share the same passion to impact our community collaborativly.
Final project
Initial Idea
My first idea for the final project was influenced by an observation of my kids, the great imagination in design and forms they are able to shape with simple toys, some that might be even a source of inspirationn for serious design projects by adults or even give an idea of a new approach to a design problem. Simply because kids design without setting boundaries.
The idea that was realized
Few weeks into the Academy I decided to switch to another idea I had previously in mind, something that intends to help patients with diabetic foot pathology. Diabetic foot is a dynamic condition in which changes in the foot bone and muscles archeticture is changing all the time, this dynamic charachter will require an orthotic solution that will change over time as well. This solution has to first protect the foot from injurey since diabetic foot start lossing sensation. And second diagnose the poorly distrbuted pressure on the foot padding as a result of the changing foot archeticture. And third provides a way to redistbute this pressure.
Personal Web Page ( Project Management)
I was able to build initial html pages first using SeaMonkey and latter after watching the video tutorial by Massimo Menichinelli I was encouraged to use Brackets and learned about CSS in the process. I started with the style sheet example provided with Brackets i didn't modify much of the style or the background colors. Later I started to modify my sheet gradually. After some experemetation I decided to leave that for now and rather focus on building up my web page; inhabiting it with more content.
Documentation Phobia
Emacs org mode to the rescue
In week 7 I started using Emacs text editor's org mode which I found to be extremely helpfully in getting documentation done fast and easy.Org mode is a similar to other Makup languages, that has it's own anotation to create diffferent text formating. The beauty is that it supports exporting as html, Latex and PDF so it makes converting any text I write easily to a web page. There are many useful resources online on using org mode but it is as simple as downloading emacs 24 or later which comes with org mode pre installed, then creating a file with .org extension.
After creating the file ctrl+x ctrl+f
I start with the options ctrl+c ctrl+e t to insert export options
Setting Up the Page for Export
I change the option line as follows
#+OPTIONS: H:3 num:t toc:t \n:nil @:t ::t |:t ^:t -:t f:t *:t <:t
#+OPTIONS: H:3 num:nil toc:nil \n:nil @:t ::t |:t ^:t -:t f:t *:t <:t
to remove the table of content and numbering of headlines.
Sections and Topics
* headline
* a second headline
** a sub headline
*** and so forth
- bullet points
1- numbered bullet point
Formatting the text
and to format the text this is what we can use
*bold* ---> bold
/italic/ ---> italic
_underlined_ ---> underlined
~code~ ---> code
#+BEGIN_SRC
sample code lines
#+END_SRC
sample code lines
+strike-through+ ---> Strike-through
Links and images
[[]] add path to image between those double brackets to include images
[[][]] add path to a hyperlink and a name to appear for this link between first and second double brackets
Linking Videos
according to the org-mode manual adding the following line where a local video file is to be embeded in the exported html.
#+ATTR_HTML: :controls controls :width 350 #+BEGIN_video #+HTML: <source src="movie.mp4" type="video/mp4>" Your browser does not support the video tag. #+END_video
I have inserted the iframe from the vimeo embeded src as follows
~#+HTML: <iframe src="https://player.vimeo.com/video/192681629" width="640" height="468" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>~
While for those who want to embed a youtube video the following link explains how it can be done for emacs and org-mode.
http://endlessparentheses.com/embedding-youtube-videos-with-org-mode-links.html
I tried to use it initially but I encountered some errors, and the previous method was much straight forward.
CSS file and Styling
adding css file with export options
#+STYLE: <link href ="../main.css" rel ="stylesheet" type ="text/css">
after an upgrade to org mode from 7.9 to 8.0 the any export to html had a busted style. I found the reason in the following link http://orgmode.org/worg/org-8.0.html#sec-5-1
apparently the html specific option have been changed so for to include a CSS file the option has to be as follows.
#+HTML_HEAD: <link href ="../main.css" rel ="stylesheet" type ="text/css">
so now I have to go back to all my pages including this one to change the option.
Navigation Buttons
adding a home and up links also using export options
#+LINK_HOME: ../index.html
#+LINK_UP: ../assignment.html
Exporting
ctrl+c ctrl+e h h to export as html
ctrl+x ctrl+s to save changes
Attempts with Markdown
At some point I expremented with MarkDown using pandoc to export the files to html and using different style.css files.
But I had to go through much of the existing documentation to convert it to markdown, which I didn't fancy. I used Markdown on other occasions to write documents exporting them to PDF using pandoc. I would also recommend trying markdown with Atom which has a preview mode.
This is the example page I took the above screen-shoot from.
Version control with git
I have used git sometime ago, I just needed a concise reminder. This site was pretty much what I was looking for.
Later I found also this site which has more in depth info
https://www.atlassian.com/git/tutorials/comparing-workflows/
First thing first I need to install git on ubuntu and then I cloned my our Lab repo on gitlab
sudo apt-get install git git clone git@git.fabacademy.org:fabacademy2017/fablabbahrain.git
but before that I had to generate my own keys
Everything was going smoothly at the beginning, but then when we had to generate my own key and use git-lab it didn't work as I expected.
I think alot of credit goes to the tutorial Francisco has provided in making the troubleshooting of the problems an easy task. The think to keep in mind is to clone the ssh address and then to go t profile setting on the gitlab and find on the left SSH Keys. Then after generating and adding those ssh keys. Some trouble shooting was required and the tutorial help with that.
When it comes to the actual steps of pushing to the repo, It eventually boiled up to the following:
git add --all git commit -m "my message" git push
- after doing some changes in the repo locally I would
git add --all - then I commit the changes with a message
git commit -m"my message" - then push to the repo with
git push
it's usually advicable to do git pull at the start but as i understood since I am the only person working on the repo for our lab no conflicts are expected to arise if I push before pulling.
I usually start with git status after a long time of not pushing to the repo to check if there is anything I need to commit and I forgot.