Skip to content

shaizCodes/teach-web-engineering

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Web Engineering Teaching Journey

Welcome to my documentation of a volunteer teaching journey in Web Engineering! This repository is a living record of my day-to-day lessons, resources, and reflections as I guide learners through the fundamentals and advanced concepts of web development.

About This Journey

Over the next 2-3 months (or longer), I will be teaching web engineering to a group of learners. Each day, I will document the lesson content, challenges, solutions, and additional resources. The aim is to create a transparent, reusable, and helpful resource for anyone interested in learning or teaching web engineering.

How to Use This Repository

  • Day-wise Documentation: Each teaching day has its own folder with a README detailing the lesson, key concepts, code samples, challenges, and solutions.
  • Resources: Images, external links, and references to other files in this repository are included for a richer learning experience.
  • Open Source: Feel free to use, adapt, or contribute to these materials!

Repository Structure

├── index.html                # Main HTML file (if used for demos)
├── README.md                 # Root documentation (this file)
├── day-01/                   # Day 01 lesson folder
│   └── README.md             # Day 01 lesson details
├── day-02/                   # Day 02 lesson folder (to be added)
│   └── README.md             # Day 02 lesson details (to be added)
... (and so on for each day)

Day-wise Lessons

  • Day 01: Internet, Web, Protocols, CORS, Auth, and HTTP Fundamentals
  • Day 02: HTML, HyperText, Markup, DTD, and More
  • Day 03: Introduction to CSS, Chrome DevTools, Block vs Inline Elements
  • Day 04: CSS Box Model, Selectors, Chrome DevTools Sources tab
  • Day 05: BEM, Emmet shortcuts, CSS Units and calc()
  • Day 06: Accessibility in DevTools, Semantic vs Presentational Formatting
  • Day 07: Flexbox Layouts and Card Components
  • Day 08: Flexbox Layouts: flex-wrap, flex-grow, Navigation Bars and Headers

Stay tuned for daily updates!

About

A volunteer-led guide to mastering web development, bridging the gap from zero coding knowledge to full-stack proficiency through conceptual lessons and practice tasks.

Topics

Resources

License

Stars

Watchers

Forks

Contributors

Languages