Advanced HTML CSS & SASS - Build and Deploy Modern Websites

In this Course you will learn the basic skills that every beginner web developer needs, HTML & CSS, by Creating your own Blog Website & Publishing / Deploying it on the internet using GitHub, making it accessible to the hole world.

My Name is Norbert B.M. I am a Manager and I teach web development through courses like this and also on my YouTube channel and Blog, where I have tones of education content for you.

I am gonna take you from a complete beginner, with 0 experience in creating websites, to a confident coder by teaching you two of the core pillars skills of web development, that is the HTML and CSS programing language.

I decided to have a complete practical approach to this course.

You will start up with a short Environmental setup, where I will help you setup your coding environment using the most popular code editor on the market. We will also add to it my personal Extensions for coding with speed and efficiency.

I will then take you through just a basic introduction about what HTML is and how it works. And then, we will get strait in to creating your very first website.

I will slowly drag you into deeper and deeper waters , throwing CSS at you with colors, fonts, Pseudo classes and selector, showing you best practice examples, industry standards and personal tips and tricks, for animations, transitions and reflections, making websites responsive on different devices reaching from Desktop to Tablet and Mobile using Media queries, with everything culminating in publishing your very first website for everyone to visit and experience on the internet using GitHub.

What will you learn:

1. How to Setup a Developer Environment

2. HTML & CSS Basics - Build & Deploy Blog Website

   1. What is HTML

   2. HTML Comments

   3. HTML Heading Elements

   4. HTML Paragraph & Dummy Text

   5. HTML Horizontal Rules and Line Breaks

   6. HTML <div> Tag

   7. HTML Styles

   8. HTML Lists

   9. HTML Links

   10. HTML <img> Tag

   11. HTML Semantic Elements

   12. HTML <header> Element

   13. HTML <nav> Element

   14. HTML <section> Tag

   15. HTML <main> and <article> Tag

   16. HTML <audio> & <iframe> tags

   17. HTML <footer> Tag

   18. HTML Symbols and Icons

   19. What is CSS

   20. CSS Selectors

   21. HTML Elements ID there CSS selection

   22. HTML Elements Classes and there CSS selection

   23. CSS Colors

   24. CSS Backgrounds

   25. CSS Borders

   26. CSS Margins and Paddings

   27. CSS Selects All and General Reset

   28. Text Formatting

   29. CSS Fonts

   30. CSS Height, Width and Max-width

   31. CSS Pseudo-class

   32. Pseudo-element

   33. CSS Layout - The position Property

   34. CSS Flexbox Layout Module

   35. CSS Grid Layout Module

   36. Create Multiple  Web pages

   37. Shared Web Page Structure

   38. Navigate between web pages

   39. CSS Forms and Contact information

   40. CSS Transitions

   41. CSS Image Reflection

   42. CSS 2D Transforms

   43. CSS Animations

   44. CSS Media Queries

   45. Responsive About Page

   46. Responsive Blog Page and Post

   47. Responsive Post

   48. What is GitHub and How to create a GitHub Account

   49. Create a GitHub Repository & Publish your website

3. CSS Variables

4. CSS Calc () Method

5. CSS Flexbox Project

6. CSS Grid Project

7. Visual Studio Code Extensions and Shortcut keys

8. SASS & SCSS - The CSS with Superpowers

9. Scss Utilities

10. Scss Project - Button Component

11. Scss Projects - Alert Component

12. Scss Project - Card Component

13. Scss Project - Navbar Component

14. Project E-Learning Website using Scss

What are the requirements or prerequisites for taking this course?

Prior knowledge

- Knowing just the basics of HTML and CSS can help, but for dose of you that don't know them I included a complete beginner HTML and CSS Fundamentals section where we build and deploy a blog website, teaching you all of the basics that you need to know.

- For your more advanced developers you can take this as a short recap of your prior knowledge or just skip it entirely

Tools

A basic PC or Mac is sufficient. What I would recommend is a dual monitor setup, whether you have two monitors, a laptop with another monitor, or just a tabled for viewing the course and coding separately on your device.

Who is this course for?

this course is for :

- Beginner web developers that just got started.

- Beginner Front End web developers that want to consolidate their HTML and CSS skills.

- Advanced Web developers that wish to enhance their skills and speed using Sass and Scss.

- Front End web developers that want to create powerful reusable components for there UI/UX.

- Back End Web developers that want to create quick prototypes.

So join me on this journey and be a proud owner of your very first website and as a byproduct also leave with 3 brand new Skills: HTML CSS and Website Deployment.