After speaking to seasoned developers, you will quickly realize that the best way to improve your portfolio is by building projects. It is probably the best way to get better, because along the way, you'll be facing challenges that will require research to solve, and that ultimately improves your skills.
We've made a list of 6 HTML and CSS Projects you can practice on and include in your portfolio!
Table of Content
1- Contrast Design Resource Directory
Let's get started with what you'll practice in each of these projects.
1- Contrast Design Resources Directory
You will practice:
- Absolute positioning
- Fetch and loop in Javascript
- Simple CRUD operations
2- Fiber Landing Page
You will practice:
- Absolute positioning
- Flex/Grid
- Creating cards
3- Spense Landing Page
You will practice:
- Absolute positioning
- Flex/Grid
4- Remix Landing Page
You will practice:
- Creating Dark and Light Mode layouts.
- Creating an onboarding process.
- Creating CSS variables. and much more
5- Nested Comments
You will practice:
- Positioning
- Created nested comments
6- Gradie Sign Up Page
You will practice:
- Centering layouts and absolute positioning.
- 50/50 layouts.
If you want to be updated when we release new challenges, follow us on Twitter