Web Development Foundation: Learn HTML5, CSS3 & Bootstrap

Build Responsive Websites With HTML5 & CSS3 (Flexbox, Grid, Transitions, Animation, SVG) / Along with Bootstrap & SASS

  • 140 Videos
  • 23 hours 28 minutes
  • 68 Happy Students

About the course

Welcome to Web Development Foundation, the best course to start your web development journey as a beginner, step-by-step. This course explains each and every important topic including concept, documentation, and implementation. The entire course is designed for beginners with one goal in mind: to build responsive websites using HTML5, CSS3, Bootstrap & Sass.

Throughout the course, we will explore the most important topics step-by-step, along with building six complete projects:

  1. How Does The Web Works?
    • Client and Server
    • HTTP Requests (GET, POST, PUT, DELETE)
    • HTTP Response (Status Code, Content-Type)
  2. HTML Fundamentals
    • Syntax
    • Document Structure
    • Meta Data
    • Links
    • Images and Media
    • Form Elements
    • Forms
  3. HTML Semantics
    • Sections (body, article, section, nav, aside, h1…h6, header, footer)
    • Grouping Elements (main, div, p, hr, ul, ol, li, figure, pre)
    • Text Level (a, em, strong, span, br)
  4. CSS Fundamentals
    • Adding CSS (Inline, Internal and External)
    • Syntax: selectors, declaration block, properties, declared value
    • CSS Selectors (universal, type, class, id, attribute)
    • Cascade and Specificity
    • Box Model
    • Sizing (padding, margin, width, height and border)
    • Units
    • Position (absolute, relative, fixed, static and sticky)
    • Display Property
    • Fonts and other formatting properties
    • Advanced Selectors
  5. Responsive Design
    • Text Effects
    • Images and video resizing
    • Different viewports
    • Media queries
  6. Layouts
    • Flexbox
    • CSS Grids
  7. Advanced
    • Variables
    • Transition & Animations
    • Transforms
    • Shadows and Gradients
    • Design Patterns
    • Website Planning
  8. SVG
  9. CSS Libraries
  10. Bootstrap (CSS Framework)
    • Layouts
    • Content
    • Forms
    • Components
    • Utilities
  11. SASS (CSS Preprocessor)
    • Variables
    • Nesting
    • Partials & Modules
    • Mixins
    • Extend/Inheritance
    • Operators
  12. Website Deployment

Why this course?

  • The entire course is focused on a project-building approach
  • Learn all the important concepts in the simplest possible way, with many examples.
  • No previous programming or coding experience is required, we will cover everything step-by-step from the basics.
  • All course materials are here

  • 140 Videos
  • 23 hours 28 minutes
  • 68 Happy Students

Courses Outline

Lesson 1: Course Introduction
Free
Introduction & Curriculum Walktrough
5:26
Lesson 2: Resources & Setup
Lesson 3: HTML Fundamentals
Lesson 4: HTML Semantics
Lesson 5: CSS Fundamentals 1.0
Lesson 6: CSS Fundamentals 2.0
Lesson 7: CSS Fundamentals 3.0 (Display & Position)
Lesson 8: CSS Fundamentals 4.0 (Responsive Web Design)
Lesson 9: Project 1 - Profile Card
Lesson 10: Project 2 - Login Page
Lesson 11: Layout 1 - Flexbox
Lesson 12: Project 3 - Spotify Clone using Flexbox
Lesson 13: CSS Advanced 1.0
Lesson 14: CSS Advanced 2.0 (SVG - Scalable Vector Graphics)
Lesson 15: CSS Advanced 3.0 (Transition & Animation)
Lesson 16: Layout 2 - CSS Gird
Lesson 17: Browser Compatibility
Lesson 18: Project 4 - Testimonial Page Using CSS Grid
Lesson 19: SASS - CSS Preprocessor
Lesson 20: Project 5 - Portfolio Website Using Bootstrap
Lesson 21: Project 6 - EdTech Startup Landing Page
Lesson 22: Deployment - Your Website on Web
Lesson 23: Bonus - What's Next?
  • 140 Videos
  • 23 hours 28 minutes
  • 68 Happy Students