Главная страницаКатегория vueVue JS 3: Composition API (с Pinia, Firebase 9 и Vite)

Vue JS 3: Composition API (с Pinia, Firebase 9 и Vite)

Name: Vue JS 3: Composition API (с Pinia, Firebase 9 и Vite)
Price: 12.5 USD
Rating: 5 (31 reviews)

Vue JS 3: Composition API (with Pinia, Firebase 9 & Vite)

udemy

★5 (всего оценок - 31)

Продолжительность

9 ч 10 мин

Категория

Vue

Количество уроков

138 Видео

Дата добавления

23 дек. 2022 г., 17:28

Язык

Английский

Дата выхода

17 июн. 2022 г., 01:00

Дата обновления

29 апр. 2026 г., 16:45

Хотите перейти на Vue 3 и освоить современный подход к разработке? В этом материале мы разберём ключевые особенности курса по Vue JS 3: Composition API и покажем, чем он будет полезен разработчикам, знакомым с Vue 2 и Options API. Этот обзор поможет понять ценность программы и то, каким результатом вы выйдете после её прохождения.

Что вы узнаете из курса

Курс плавно проведёт вас через переход от Options API к современному Composition API, демонстрируя реальные примеры и практику, основанную на опыте автора — независимого разработчика и создателя популярного приложения Fudget.

Понимание ключевых различий между подходами

Начнете с создания простого приложения на Options API, а затем поэтапно преобразуете его в версию на Composition API, чтобы почувствовать разницу в архитектуре и подходе к логике.

Глубокое изучение основ Composition API

Вы освоите фундаментальные концепции, включая:

Работу с реактивными данными через ref и reactive
Использование методов, computed-свойств и watch-наблюдателей
Хуки жизненного цикла во Vue 3
Работу с директивами
Навигацию через Vue Router
Создание и управление дочерними компонентами: props, emits, modelValue
Динамическую смену компонентов
Создание собственных composables и использование библиотеки VueUse
Управление состоянием через Pinia — современную альтернативу Vuex

Практика: создание полноценного приложения

После базовой части курса вы создадите полноценное приложение Noteballs с CRUD-функциональностью. В процессе вы закрепите работу с Pinia, научитесь структурировать логику через composables и увидите, как использовать изученные концепции в реальном проекте.

Результаты прохождения курса

Завершив обучение, вы сможете уверенно строить приложения на Vue 3 с нуля, используя Composition API как основной инструмент архитектуры, а также интегрировать Pinia, Vue Router, внешние библиотеки и Firebase в свои проекты.

Требования к старту

Для комфортного прохождения курса рекомендуется базовое знание Vue 2 и Options API, HTML, CSS и JavaScript.

Это пробный урок. Оформите подписку, чтобы получить доступ ко всем материалам курса. Премиум

