HTML CSS and SASS Bootcamp

HTML CSS and SASS Bootcamp, available at $74.99, has an average rating of 4.35, with 156 lectures, based on 99 reviews, and has 425 subscribers.

You will learn about Fundamentals of HTML5 and CSS3 Build Multiple Responsive Websites With Great UI Indept Understanding Of Page Layout Fundamentals of FlexBox and Grid System Advanced CSS Topics such as Variables, Pseudo-elements, etc. CSS Animation All Skill Levels SASS – Learn all the basics of SASS CSS Architecture Command Line, Git and GitHub This course is ideal for individuals who are Beginner With no knowledge of web development or Intermediate level web developers It is particularly useful for Beginner With no knowledge of web development or Intermediate level web developers.

Enroll now: HTML CSS and SASS Bootcamp

Summary

Title: HTML CSS and SASS Bootcamp

Price: $74.99

Average Rating: 4.35

Number of Lectures: 156

Number of Published Lectures: 156

Number of Curriculum Items: 156

Number of Published Curriculum Objects: 156

Original Price: $119.99

Quality Status: approved

Status: Live

What You Will Learn

Fundamentals of HTML5 and CSS3

Build Multiple Responsive Websites With Great UI

Indept Understanding Of Page Layout

Fundamentals of FlexBox and Grid System

Advanced CSS Topics such as Variables, Pseudo-elements, etc.

CSS Animation

All Skill Levels

SASS – Learn all the basics of SASS

CSS Architecture

Command Line, Git and GitHub

Who Should Attend

Beginner With no knowledge of web development

Intermediate level web developers

Target Audiences

Beginner With no knowledge of web development

Intermediate level web developers

This course is for beginners who want to learn web design and web development, as well as for existing web designers/developers who want to sharpen their understanding and skill in creating responsive and great websites.
In this web design course, we begin by going over the fundamentals of HTML and CSS, after which we look at the essentials of page layout.
We then create a mini project to test our understanding.
We also cover Flexbox, Grid layout, CSS Animation, SASS and some advanced CSS topics which you need for a good foundation in web design and web development. This would enable us to build a big project where we implement all the topics discussed.
We then proceed to teach about the COMMAND LINE, GIT and GITHUB, which is a tool every web developer should be familiar with.

WHAT IS THE GOAL OF THIS COURSE?
At the end of this course, you would be confident about creating responsive real-world websites with HTML and CSS and your understanding of all the essentials would be solidified. Your web design and web development skills would also be sharpened.

WHAT IS COVERED IN THIS COURSE?
1. Introduction and VSCode setup
2. HTML and CSS Fundamentals
3. Build a simple Page with HTML and CSS Basics
4. How to code HTML and CSS faster with EMMET
5. Build a Restaurant Website
6. FlexBox
7. Grid Layout – With Mini project
8. Advanced CSS Concepts
9. CSS Animations – transitions, transforms, and Keyframes.
10. Build a Wed Design Agency Website using many advanced concepts learned.
11. Optimize and Host the website on Netlify.
12. SASS – Syntactically Awesome Stylesheet

We are confident that at the end of this course, your web design and web development skills with HTML, CSS and SASS would be greatly improved.

This course is project-based.

We believe the best way to learn web design and web development is by practicing and that is why we build several projects including real-world responsive websites from scratch with HTML CSS and SASS. With the projects you build in this web design and web development course, you would be able to approach and any web design or web development project with clarity and confidence.

Lecture Approach
This web design and web development course with HTML, CSS and SASS take a beginner-friendly approach. We explain many advanced CSS concepts in an easy to understand manner. We cover the important basics of web development before delving into advanced areas in web development.

Course Curriculum

Chapter 1: Introduction

Lecture 1: Introduction

Lecture 2: How to get the best from this course

Chapter 2: Environment Setup

Lecture 1: Environment setup – Installing necessary tools

Lecture 2: Visual Studio Code Setup

Lecture 3: Visual Studio Code Setup – EMMET Extension

Lecture 4: Emmet Solution

