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
You'll learn to use:
- Basic CSS
- Positioning with Flexbox
- Responsiveness with media queries
Grid by Example
You'll learn to use:
- layouts with CSS Grid
GitHub Pages
You'll learn:
- more CSS
- Basic interactivity and effects with Javascript
Hacker News
You'll learn how to:
- Fetch data from an API with Ajax
- Render dynamic data