Homework 1
Our first assignment was to learn Git, HTML, CSS, and BootStrap. Then to make a repository and website that houses all our information including a dummy website showing our basic knowledge of these programs. I was excited by the idea of creating a website and repository, though I had no real experience using any of these programs before. I had to work hard to quickly understand each program and learn what I needed to successfully put together the assignment ask. Some of the things that were helpful in this effort were youtube videos, language reference materials (aka each languages website), and of course Google.
Links
Want to go back?
Git
To start I immediately downloaded Git from my bash shell. I leveraged many resources online and learned all about how to use it and how to issue commands. Additionally in class we broke down how git works behind the scenes to update your repository which was very helpful. The main functions that I used git for were:
git clone repository /*to get updates from my online repository*/
git pull /*to pull info from my repository at github to my local*/
git add file1 file2 ... /*to stage my files locally*/
git commit file1 file2 -m "Helful message" /*commit my staged files*/)
git push /*to push my local resposity data*/
git status /*to find out my local respository status & updates*/
I made sure to use multiple git push commands to confirm changes were being made and to see the updates to my site and respository real time.
HTML, CCS, and BootStrap
I put in many hours watching videos for each program as these were newer languages that I hadn’t had a chance to use previously. Fortunately I was familiar with HTML and CSS simply by looking over website scripting. I watched the videos and made cheat sheets to help me learn what was needed to complete my objective. I used notepad++ for the coding and a python extention to help with autofilling HTML code. Once I had the hang of it, I started creating my pages for my site. I used some basic BootStrap classes (mostly the container class for formatting) and made some of my own so that I could format as needed. An example of this was my navbar which needed some help from BootStrap to make it look nicer:
<nav class="navbar navbar-default>
<div class="container">
<ul class="nav navbar-nav">
<li class="home"><a href="index.html">Homepage</a></li>
<li><a href="lists.html">Popular Board Games</a></li>
<li><a href="columns.html">Places to Buy</a></li>
<li><a href="contact.html">Contact Me</a></li>
</ul>
</div>
</nav>
In this example I created a nav item with a specific BootStrap class that helped to create my formatting. I seperated this formatting by using a div, and placed the content into a list. With the coding complete, I was able to link my pages together.
Github Pages
Probably the hardest thing for me to fully comprehend was the Github pages. There wasn’t a lot in the assignement description that really talked about how to set up your pages. But I reversed engineered the examples that were provided and I was able to figure out how to pick a theme, create the code/data for the theme, update my title, make multiple pages, and link them all together. Again having 1 week to learn all of these programs and to figure out how to put this together was one of the most challenging tasks I have had to date, but once completed I felt like my knowledge has improved greatly as a CS major! I feel that overall my project turned out really nice considering all that I had to learn in a short timeline. I look forward to learning more and doing more things to improve my site in the weeks to come!