New Batch Enrolling Now
Frontend Fundamentals: HTML, CSS & Bootstrap
Frontend Development (No JavaScript) • Designed for Campus juniors / beginners
2025 Edition - 6 Months comprehensive training program
Coming Soon
Start Date
6 Months
Duration
1500 LKR
Monthly Fee
Online
Mode
Sinhala
Language
What You Will Learn
A comprehensive curriculum designed for 2025's job market.
6 Months
Online
Frontend Development (No JavaScript)
Module 1Web Foundations & HTML
Topics Covered
- How the web works (browser, server, hosting)
- Role of a frontend developer in 2025
- HTML5 structure
- Semantic HTML elements
- Text, images, links, lists
- Tables and forms (basic)
- Accessibility basics
- SEO-friendly HTML structure
Tools & Technologies
VS CodeLive ServerChrome DevToolsGitHub (account setup)
Module Project
Personal Profile Website (HTML only)
Module 2CSS Core & Modern Styling
Topics Covered
- CSS syntax and selectors
- Box model
- Colors, units, typography
- Google Fonts
- Backgrounds and gradients
- Flexbox layout
- CSS positioning
- CSS best practices
Tools & Technologies
VS CodeCSS Peek ExtensionFigma (design viewing)
Module Project
Styled Portfolio Website (HTML + CSS)
Module 3Responsive Design & UI Basics
Topics Covered
- Mobile-first design
- Media queries
- Responsive typography
- Responsive images
- Common device breakpoints
- UI spacing systems
- Basic color psychology
- Responsive accessibility
Tools & Technologies
Chrome DevTools (Device Mode)Lighthouse
Module Project
Responsive Business Website
Module 4Bootstrap for Professional UI
Topics Covered
- Bootstrap setup (CDN)
- Bootstrap grid system
- Containers and breakpoints
- Typography and utilities
- Buttons, cards, navbars
- Forms and tables
- Bootstrap components (HTML usage)
- Customizing Bootstrap with CSS
Tools & Technologies
Bootstrap DocumentationBrowser DevTools
Module Project
Company Landing Page using Bootstrap
Module 5Advanced Frontend Practices (No JS)
Topics Covered
- CSS variables
- Reusable UI components
- Frontend folder structure
- Naming conventions (BEM intro)
- Image optimization
- SEO basics for frontend
- Web accessibility (WCAG basics)
- Dark mode using CSS
Tools & Technologies
GitGitHubGitHub Pages / Firebase Hosting
Module Project
Multi-page Website (5–7 pages)
Module 6SCSS, Git & AI for Frontend Developers
Topics Covered
- SCSS syntax, variables and nesting
- Partials, mixins and functions
- SCSS folder architecture
- Using SCSS with Bootstrap
- Compiling SCSS to CSS
- Git basics for frontend developers
- Git workflow (init, commit, branch, merge)
- Working with GitHub repositories
- Using AI for UI ideas and layout inspiration
- Using AI to improve HTML semantics
- Using AI for CSS optimization and refactoring
- AI-assisted accessibility and SEO checks
Tools & Technologies
Sass (CLI)GitGitHubVS CodeAI tools (ChatGPT, design assistants)
Module Project
Refactor Existing Website using SCSS, Git & AI Assistance
Course Outcomes
Build modern responsive websites
Understand frontend industry practices
Create a professional portfolio
Deploy static websites
Course Introduction
Need to learn more about the course?
Community Love
Trusted by Students
From university students to industry professionals, see who's learning with us.
Secure Your Spot
Limited seats available for the upcoming batch. Click the button below to complete your registration via our official form.
You will be redirected to our secure Google Form.