Musings

Part 3 of my front-end development crash course.

• The slides
• Slides JS code
• Go to part 2 (HTML & CSS)

Welcome to my series on learning web development! I created this crash course series to help teach a group of mostly designers at my school about web development, especially on the front-end. This is the third lesson but the first where we learn JS. If you want to start from the beginning, check out the first post.

If you want to play around with the JS snippets as you see them on the slides, you can copy it from this JS file and run it on JSFiddle or something similar.

Part 2 of my front-end development crash course.

• The slides
• Audio
• Project files
• My project solution
• Go to part 1 (The what and why of programming)
• Go to part 3 (JS)

Welcome to my series on learning web development! I created this crash course series to help teach a group of mostly designers at my school about web development, especially on the front-end. This is the second lesson, the first that involves programming. You can check out the first post here.

If you want to follow around messing with code on your own, sites like CodePen are great for tinkering.

Part 1 of my front-end development crash course.

• The slides
• Audio (Sorry for the quality - we were forced to do it in a restaurant with no projector)
• Go to part 2 (HTML & CSS)

Welcome to my series on learning web development! I created this crash course series to help teach a group of mostly designers at my school about web development, especially on the front-end. This week we were displaced from our usual area and had to meet in a restaurant nearby instead so we don’t have any video and the audio quality isn’t great. Regardless, I hope you enjoy this post!

Regardless of what you do professionally or are studying, the two main things that I want you to get from this whole course is a better understanding of what it means to program and what is possible using code (but specifically using web technology with an emphasis on the front-end).

Why personal studies?

As humans, we want people to perceive us in the best possible way. With modern tools, particularly social media, we allow others to view small preapproved glimpses of our lives. This is the way things should be – we should have control and security over the things we post. But, like everything that affects our lives, there are consequences we don’t necessarily see when the change first occurs.

Increasingly people focus on getting the right combination of imagery and words to present a glimpse of an experience to others rather than enjoying the full experience for themselves.

Today I will demonstrate how to show the loading of large image and video assets and reveal those assets using custom animations once they are finished loading.

In order to show the asset loading process, we will have to make XHR requests for them instead of loading them the conventional way. I will also be using ProgressBar.js to make creating and animating the loaders easier.