Resources to help you practice web development
Tags: webdev, html, css, javascript
Published: 2021-11-13 00:05:00

Hello everyone! 💙

I remember reading that the best way to be good at web development is to always practice. To practice, you need challenges and ideas for side projects.

In this blog post, I have compiled a list of websites. These websites will provide challenges and ideas for you to practice web development.

let's get started 💃


1.
**FrontendMentor**

**Frontend mentor** helps you tackle HTML, CSS, and JavaScript challenges. It helps you build projects and review the codes of other developers, which will help you grow as a developer.

Once you've completed your project, submit it for review and criticism.  

![frame_chrome_mac_dark (4).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636675054152/qkmNANTXi.png)

Link to Frontendmentor website [https://www.frontendmentor.io]


2.
**Codewel**

**Codewel** helps you improve your HTML and CSS skills with various template designs.

Once you've finished it, submit your project to get feedback on your solutions.

![frame_chrome_mac_dark.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636673454403/Z3S9y8apJ.png)

Link to Codewell website [https://www.codewell.cc]
 

3.
**Coderbyte**

**Coderbyte** helps you improve your coding with algorithms, frontend, backend, and database challenges. It also provides real-world interview kits to help you prepare. 

![frame_chrome_mac_dark (2).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636674186844/fcgJGKteB.png)

Link to Coderbyte website [https://coderbyte.com]


4.
**Freecodecamp**

**FreeCodeCamp** is an online learning platform that helps you learn and build projects.

![frame_chrome_mac_dark (1).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636673840895/_bxMCBLTBf.png)

Link to Freecodecamp website [https://www.freecodecamp.org]



5.
**Codepen**

**Codepen** has weekly challenges for building things to level up your talents. Enroll in them and get picked and featured on the homepage.


![frame_chrome_mac_dark (3).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636674807264/VFHK2EMd5.png)

Link to codepen website [https://codepen.io/challenges]
 

6.
**JavaScript30**

This website organizes a 30 day **vanilla Javascript** coding challenge. With the help of **30 JavaScript tutorials,** you'll be able to build 30 things in 30 days.

Sign up for access to the course dashboard when you visit the website to start your challenge.

![frame_chrome_mac_dark (5).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636675225633/S6qygaO8X.png)

Link to JavaScript30 website [https://javascript30.com]
 

7.
**JavaScript Quiz**

This website contains JavaScript questions with detailed explanations for you to master JavaScript.

![frame_chrome_mac_dark (6).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636675696753/CpHfwenkd.png)

Link to JavaScript quiz website [https://Javascriptquiz.com]


8.
**Devchallenges**

 This website has excellent challenges for frontend and full-stack web developers. These challenges will help improve your skills by solving problems and creating websites.

When you visit the website, choose a challenge, work on it yourself or with a team and submit it to get feedback.


![frame_chrome_mac_dark (7).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636676129090/UsQPzsx_b.png)

Link to Devchallenges website [https://devchallenges.io]


9.
**Codewars**


This website allows you to practice using code challenges to improve your development skills with your friends.


![frame_chrome_mac_dark (8).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636676381060/Jg7NeEI4h.png)

Link to Codewars website [https://www.codewars.com]


10.
**frontendpractice**

This website contains real websites to practice with to improve your front-end skills.

![frame_chrome_mac_dark (9).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636676663049/TZzrnOxW9.png)

Link to Frontendpractice website [https://www.frontendpractice.com]


11.
**Cssbattle**

CSS battle contains CSS challenges to help you level up your CSS skills.

![frame_chrome_mac_dark (10).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636676903295/DxklY1kot.png)

Link to CSSbattle website [https://cssbattle.dev]


12.
**100dayscss**


This website contains daily CSS challenges for 100 days to help you take your CSS skills to the next level.

![frame_chrome_mac_dark (11).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636677079007/_iF0EiXqd.png)

Link to 100dayscss website [https://100dayscss.com]



13.
**Codementor**

This website contains real-world projects to help you improve your programming skills.

![frame_chrome_mac_dark.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636756188730/wNJ7ZElL3.png)

Link to Codementor website [https://www.codementor.io/projects]



14.
**Daily UI**

Daily UI helps you become a better designer in 100 days by working on different challenges.

Once you've completed your project, please post it on dribble or Behance for review and criticism. 

![frame_chrome_mac_dark (1).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636756683612/xWO1pAmkD.png)

Link to DailyUI website [https://www.dailyui.co]



15.
**Codier** 

This website contains different front-end coding challenges for you to practice.

![frame_chrome_mac_dark (2).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636756942231/-zI8cqNp4.png)

Link to Codier website [https://codier.io]
 

16.
**Ace Frontend**

Ace Front-end has complete practical coding challenges for web developers. It also contains a well-detailed walk-through of perfect interview solutions. 


![frame_chrome_mac_dark (3).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636757293057/pqpD5NXKd.png)

Link to Acefrontend website [https://www.acefrontend.com]


17.
**Exercism**

 **Exercism** helps you develop fluency in 55 programming languages. It also provides fun coding exercises that build your understanding of different concepts.


![frame_chrome_mac_dark (4).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636757708063/TdquWWSyv.png)

Link to Exercism website [https://exercism.org]
 

18.
**Fun Javascript** 

This website contains a free series of fun JavaScript, HTML, and CSS projects.


![frame_chrome_mac_dark (5).png](https://cdn.hashnode.com/res/hashnode/image/upload/v1636757976987/r0Sdj80WW.png)

 Link to funJavaScript website [https://fun-javascriptprojects.com]


19.
**CSS Challenges**

**CSS challenges** help you unleash your CSS Skills. It has different options, easy, medium, hard and insane. Choose your level according to your strengths.

![frame_chrome_mac_dark.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1637801009543/F8rkBTXst.png)


 Link to CSS challenges website [https://css-challenges.com]



## CONCLUSION

Thank you for reading  💙. I'm always happy to talk. If you would like to chat or have any questions drop them in the comments. 

If you found this article helpful, please like and share it 💙.

That's all for today! 😁 You reached the end of the article 😍.