Build Responsive Real World Websites [Course Review]
April 11, 2019
Finished Jonas Schmedtmann's Build Responsive Real World Websites course yesterday.
Final code (without Google analytics): https://github.com/jskway/omnifood-website
I didn't expect to learn many new concepts going into the course, given that I was already familiar with HTML/CSS and basic web design concepts. I bought it mainly for review and to take a break from focusing on JavaScript.
However, I learned a ton and picked up a bunch of design techniques that'll come in very handy in future projects.
Jonas covers a lot of topics in the course, such as:
- Setting up Brackets (along with useful extensions)
- HTML basics
- CSS basics (box model, positioning, classes & IDs)
- Web design fundamentals (typography, color, images, icons, spacing, and layout)
- 7 steps to a fully functional website (starting from scratch)
- Building the site (the bulk of course content)
- Responsive design via media queries
- Cool effects via jQuery (sticky nav, smooth scrolling, animations on scroll)
- Site optimization (site speed, SEO, Google Analytics)
My favorite part of the course was his 7 step process to a fully functional website, which are:
- Define your project (goal, audience)
- Plan out everything (content, media, visual hierarchy, site structure, navigation)
- Sketch out ideas
- Design & Develop
- Site optimization
- Launch
- Site maintenance (monitor users' behavior and tweak)
I also liked how he organized his CSS code into different sections and subsections to make all the selectors & rules easy to navigate and edit.
The only critique I have is I wish he'd covered CSS Flexbox and Grid rather than floats, given that they're the preferred choice nowadays. However, it seems Jonas released the course a few years back when they weren't as viable as they are now. And it looks like he has a separate course called Advanced CSS and SASS which covers these systems.
Overall a great learning experience and highly recommended!