Course Information
Course Overview
Brand New Course! Covers Flexbox, CSS Grid, Animations, Responsive Design and More! Tons of Exercises & Projects.
**Modern in-depth HTML & CSS course!**
** Check out the promo video to see the beautiful, responsive projects we build in this course! **
This course will teach you everything you need to know about HTML, CSS, and web design to build your own stunning websites from scratch. Instead of just watching me code, you’ll learn how to structure and build any website you can think of.
My background is in teaching in-person bootcamp programs around the world, where I work directly with students to help them learn web development and change careers. This course is based on all my experience in the classroom. Unlike most Udemy courses, this course includes dozens of exercises and challenges which ask you to recreate components, build layouts, and practice HTML and CSS. Practice is the most important tool I have to help you learn, and this course includes lots of it!
This course covers a huge amount of information, but it’s designed to be approachable for complete beginners and intermediate developers alike.
We start with the basics of HTML: structuring documents, creating text elements, tables, and forms. Then we learn about semantic markup and creating accessible webpages
Next, we cover the basics of CSS: working with selectors, color systems, and styling text elements.
From there, we cover critical CSS concepts including the box model, specificity, the cascade, and CSS units.
Next you’ll learn all about backgrounds, gradients, filters, positioning elements, working with transitions and transformations, and many other more intermediate CSS properties.
We then spend nearly 10 hours learning how to create complex CSS layouts using Flexbox and CSS Grid. We then build multiple projects with complicated layouts.
You’ll learn how to build responsive layouts that look good on all screen sizes, from large desktops to tablets and mobile devices.
Finally, we wrap up the course with our massive final project that we build together from scratch. This project combines everything we’ve learned in the course into one huge website built with thousands of lines of HTML & CSS. Check out the promo video to learn more about the final project.
This course includes:
Over 37 hours of high quality videos
Downloadable assets, starter coder, and solutions for all sections
Dozens of exercises, challenges, and quizzes
Downloadable slides and cheatsheets, including beautiful diagrams and syntax references
Included support in the course Q&A forums
Access to our exclusive discord community with thousands of students
About me (your instructor)
I’m a teacher with extensive real-world teaching experience. I’ve taught thousands of students how to code at my in-person coding bootcamps around the globe. My graduates work at companies including Google, Tesla, Apple, Airbnb, and pretty much any big company you can name. My in-person teaching background informs the online experiences I create for students. Unlike most Udemy instructors, I’ve actually taught this material in a classroom full of students for nearly a decade. I know what works and what doesn’t work!
Course Content
- 35 section(s)
- 319 lecture(s)
- Section 1 Introduction
- Section 2 HTML Basics
- Section 3 More HTML
- Section 4 Working With Forms
- Section 5 Other Elements
- Section 6 CSS Basics
- Section 7 The World of CSS Colors
- Section 8 Styling Text
- Section 9 More Text Styling
- Section 10 Selectors Pt. 1
- Section 11 The Box Model
- Section 12 Artist Portfolio Project
- Section 13 Specificity and The Cascade
- Section 14 Blog Post Project
- Section 15 CSS Units
- Section 16 Hazel CV Project
- Section 17 Backgrounds, Gradients, & Filters
- Section 18 Positioning
- Section 19 Transitions and Transforms
- Section 20 Flexbox: Part 1
- Section 21 Flexbox Pt 2: Flex Items & Patterns!
- Section 22 Cost Estimator Project
- Section 23 Making Responsive Websites With Media Queries
- Section 24 Making Our Projects Responsive
- Section 25 CSS Grid Part 1
- Section 26 CSS Grid Part 2
- Section 27 Grid Project
- Section 28 Building Animations
- Section 29 Building A Mobile Drawer Navbar
- Section 30 ::before and ::after Pseudo-Elements
- Section 31 Modern CSS
- Section 32 Swipe Mega Project
- Section 33 Swipe Project Pt 2
- Section 34 Swipe Pt 3
- Section 35 Swipe Pt 4: Making It Responsive
What You’ll Learn
- Master HTML & CSS and build massive real-world projects, with no prior knowledge needed!, How to write well-structured and semantic HTML documents, Master tricky CSS concepts including the cascade, inheritance, and specificity, Work with CSS animations, transitions, pseudo-elements, gradients, and more, Get practice with dozens of exercises, quizzes, and challenges, Design beautiful websites from the ground up that look good on all screen sizes, Build reusable components, work with CSS variables, and write modern and clean CSS code
Skills covered in this course
Reviews
-
BBurkhard Wettig
The general concepts were delivered really well. I see a bit space for improvement in the project chapter videos, where the teaching concept is too improvised and as a spectator you follow the trainer a lot of time just doing trial and error. But that's just a minor thing as well as the rather sudden stop of the video series at the end. I'd like to have a short summary and maybe have a suggestion where to continue as a student of that matter.
-
AAritz FERNANDEZ MUÑOZ
Maravilloso, super util y entretenido
-
WWendy Vanden Driesch
Finally a course that gives me all the info I need and also the practice I need.
-
RRichard Kenyon
I really enjoyed the course and found it a useful introduction, I found it useful to pair this course with frontendmentor.io to get more practice.