Practice
Code, build, and experiment
Hands-on practice with an interactive playground, mini projects, and full-stack assignments.
Code Playground
Write HTML, CSS, and JavaScript in linked editors with live preview. Use it to experiment, prototype, or practice concepts from the tutorials.
Mini Projects
Small projects to sharpen your skills
Personal Portfolio Page
Build a one-page portfolio with bio, skills, and project cards.
Responsive Navbar
Create a navigation bar that collapses to a hamburger menu on mobile.
Digital Clock
Display a live digital clock that updates every second using JavaScript.
To-Do List App
Build a todo app with add, complete, and delete functionality.
CSS Art - Loading Spinner
Create a pure CSS loading spinner animation.
Calculator
Build a working calculator with basic arithmetic operations.
Weather Dashboard
Fetch weather data from an API and display current conditions.
Quiz App
Build a multiple-choice quiz with score tracking and timer.
Modal & Accordion UI
Create reusable modal dialog and accordion components.
Image Gallery with Filter
Build a gallery with category filter and lightbox preview.
Form Validation Library
Create a client-side form validation system with custom rules.
Drag & Drop Kanban Board
Build a Trello-style board with drag-and-drop task management.
Real-Time Chat UI
Build a chat interface with message bubbles and typing indicators.
CSS Framework Clone
Recreate a small subset of Tailwind or Bootstrap utility classes.
Full-Stack Projects
Build complete applications from scratch
Blog Platform
Build a full blog with posts, comments, categories, and admin dashboard.
E-Commerce Store
Create a product catalog, cart, checkout flow, and order management.
Task Management App
Build a project management tool with boards, assignments, and deadlines.
URL Shortener
Create a link shortening service with analytics and custom slugs.
Real-Time Polling App
Build a live polling app with WebSocket updates and charts.
REST API with Auth
Design and implement a RESTful API with JWT authentication and CRUD operations.
File Upload Service
Build a file upload API with validation, compression, and CDN integration.
Assignments
Structured tasks to test your understanding
Create a Landing Page
Design and code a landing page for a fictional product. Include hero, features, pricing, and footer sections.
Build a JavaScript Game
Create a simple game (Memory, Tic-Tac-Toe, or Snake) using vanilla JS.
Clone a Website Component
Pick any component from a popular site (Stripe nav, GitHub profile card) and recreate it.
Build an API Service
Create a REST API with at least 5 endpoints, authentication, and error handling.
Full-Stack CRUD App
Build a complete CRUD application with frontend, backend, and database integration.
Deploy a Project
Take any project and deploy it using Vercel, Netlify, or Railway. Set up a custom domain.