Vue + Tailwind CSS | Web App Development From Scratch (Part 1/5)

Project development on Vue Composition API from scratch.

X - https://twitter.com/igorbabko

🧪 Repository: https://github.com/igorbabko/ontrack
🧪 Source code for every lesson: https://github.com/igorbabko/ontrack/commits/main

🌐 Final application: https://ontrack.igorbabko.com

🪄 My VS Code Setup: https://www.youtube.com/playlist?list=PLXDouhCU5r6q10ef9yXxzY4GwVpAQMvsZ

🧪 Repository with my VS Code settings: https://github.com/igorbabko/vscode-setup

🎨 VS Code theme: https://marketplace.visualstudio.com/items?itemName=JoseMurilloc.aura-spirit-dracula
🎨 VS Code icons: https://marketplace.visualstudio.com/items?itemName=PKief.material-icon-theme
✍️ Font: https://philpl.gumroad.com/l/dank-mono

🍿 Playlist: https://www.youtube.com/playlist?list=PLXDouhCU5r6qc1BmiaG8eAqnbEt2BS90c

👀 Other courses:
Builds with Vite: https://www.youtube.com/playlist?list=PLXDouhCU5r6qxq4Ad3bXpzJEQtRvMKuST
VS Code Productivity | My Hot Keys: https://www.youtube.com/playlist?list=PLXDouhCU5r6q0XQ-njGmDqA3LVA04Io5D

#vue #vuejs #vue3 #tailwindcss #tailwind

🕛 Time codes:
00:00 - 1. Installing Vite / Vue / Tailwind CSS
09:47 - 2. Header template
18:23 - 3. Nav template
26:20 - 4. v-for directive
32:05 - 5. Dynamic component
35:08 - 6. Header and nav components
41:36 - 7. Attribute inheritance
47:10 - 8. Highlighting current nav item
53:44 - 9. Page hash normalization
58:58 - 10. Page navigation
01:10:42 - 11. Header links
01:17:28 - 12. Module with functions
01:20:00 - 13. Timeline hours
01:23:48 - 14. Generating timeline hours
01:28:32 - 15. Timeline item component
01:34:18 - 16. Select box
01:41:56 - 17. BaseSelect and BaseButton components
01:49:21 - 18. Props config
01:53:50 - 19. Props validation
02:00:10 - 20. Validators module
02:03:57 - 21. Event validators
02:11:33 - 22. Validating timeline items and select options
02:16:41 - 23. Handling select box changes
02:23:02 - 24. Computed property
02:35:32 - 25. TimelineHour component
02:41:16 - 26. Activities page markup
02:47:52 - 27. Activity item component
02:53:25 - 28. Activity validators

Тэги:

#vue #vuejs #vue_3 #vue_composition_api #vue_tutorials #vue_for_beginners #tailwind #tailwind_css #tailwindcss

Скачать видео