Freedom Project

Context

The “Freedom Project” for SEP10 is all about choosing one topic and specifying the technology that has already been implemented in the past and what the technology will look like in the future. The final result will be displayed on a website. The purpose of this blog is to show your progress of how you made the website, why you choose this topic instead of multitudes of other intriguing topics, your growth, glow, and the skills you are going to acquire for this project.


Content

For my project, I am making a website about public transportation using HTML (HyperText Markup Language), CSS (Cascading Style Sheets), Bootstrap (framework), Foundation (framework), and Github. This blog will walk through my process of independently studying technology used in the past and future for transportation, and making the website.


Reflection

My biggest challenge for the freedom project was the navbar or navigation bar. At first, I used Foundation, my tool for the project, to build my website. When I previewed my website, most of the links were not working at all. The navbar wasn't as responsive as I liked; the navbar took a longer time to change into different form factors. The solution to my navbar issue was to use Bootstrap, a framework similar to Foundation, instead. Another challenge I faced making the website was at the main page of my website. On the main page, you would see 20 boxes with text inside. For some reason, the boxes would look like this (look at the first image). I spent hours to solve the issue. I looked back at the CSS that made the boxes to look a certain way. Here's the code: border: solid 3 px black; and margin: 2px;
As you can see, there was no spelling errors or incorrect syntax (how the language is structured). I changed the weight of the border in this first line of code which did nothing at all. However, the second line of code was the cause of the issue. I didn't know that the boxes shouldn't have any margin. Adding margin space to the boxes would leave gaps that wasn't accepted. After those two difficult challenges, I had a much easier time to make the website.


Takeaways

Preview of the Project
Code of the Project
Link to the Freedom Project Blog