B106-Almost There!

Meng Fu
3 min readDec 7, 2020

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?

I thought the website were built from a robots. From the beginning I knew they’re build from code. Now, I have better understanding of how to apply CSS and other techniques. I know how to organize my codes too. I’m glad we learned how to make a page responsive.

What have you gained through this course beyond code? Beyond technical savvy?

I learn how to have better time management and self-motivation. I found myself to overcome challenges. I always try to find a solution to solve the problem. It’s definitely different from my previous college classes.

Where do you think you’re headed? Why? How? What are you going to do to encourage that?

I’m headed down the right path of my career choice. I’m proud of my accomplishments so far. The previous projects has been really fun. I understand majority of HTML and CSS language. I still need to a lot of practice on Javascript. I will keep learning and never give up.

What kinds of projects do you see yourself working on in 10 months?

First I want to land a front-end developer job. I can see myself working on UI projects. Hopefully creating and designing web pages. I would love use my creative brain to keep developing and improving website.

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?

The CSS files are placed in the “head” so that they load and the page is seen as it should be. The JavaScript files are placed before closing the “body”, so that they enhance their function once the entire page is loaded.

Consider HTML5 as an open web platform. What are the building blocks of HTML5?

  • Semantics: allowing you to describe more precisely what your content is.
  • Connectivity: allowing you to communicate with the server in new and innovative ways.
  • Offline and storage: allowing webpages to store data on the client-side locally and operate offline more efficiently.
  • Multimedia: making video and audio first-class citizens in the Open Web.
  • 2D/3D graphics and effects: allowing a much more diverse range of presentation options.
  • Performance and integration: providing greater speed optimization and better usage of computer hardware.
  • Device access: allowing for the usage of various input and output devices.
  • Styling: letting authors write more sophisticated themes.

What’s the difference between the :nth-of-type() and :nth-child() selectors?

:nth-of-type() are “structural” pseudo-classes, which are classes that allow us to select elements based on information within the document tree that cannot typically be represented by other simple selectors. :nth-child() is used to match an element based on a number, which represents the element’s position amongst it’s siblings. the number represents the number of siblings that exist before the element in the documents tree.

What is CSS-selector specificity, and how does it work?

If there are two or more conflicting CSS rules that point the same element, the browser follows some rules to determine which one is most specific and therefore wins out. Every selector has its place in the specificity hierarchy. There are four categories which define the specificity level of a selector: Inline styles, IDs, classes and attributes, pseudo-elements.

What resources do you use to learn about the latest in front-end development and design?

There are so many resource. I use Dribble and CSS animate a lot. I’m subscribed to medium articles. I read these article almost everyday. I listen to podcast and read books on HTML, CSS and JS. Recently my instructor also recommended Trello for project organization.

--

--