Dev Track 2.0
Learn in blocks. Build after every lesson.
Follow Web Development, Tailwind, TypeScript, React, and Next.js in order. Every module contains a lesson, quiz, coding exercise, and mini project—then the original iDevMeet project railway waits at the end.
Course blocks (10)
Tailwind CSS
Utility-first styling, responsive layouts, interaction states, and a complete interface capstone.
- 015 activitiesUtility-First Foundations
Compose interfaces directly with focused utilities for spacing, color, type, sizing, and display.
- 025 activitiesSpacing & Typography
Control axis spacing, stacks, font size, weight, line height, width constraints, and readable rhythm.
- 035 activitiesSurfaces & Interaction States
Use borders, radius, shadows, hover, focus, transforms, visibility, and dark-mode variants.
- 045 activitiesFlexbox & Grid
Build one- and two-dimensional layouts with flex direction, alignment, grid columns, spans, and gaps.
- 055 activitiesResponsive Tailwind
Apply mobile-first breakpoint variants, responsive visibility, adaptive columns, and size constraints.
- 065 activitiesTailwind Interface Capstone
Combine utilities into a polished responsive interface with reusable visual patterns and accessible states.
- 075 activitiesConfiguration & Design Tokens
Set up Tailwind properly, define reusable color/type/spacing tokens, and connect utilities to a coherent product theme.
- 085 activitiesReusable Component System
Build maintainable component variants, composition patterns, consistent states, and reusable interface primitives.
- 095 activitiesAccessibility & Production Optimization
Audit contrast, keyboard focus, responsive behavior, generated CSS, content detection, and production bundle size.