html, git, brackets, bootstrap.... 100% clueless

Since I am working at a computer science chair at the University, I do have heard of various programms and methods for programing but never been in touch with them directly. Luckily my co-participants Marcel, Cihan and Christian are so nice to help me out with my one Million questions about this and that and a hell lot of why's?

Time to get started!

• Creating accounts to start my repository
• Understanding the idea of source tree as a kind of documentation help
• Learning the roll of an editor like brackets and my first steps mit coding
• Getting an idea of how bootstraps works
• Finding an html template to play with and to edit the theme to fit my requirements

Step by step - my website to document my work

Step 1 - setting up my repository

Understanding how Sourcetree works and how useful it is as a documentation tool was my first step.

Step 2 - useing brackets as an editor for the first time

Marcel explained me the basics of coding and gave me his index page as a copy to play with and see how the appearence of the website was changing.

Step 3 - taking a closer look at bootstrap to understand framework in html

To create a basic website it is good to use bootstrap. There are plenty good websites like w3schools.com or htmlfreecodes.com which give a good excess for coding for a newby like me.

Step 4 - playing around in html and css

After I learned the basics of html, css bootstrap e.g., I decided to look for an html steady theme that I can modify to fit my needs. I found the html5 free template "Flip turn" by templatemo and used it as my base to play around with. I slowly got an idea of the commands and how everything is working together.

Step 5 - hurdles

In case I wasn't able to get the template to do what I want it to do, I was "cheating" by looking for codes that are already excisting. As I heard it is not even cheating, just helping yourself ;). This is an example where I need to implement a force for a wordwrap in the preview. Sorry if I use the complete wrong term, this is all so new to me!

A classy copy and paste failure ;), but I managed it, to make it look like I want it to

A second hurlde was to make a new connection for the "view" button. The original code was a function to make the image big by clicking on "view". My intention was that it should link to a new website of each week. Learning more about 'styles', I also solved this problem by myself as you can read this as a kind of proof ;)

Step 6 - correcting and learing

After taking a closer look at the framework I was able to solve the problem by myself and now the template does fit my requirements. Time to fill in the projects of each week. Oh no, wait, pull, commit, push.. first ;)