Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/webfansplz/vuejs-challenges

Collection of Vue.js challenges
https://github.com/webfansplz/vuejs-challenges

challenges vuejs vuejs-challeges

Last synced: 1 day ago
JSON representation

Collection of Vue.js challenges

Awesome Lists containing this project

README 

        









Collection of Vue.js challenges






English | 简体中文




## 📖 Introduction



I love `Vue.js` ♥️. It's so Awesome 🚀. It helps me finish my work well and build applications.



I was looking for a project for everyone to learn `Vue.js` together, and that's why this project was born. I believe we can grow together here, and hope it helps you.



This project is aimed at helping you better understand `Vue.js`, writing your own utilities, or just having fun with the challenges.    



We are also trying to form a community where you can ask questions and get answers you have faced in the real world - they may become part of the challenges!



## ✏️ Challenges



> Click the following badges to see details of the challenges.



1
1・Hello World 

13
2・ref family 3・losing-reactivity 4・writable-computed 5・watch family 6・shallow ref 9・Dependency Injection 10・Lifecycle Hooks 11・Next DOM update flush 13・DOM Portal 14・Dynamic css values 243・prevent event propagation 305・Capitalize 323・Prop Validation 

14
7・Raw API 8・effectScope API 12・Optimize performance directive 15・useToggle 16・until 17・useCounter 18・useLocalStorage 19・v-focus 20・v-debounce-click 21・functional component 25・useMouse 27・Global CSS 218・render function[h()] 232・Key Modifiers 

5
22・custom element 23・custom ref 24・v-active-style 26・v-model 208・Tree Component 
By Tags
#Built-ins13・DOM Portal 12・Optimize performance directive #CSS Features14・Dynamic css values 27・Global CSS #Components13・DOM Portal 323・Prop Validation 21・functional component 218・render function[h()] 208・Tree Component #Composable Function15・useToggle 17・useCounter 18・useLocalStorage 25・useMouse #Composition API2・ref family 3・losing-reactivity 4・writable-computed 5・watch family 6・shallow ref 9・Dependency Injection 10・Lifecycle Hooks 8・effectScope API 23・custom ref #Directives305・Capitalize 12・Optimize performance directive 19・v-focus 20・v-debounce-click 24・v-active-style 26・v-model #Event Handling243・prevent event propagation 232・Key Modifiers #Global API:General11・Next DOM update flush #Lifecycle10・Lifecycle Hooks #Reactivity:Advanced6・shallow ref 7・Raw API 8・effectScope API 23・custom ref #Reactivity:Core2・ref family 4・writable-computed 5・watch family #Reactivity:Utilities3・losing-reactivity #Utility Function16・until #Web Components22・custom element 



## 🤝 How to Contribute



There are several ways you can contribute to this project



- Share your answers/solutions

- Propose new challenges

- Add more test cases to the existing challenges

- Provide learning resources or ideas of how to solve challenges

- Share the problems you have faced in real-world projects, regardless you have the solution or not - the community would help you as well.

- Help others by discussing issues



Just [open an issue](https://github.com/webfansplz/vuejs-challenges/issues/new/choose) and choose the corresponding template. Thanks!



## 🌸 Credits



This project is highly inspired by [type-challenges](https://github.com/type-challenges/type-challenges) ♥️.



[vuejs/repl](https://github.com/vuejs/repl) makes this project possible ♥️.



## 📄 License



[MIT LICENSE](./LICENSE)