Урок 1. 00:08:03
Introduction
Урок 2. 00:05:37
What is the Composition API?
Урок 3. 00:07:45
Editor & Software Setup
Урок 4. 00:02:08
Vue Devtools
Урок 5. 00:01:06
Vue 3 Docs & Install Node.js
Урок 6. 00:02:39
Create a Vue Project
Урок 7. 00:03:44
Project Setup
Урок 8. 00:01:35
Options API - Design
Урок 9. 00:02:00
Options API - Data & Methods
Урок 10. 00:01:28
Convert it to Composition API
Урок 11. 00:03:21
Composition API - Data (refs) & Methods
Урок 12. 00:02:52
Script Setup - An Easier Way!
Урок 13. 00:01:28
Refs
Урок 14. 00:01:32
Two-Way Data Binding
Урок 15. 00:03:00
Reactive Objects
Урок 16. 00:01:21
Non-Reactive Data
Урок 17. 00:03:41
Methods
Урок 18. 00:04:15
Computed Properties
Урок 19. 00:01:33
A Note on Filters
Урок 20. 00:03:42
Watch
Урок 21. 00:04:19
Mounted Hooks
Урок 22. 00:02:01
Activated Hooks
Урок 23. 00:01:32
Updated Hooks
Урок 24. 00:02:13
Multiple Hooks!
Урок 25. 00:03:49
Local Custom Directives
Урок 26. 00:02:51
Global Custom Directives
Урок 27. 00:03:50
$route - Part 1
Урок 28. 00:03:22
$route - Part 2
Урок 29. 00:02:41
useRoute
Урок 30. 00:03:30
useRouter
Урок 31. 00:02:55
Lists (v-for)
Урок 32. 00:03:05
Template Refs
Урок 33. 00:01:52
nextTick
Урок 34. 00:04:24
Teleport - Part 1
Урок 35. 00:03:22
Teleport - Part 2
Урок 36. 00:02:52
Child Components
Урок 37. 00:01:36
Fix Lazy-Loading Views
Урок 38. 00:03:35
Slots
Урок 39. 00:03:52
Props
Урок 40. 00:03:53
Emits
Урок 41. 00:02:25
modelValue
Урок 42. 00:02:39
update:modelValue
Урок 43. 00:02:47
Dynamic Components - Part 1
Урок 44. 00:02:20
Dynamic Components - Part 2
Урок 45. 00:04:11
Provide / Inject - Part 1
Урок 46. 00:03:14
Provide / Inject - Part 2
Урок 47. 00:04:55
What is a Composable?
Урок 48. 00:02:40
Create a Composable
Урок 49. 00:03:27
Use Our Composable
Урок 50. 00:04:16
Reuse our Composable
Урок 51. 00:03:28
Add Composable from VueUse
Урок 52. 00:05:36
What is State Management?
Урок 53. 00:05:03
Composable State vs Vuex vs Pinia
Урок 54. 00:02:42
State - Part 1
Урок 55. 00:05:42
State - Part 2
Урок 56. 00:03:41
Actions
Урок 57. 00:02:43
Getters
Урок 58. 00:02:23
Use our Store Anywhere
Урок 59. 00:02:07
Introduction & Noteballs App
Урок 60. 00:02:15
Create Project
Урок 61. 00:03:03
Router - Install & Setup
Урок 62. 00:04:01
Router - Add Some Routes
Урок 63. 00:01:51
Add RouterView & Navigation
Урок 64. 00:02:20
Router - Tidying Up
Урок 65. 00:03:10
Install Bulma
Урок 66. 00:02:47
Nav Bar - Design
Урок 67. 00:02:55
Nav Bar - Navigation & Logo
Урок 68. 00:05:06
Nav Bar - Responsive Design & Menu
Урок 69. 00:02:05
Pages (Design)
Урок 70. 00:01:52
Notes (Design)
Урок 71. 00:02:31
Add Note Form (Design)
Урок 72. 00:02:38
Notes Array (Ref)
Урок 73. 00:09:01
Add Note Method
Урок 74. 00:02:33
Child Component - Note
Урок 75. 00:01:35
Props (Note)
Урок 76. 00:05:46
Computed (Note Length)
Урок 77. 00:06:25
Delete Note (Emit)
Урок 78. 00:04:21
Pinia - Setup & State
Урок 79. 00:03:41
Use Our Store
Урок 80. 00:03:48
Action - Add Note
Урок 81. 00:02:39
Action (with Parameters) - Add Note
Урок 82. 00:05:16
Action - Delete Note
Урок 83. 00:04:39
Edit Note Page & Route
Урок 84. 00:03:58
Reusable Component - AddEditNote
Урок 85. 00:05:33
Hook up with modelValue
Урок 86. 00:05:05
Fix the Focus
Урок 87. 00:10:33
Custom Color, Placeholder & Label Props
Урок 88. 00:05:36
Getter - Get Note Content (useRoute)
Урок 89. 00:03:10
Getter (with Parameters) - Get Note Content
Урок 90. 00:06:25
Action - Update Note
Урок 91. 00:01:21
useRouter - Redirect to Notes Page
Урок 92. 00:07:34
More Getters & Stats Page
Урок 93. 00:02:08
Directive - Autofocus
Урок 94. 00:02:58
Global Directive - Autofocus
Урок 95. 00:02:11
Watch the Number of Characters (Watch)
Урок 96. 00:04:25
Composable - useWatchCharacters
Урок 97. 00:02:49
Composable - Multiple Parameters
Урок 98. 00:06:11
Click Outside Composable (VueUse, Template Refs)
Урок 99. 00:07:20
Delete Modal Design (Reactive Objects)
Урок 100. 00:05:22
Hide the Delete Modal (modelValue & update:modelValue)
Урок 101. 00:03:35
Delete Modal - Click Outside to Close
Урок 102. 00:06:19
Delete Modal - Keyboard Control (Lifecycle Hooks)
Урок 103. 00:04:58
Delete Modal - Delete The Note
Урок 104. 00:03:30
Introduction to Firebase
Урок 105. 00:01:47
Create a Firebase Project
Урок 106. 00:02:04
Create App & Install Firebase
Урок 107. 00:02:36
Setup Firestore Database
Урок 108. 00:02:24
Connect to Database
Урок 109. 00:07:18
Display Notes from Firestore
Урок 110. 00:07:50
Get Notes in Real Time
Урок 111. 00:06:22
Add Note
Урок 112. 00:02:37
Delete Note
Урок 113. 00:05:06
Update Note
Урок 114. 00:05:33
Order Notes by Date (ID)
Урок 115. 00:05:27
Improve Document Structure & Auto IDâ€™s
Урок 116. 00:09:38
Display Date on Note
Урок 117. 00:04:55
Add a Progress Bar
Урок 118. 00:02:09
Show Placeholder when No Notes
Урок 119. 00:07:30
Login & Register Page - Tabs
Урок 120. 00:08:32
Login & Register Page - Form
Урок 121. 00:03:41
Firestore Authentication & Auth Store
Урок 122. 00:07:06
Register User
Урок 123. 00:02:25
Logout User
Урок 124. 00:03:26
Login User
Урок 125. 00:07:51
Listen for Auth Changes & Store User Data
Урок 126. 00:04:04
Improve Logout Button
Урок 127. 00:05:24
Redirect User on Auth Change
Урок 128. 00:05:43
Restructure Database for Multiple Users
Урок 129. 00:07:19
Setup Refs for Multiple Users
Урок 130. 00:04:13
Clear Notes array in State when user logs out
Урок 131. 00:08:54
Unsubscribe from the Get Notes Listener
Урок 132. 00:03:49
Navigation Guards - Part 1
Урок 133. 00:04:47
Navigation Guards - Part 2
Урок 134. 00:03:31
Firestore Security Rules - Part 1
Урок 135. 00:05:20
Firebase Security Rules - Part 2
Урок 136. 00:06:19
Hosting - Part 1
Урок 137. 00:04:08
Hosting - Part 2
Урок 138. 00:02:23
Bonus Lecture

Автор - udemy

udemy

Udemy - одна из самых больших площадок в мире по доставке обучающего контента от разных авторов всего мира. Присутсвуют курсы практически на любую тему.

+198

Комментарии

Andrew
29 апр. 2024 г., 16:05
update please
Blinks
30 июн. 2023 г., 16:36
Начиная с 21 видео - никакие видео не грузятся
Blinks Blinks
30 июн. 2023 г., 21:10
ага, понял, в лисе не работает, в хроме работает
vadimbelinovich
19 мая 2023 г., 15:11
Видео 59 - Introduction & Noteballs App не загружается