Lecture 5: RESOURCES AND COURSE FILES

Chapter 3: Introduction To HTML

Lecture 1: What is HTML?

Lecture 2: HTML Syntax – Tags, Elements and Attributes

Lecture 3: Structure of an HTML Page

Lecture 4: Comments

Lecture 5: Header Tags

Lecture 6: Paragraph Tags

Lecture 7: Formatting text

Lecture 8: Unordered List

Lecture 9: Ordered List

Lecture 10: Images and Favicon

Lecture 11: Adding Audio files to a webpage

Lecture 12: Adding Video files to a webpage

Lecture 13: Forms

Lecture 14: Table

Lecture 15: Links

Lecture 16: iFrames

Lecture 17: Entities and Emojis

Lecture 18: Icon Fonts

Lecture 19: Types of Elements

Lecture 20: How to layout HTML page semantically

Chapter 4: Introduction to CSS

Lecture 1: What is CSS?

Lecture 2: CSS Syntax

Lecture 3: Inline and Internal CSS

Lecture 4: External CSS

Lecture 5: CSS rule priority

Lecture 6: CSS Comments

Lecture 7: Colors

Lecture 8: Selectors – Classes and id

Lecture 9: Border

Lecture 10: Border – CSS Challenge

Lecture 11: Padding

Lecture 12: Margins

Lecture 13: Span Tag and Class

Lecture 14: Challenge 2 – Basic Web Page

Lecture 15: Challenge 2 – Basic Web Page – Solution Part 1

Lecture 16: Challenge 2 – Basic Web Page – Solution Part 2

Lecture 17: The Box Model – Part 1

Lecture 18: The Box Model – Part 2

Lecture 19: Universal selector

Lecture 20: Formatting Text

Lecture 21: Fonts

Lecture 22: Google Fonts

Lecture 23: Links and Pseudo-classes

Lecture 24: Buttons

Lecture 25: Absolute and Relative position

Lecture 26: Fixed Position

Lecture 27: Floats – We dont use them in modern CSS

Lecture 28: Replacing Floats with Flexbox

Lecture 29: Background image

Lecture 30: Units in CSS

Lecture 31: Media Queries for Responsive Design

Lecture 32: Debugging your code

Lecture 33: Code Faster with EMMET Extension

Chapter 5: PROJECT 1 – A Restaurant Website

Lecture 1: Project Overview – What we would create

Lecture 2: Project Environment Setup

Lecture 3: Building the Header section – Markup

Lecture 4: Adding some global styles

Lecture 5: Building the Header section – CSS

Lecture 6: Building the Intro section – Markup

Lecture 7: Building the Intro section – CSS

Lecture 8: Building the About section – Markup

Lecture 9: Building the About section – CSS

Lecture 10: Building the Menu section – Markup

Lecture 11: Building the Menu section – CSS

Lecture 12: Building the Testimonial section – Markup

Lecture 13: Building the Testimonial section – CSS

Lecture 14: Building the Order section – Markup

Lecture 15: Building the Order section – CSS

Lecture 16: Building the Footer section – Markup

Lecture 17: Building the Footer section – CSS

Chapter 6: FLEXBOX

Lecture 1: Flexbox Part 1

Lecture 2: Flexbox Part 2

Chapter 7: Grid System

Lecture 1: CSS Grid System – Part 1

Lecture 2: CSS Grid System – Part 2

Lecture 3: CSS Grid System – Part 3

Chapter 8: Advanced CSS Concepts

Lecture 1: Pseudo Classes

Lecture 2: Pseudo Elements

Lecture 3: Using the before Pseudo Elements

Lecture 4: Box Shadow

Lecture 5: CSS Variables

Lecture 6: Background

Chapter 9: CSS Animation

Lecture 1: Transition

Lecture 2: Transform – Translate Property

Lecture 3: Transform – Scale Property

Instructors

Ewomazino Akpareva
Web Developer

Rating Distribution

1 stars: 0 votes

2 stars: 1 votes

3 stars: 4 votes

4 stars: 22 votes

5 stars: 72 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!