Final Thoughts
1. Think back on your first day of class. How did you think websites were built? Now how do you think they’re built? What’s the difference in your thinking?
When I started class I had been creating static websites for a few years so my thinking hasn’t really changed since then. When I first started coding though I wasn’t sure how all of the pieces worked together and it seemed quite complicated. At this point I realize that static websites are built with HTML, CSS and sometimes Javascript. They have an index page which is the entry point to the website and contains a head and body. The head specifies things about the site such as the title, metadata and links to CSS. The body lays out the page structure and the CSS creates the styles for the elements in the body.
2. What have you gained through this course beyond code? Beyond technical savvy?
Beyond code, this course has broadened my thinking in terms of how I work with and interact with other people. There have been a lot of helpful videos and articles that illustrate how valuable it is to think in terms of teams instead of individuals. It also has made me think about ways to break up tasks into small manageable pieces which helps with code but also helps with everyday life.
3. Where do you think you’re headed? Why? How? What are you going to do to encourage that?
I see programming as something that you are always learning. No matter how long you have been doing it there is always something to learn. Right now I am trying to build my confidence in my current skills and also learn as many new skills as I can. I hope that I am heading towards a job that I really like and that fits my interests. I want to enjoy the projects that I am working on and get excited about the code. In order to make that a reality I am going to work hard in class and push myself beyond what I know while refining the skills that I have already worked with. Hopefully that will lead me to a successful and fulfilling career that I enjoy.
4. What kinds of projects do you see yourself working on in 10 months?
I would like to work on projects in either React or Vue. I have dabbled in both frameworks and really liked them. I would also like to find a company to work for that creates projects that are interesting and challenge me to think in new directions.
5. Why is it generally a good idea to position CSS <link>s between <head></head> and JS <script>s, just before </body>? Do you know of any exceptions?
In general you want your CSS to load before everything else. Since HTML is read top to bottom it is best to put the links in the head tag. This way as the rest of the page renders it will have styling already instead of waiting on the styling at the end.
Javascript links are usually better to include at the bottom of the file just before the closing body tag because the rest of the page can load without waiting for the Javascript file. Also in a lot of instances the Javascript will be targeting HTML elements and if the Javascript loads first it may load before those elements are rendered which means it won’t be able to run the scripts for them.
6. Consider HTML5 as an open web platform. What are the building blocks of HTML5?
The building blocks of HTML5 are tags, attributes and elements. Tags are written between <> and have their own specific meaning. Elements are tags plus everything written within them. Attributes give tags extra information, they are specified with names and values like classes and styles.
7. What’s the difference between the :nth-of-type() and :nth-child() selectors?
:nth-child() will select the exact child you specify of the parent whereas :nth-of-type() will select the specific instance of the element regardless of which child it is. For instance if you have a parent div with an h3 and two paragraphs, if you select p:nth-child(2) you will get the first paragraph because it is a paragraph and the 2nd child of the parent. If you select p:nth-of-type(2) you will get the second paragraph because it is a paragraph and it is the second paragraph that is a child of the parent.
8. What is CSS-selector specificity, and how does it work?
CSS specificity is used to determine which rules style an element if there are conflicting rules. The CSS is read from top to bottom so if the rules have the same specificity, the last one will win. Otherwise it depends on how the rules are written. For instance, targeting an ID has a higher specificity than targeting a class so even if the rule targeting the class is written after the one targeting the ID, the ID will still win.
9. What resources do you use to learn about the latest in front-end development and design?
I really like Udemy for classes that are specific to a certain topic, so if I am learning something new, that is my go-to resource. I also get a weekly email from Frontend Focus that has several up to date articles talking about front-end development and design. Recently Medium also started sending me emails with articles related to development.
