This week, I started the Responsive Web Design course with freeCodeCamp. With a history of running before learning to walk, I ended up taking what little skills I gained in my first lesson on basic HTML and creating a home page with links to my classroom notes, developer diary, a page for my future projects, and an about and contact page. They say that when you work on projects instead of focusing on your schoolwork, it tends to slow down the learning process. That may be true. But I find I retain information better when I apply it to something personal. And that’s what this site is for me. Something I personally care about. It also makes it easy for me to quickly look back at my notes from previous chapters from anywhere in the world (so long as I have wifi).
Why start a developer diary? Well, for me, it all comes down to new horizons. This kind of creative outlet is completely new to me. I have no idea what surprises await, and I want to document everything that I can in the meantime.
So far, my coursework has been pretty straightforward. The hardest thing for me to wrap my head around has been GitHub. I made my first repo today as a way to record my class notes and test out HTML, allowing me to write, preview, and view the raw code on the back end all in the same interface. I also want to learn GitHub to host this website for free.
-Bought the domain name frontendfrequencies.dev (still need to figure out how to connect it with this website)
-Made a GitHub profile (and a logo!)
-Completed Responsive Web Design - Lesson 1
-Established a working foundation for this website :)
-It took me hours to figure out how to edit a repo folder. When selected, the folder title lives under two column headings. “Name” and “Last commit message”. I was adding all of my class notes (for practice) in the commit message section and, therefore, the Preview, Code, and Raw buttons either showed nothing or a pure white screen. It was really frustrating, but after trying everything recommended to me by the internet and Reddit, I eventually found the solution all by myself. I just needed to select my file under the “Name” column and add my code directly.
-Another issue I faced today was getting my page to appear in a format I found pleasing. While I wrote the home page in HTML, I learned that GitHub automatically converts Markdown files into HTML pages with Jekyll. After learning this (and not liking the layout of my HTML pages), I tested the Jekyll feature by rewriting my repo files to .md format, and that made my site run (and look) the way I wanted.
-I learned that, unlike a builder site that allows you to just add a page with the click of a button, a site like this requires extra organization. Rather than creating a page with all my notes or log entries, I learned I need to link my file page to a folder containing individual files with the content I want to share. Like, a page behind the page, if that makes sense… This really made me appreciate how traditional web design works and the time and attention to detail that go into this kind of creative work. -Finally, I learned how to publish my repo as a page. (I’m writing this down so I don’t forget!): click on the repo –> settings –> pages –> under “Branch” select Main + Folder / (root) –> Save
Tonight I’m meeting up with my best friend from high school. He is the one who convinced me to go into theatre with him our sophomore year. That was a turning point in my life because I ended up majoring in Theatre Arts and, ironically enough, he majored in Web Design. After nearly 20 years working in live entertainment, I can honestly say that building a website is exactly the same. There is an audience (the user), a curtain (the interface), and behind the scenes (all of the beautiful code that makes it function). I can’t wait to share my new project with him.