HTML & CSS course (John Smilga)
Tags: javascript, webdev, beginners, tutorial
Published: 2022-04-17 09:39:47



![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wo0cv03ggb60wp581kdj.png)

## Why did it take this course?

This was the first Udemy course I ever took and it was also the first course I took when I decided to pursue a career as a web developer. I will always be thankful to John for this course as much as all the other courses and content from his youtube channel.

I found out about John and his courses throughout YOUTUBE, when I started I went to youtube and search for HTML & CSS courses and I found one on freeCodeCamp channel, it was John's course, and in this course, he covers all the basics and more about HTML and CSS. This course is 11 hours long and you can watch it [clicking here](https://www.youtube.com/watch?v=V5rIPKzcX7Q&t=8s)

After I watched this course, I went to his website [www.johnsmilga.com](https://www.johnsmilga.com/) and learned that we have longer versions of his courses in Udemy.

That is why I decided to take this course and many others he was in Udemy, and that has been the best decision I have taken since I started this journey.

## About the course

In this course, you will learn everything you need to know about HTML and CSS. And like in all John's courses, he does not take any topic for granted and explain everything so well and clear.

To me, the most amazing thing is that every single thing we learn we end up using later in at least one of the projects during the course.

I have recommended this course to everyone how wants to learn HTML & CSS, because I believe there is no better place to start, than here.

### What you will learn

This is what John tells us we are going to learn during the course.

- Learn HTML5 from scratch.
- Learn CSS3 from scratch.
- Create responsive real-world projects from scratch.
- Learn CSS Grid and Flexbox Layout Modules.
- Learn where to get free images, custom fonts.
- Learn how to work with font-awesome icons
- Learn where to get custom color palettes.

### Prerequisite

No programming/coding experience as we will start from absolute scratch.

### Course content and Course Projects

This course is divided into 24 sections with a total of 385 lessons and a duration of 36 hours.

As I said before, this course has everything you need to know, from the most basic to most useful tips.

#### HTML

It starts with an introduction to HTML, where we learn about HTML structure, semantics, and tags. After that, we built our simple but amazing first website,"Coffee Project".

#### CSS

After that, we start learning about CSS and again every topic is explained so clearly and in a very dynamic way. In this part of the course you will learn about color, units, typography, Box Model, images, positions, transforms, transition, animations, and more. To end up this part of the course we build our first big nice project, "Tea Project Station".

##### FLEX BOX

Once you have learned all this, the next step is to learn about flexbox, which at the beginning is a little bit confusing to understand, especially with the align-items and justify-content. But it gets easier as we go forward. At the end of this section, we built the "Backroads Tour Company".

##### CSS GRID

Learning about CSS Grid was my favorite part, it helps me a lot to create a entire website layout or the specific efficient part of it.

This part of the course is full of projects, first of all after learning about the CSS grid we get the changes to build a bunch of mini projects and after that, we build the biggest project of the course, a "Portfolio Website"

To see all the course projects, [click here](https://www.johnsmilga.com/projects).

## My thought about this course

All John courses are great, I will eventually take all of them. The way the course and the lessons are structured, the projects, and the explanations are perfect.

Here is really a great teacher and as I said before, I keep recommending his channel and courses to anyone how is interested in learning about web development.

I will always remember this course as the cornerstone of my web developer career.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/62u7e59oeqfdfybuwj0d.jpeg)

## What I had built after this course

These are some of the websites I build during and after this course.

- [My First Website 0.1](https://myfirstwebsite0-1.netlify.app/)
- [My First Website 0.2](https://myfirstwebsite0-2.netlify.app/)
- [My First Website 0.3](https://myfirstwebsite0-3.netlify.app/)