整理了这23个开源项，初学者可以拿来练习！

作者：Miguel Nunez 译者：前端小智 来源：dev

很多初学者会时不时问我，经常看视频或书之类的教程，但久了没用就很容易的忘记，这个要怎么解？这个真是不好解，因为我也经常这样的，我大都建议多做项目来巩固记忆，但初学者对于比较复杂的项目很不好上手，所以今天分享 25 个初学者的比较容易上手的开源项目，希望对初学者的你们有所帮助，有时间就自己参考事例做一遍，如果没有思路就看源码是怎么实现，相信你会很有收获的。

1. Colors

github: https://github.com/iamcodefox...

线上演示例子：https://iamcodefoxx.github.io...

2. Hex colors gradient

github: https://github.com/iamcodefox...

线上演示例子：https://iamcodefoxx.github.io...

3. Random quote generator

GitHub: https://github.com/iamcodefox...

线上演示例子：https://iamcodefoxx.github.io...

4. The message

github: https://github.com/iamcodefox...

线上演示例子：https://dev.to/codefoxx/25-be...

5. Counter

github: https://github.com/iamcodefox...

线上演示例子：https://iamcodefoxx.github.io...

6. Image carousel

github: https://github.com/iamcodefoxx

线上演示例子：https://github.com/iamcodefox...

image.png

7. Digital clock

github: https://github.com/iamcodefox...

线上演示例子：https://iamcodefoxx.github.io...

8. Calculator

github: https://github.com/iamcodefoxx

线上演示例子：https://iamcodefoxx.github.io...

9. Grocery list

github: https://github.com/iamcodefox...

线上演示例子：https://github.com/iamcodefox...

10. Tip calculator

github: https://github.com/iamcodefox...

线上演示例子：https://iamcodefoxx.github.io...

11. Flashcards

github: https://github.com/iamcodefoxx

线上演示例子：https://iamcodefoxx.github.io...

12. To-do list

github: https://github.com/iamcodefox...

线上演示例子：https://iamcodefoxx.github.io...

13. Sticky notes

github: https://github.com/iamcodefox...

线上演示例子：https://iamcodefoxx.github.io...

14. Timer

github: https://github.com/iamcodefox...

线上演示例子： https://iamcodefoxx.github.io...

15. Math

github: https://github.com/iamcodefox...

线上演示例子：https://iamcodefoxx.github.io...

16. Unsplash API

github: https://github.com/iamcodefox...

线上演示例子：https://iamcodefoxx.github.io...

17. Typewriter

github: https://github.com/iamcodefoxx

线上演示例子：https://iamcodefoxx.github.io...

18. Square cards

github: https://github.com/iamcodefox...

线上演示例子：https://iamcodefoxx.github.io...

19. Weather application

github: https://github.com/iamcodefox...

线上演示例子： https://iamcodefoxx.github.io...

20. Wikipedia API

github: https://github.com/iamcodefoxx

线上演示例子： https://iamcodefoxx.github.io...

21. Marvel API

github: https://github.com/iamcodefox...

线上演示例子： https://iamcodefoxx.github.io...

22. Marvel API

github: https://github.com/iamcodefox...

线上演示例子： https://iamcodefoxx.github.io...

23. Recipe API

github: https://github.com/iamcodefox...

线上演示例子： https://iamcodefoxx.github.io...

原文：https://dev.to/codefoxx/25-be...