Browse our list of curated database of projects, exercises and lessons to learn HTML and CSS
html-css
layouts
beginner
Replicate this postcard with CSS and HTML
Start projecthtml-css
javascript
sorting-algorithms
intermediate
Practice building algorithms by doing a bubble-sorting algorithm and displaying it on a website
Start projecthtml-css
javascript
the-dom
beginner
Disneyland for procrastinators. Learning Javascript? This excuse generator tutorial takes no more than 20 lines of code and can save you for the rest of your life!
Start projecthtml-css
easy
Learn the most popular HTML Tags and how to used them with real life interactive examples, automatic grading and video solutions
Start exercisehtml-css
javascript
the-dom
easy
Step by step, go over all the most important DOM concepts and methods: Use javascript to manipulate styles, html elements.
Start exercisehtml-css
javascript
vanilla-js
intermediate
Use your DOM knowledge, HTML/CSS and Javascript to create a battleship game for one person only
Start projecthtml-css
git
github
easy
Build website among a team of several collaborators
Start projecthtml-css
hard
Use your CSS knowledge to draw Goku using Position and Display properties.
Start projecthtml-css
javascript
the-dom
beginner
Use your CSS/HTML/JS skills to randomly draw a poker card on every website refresh.
Start projectbootstrap
html-css
layouts
easy
This is an improved version of the first instagram exercise, now using bootstrap.
Start projecthtml-css
javascript
events
easy
Create a simple todo web app using vanilla js
Start projecthtml-css
javascript
vanilla-js
intermediate
Practice building algorithms by doing a selection-sorting algorithm and displaying it on a website
Start projecthtml-css
web-development
debugging
Debugging css code faster and more efficiently. Save more than 50% of your debugging time when coding CSS.
Read lessonhtml-css
layouts
beginner
Replicate a single instagram post using HTML and CSS
Start projectbootstrap
html-css
easy
A complete tutorial list of small targeted exercises that will show the most usefull things you need to learn about bootstrap
Start exercisehtml-css
layouts
easy
Learn how to build layouts with an interactive and auto-graded tutorial.
Start exercisehtml-css
javascript
events
easy
Practice your entry-level skills in Javascript, The DOM and HTML/CSS by building a Pop Balloons Game.
Start projecthtml-css
layouts
flex-box
easy
Create an eCommerce Product Landing Page using standard HTML/CSS, no bootstrap or any other css framework.
Start projecthtml-css
javascript
Conditions
beginner
Practice conditions, render a profile card based on a series of variables that could change in value during runtime like: username, avatar, etc.
Start projecthtml-css
inputs
forms
HTML Forms, HTML input and HTML text-area are really easy to understand, and they are the ONLY way to make interactive websites without AJAX. These very basic concepts represent 90% of everything you will ever need to know about forms .
Read lessonhtml-css
vanilla-js
intermediate
Build a real life beautiful landing page without any framework and collecting leads
Start projectbootstrap
html-css
forms
beginner
Use Javascript to validate the inputs of an HTML form (on submit)
Start projecthtml-css
layouts
flex-box
beginner
Very simple instagram simulation to understand the basics of CSS and HTML5 and how to use them together to create a website.
Start projecthtml-css
easy
Learn CSS with an interactive and auto-graded tutorial with dozens of exercises.
Start exercisehtml-css
javascript
Form validations, inputs, textarea, date inputs, etc.
Start exercisehtml-css
resume-building
layouts
beginner
Practice HTML and CSS by building your Resume.
Start projecthtml-css
reactjs
javascript
intermediate
Use React and HTTP Fetch to create a Meetup.com clone
Start projecthtml-css
javascript
intermediate
Replicate a professional real-life landing page using bootstrap
Start projectbootstrap
html-css
reactjs
easy
Create a simple landing page using React.js components
Start project