Introduction to Web Development
Learn how the modern web works by building real websites from scratch. Master semantic HTML for structure, CSS for styling, layout systems (Flexbox, Grid), Bootstrap components, and publish your personal portfolio live to the internet.
Prerequisite: No Prior Knowledge Needed
🟢 No Prior Knowledge — Complete beginners can register directly.
Core Areas Covered
Practical Capstone Project
Personal or simple business website.
What You'll Master
Write clean, semantic HTML5 markup
Style modern websites using CSS Flexbox and responsive layouts
Leverage Bootstrap components for rapid layout development
Deploy and host live websites on the internet with custom domains
Per-Hour Syllabus & Course Curriculum
Instructional Pacing
12 Hours Recommended (8 hrs minimum accelerated)
Flexible teaching units with hands-on labs and tangible milestones
Client/server model, domains and hosting basics, setting up a code editor and browser dev tools.
Install/open the editor, open a browser's dev tools, view a real page's source.
Explain how a webpage reaches a browser, and has a working dev setup.
HTML document structure, headings, paragraphs, links.
Build a first HTML page with headings, text, and a link.
Write a valid basic HTML page.
Ordered/unordered lists, images, basic form elements.
Add a list, an image, and a simple form to the page.
Add lists, images, and basic forms to an HTML page.
Semantic tags (header, nav, main, footer), why structure matters.
Refactor the page to use semantic tags correctly.
Structure an HTML page semantically.
Selectors, colour and font properties, the box model (margin/border/padding).
Style the existing page's text, colours, and spacing.
Apply basic CSS styling to an HTML page.
Intro to flexbox, positioning basics.
Use flexbox to align a row of elements (e.g. a navbar).
Lay out simple element groups using flexbox.
Pulling styling concepts together into a full-page design.
Style an entire page from a simple design reference.
Independently style a full webpage from a visual reference.
The Bootstrap grid system, containers, rows/columns.
Rebuild the page layout using Bootstrap's grid.
Lay out a page using a Bootstrap grid.
Bootstrap components — navbar, cards, buttons.
Add a Bootstrap navbar and a set of cards to the page.
Assemble a page using ready-made Bootstrap components.
Media queries, mobile-first thinking.
Test the page at multiple screen widths and fix breakpoints.
Make a page look good on mobile, tablet, and desktop.
Linking multiple pages together, consistent navigation, folder structure.
Add a second page and link it consistently from the first.
Structure and link a small multi-page website.
Publishing a static site (e.g. free hosting), final review checklist.
Publish the finished personal/business website live and do a final QA pass.
Independently build and publish a small live website.
Flexible Course Pacing & Extension Guidelines
⏱ Extend if: Learner also wants a contact form wired to a real service, or a multi-page business site with 5+ pages — add 3–4 hrs, new total 15–16 hrs.
Hour blocks are modular teaching units. Sessions can be merged into 90–120 min deep-dives or split into shorter focused sessions for younger learners while preserving every learning outcome.
Equipment & Prerequisites
Computer (Windows, Mac, or Linux) with VS Code installed
Google Chrome or modern browser
Live Online Tuition
₦5,500/hr
$4.15 USD/hr for international learners
✓ Free Know Your Instructor (KYI) session before payment