4 Websites to recreate to practice your web development skills

by Vincent Will

The best way to learn web development is by practice. But when you get started you might feel lost. There are just so many things to learn, which makes it hard to choose the right project to get started.

In the following I'll share some sites you can recreate to practice some of the basic concepts. I'd recommend to start from scratch and to avoid CSS frameworks in the beginning. Also try copy it without looking at the source code of the website.

DuckDuckGo

duckduckgo screenshot

You'll learn to use:
- Basic CSS
- Positioning with Flexbox
- Responsiveness with media queries


Grid by Example

Grid by Example screenshot

You'll learn to use:
- layouts with CSS Grid


GitHub Pages

Github Pages screenshot

You'll learn:
- more CSS
- Basic interactivity and effects with Javascript


Hacker News

Hacker News screenshot

You'll learn how to:
- Fetch data from an API with Ajax
- Render dynamic data

Don't miss my next post. Drop your email in the box below and get it straight in your inbox.