Autoplay
Autocomplete
Previous Lesson
Complete and Continue
Vue.js 2 Academy: Learn Vue Step by Step
Introduction & Getting Started
Welcome (2:47)
Visual studio installation (1:51)
What is vue.js and why should i learn it? (2:04)
Vue Basics: Guest List App
Section intro (0:30)
Download project starter (2:32)
Installing Vue.js (3:05)
The Vue Instance & the data object (7:28)
Templates and the virtual DOM (3:31)
Two way data binding with v-model (3:08)
Event handling and methods (5:46)
List rendering (2:54)
Conditional rendering in Vue (5:19)
Binding attributes to elements (4:11)
Binding styles (4:48)
Vue shorthand syntax (2:42)
Outputting text and HTML (6:25)
V-if vs v-show (3:10)
Using javascript expressions (4:23)
Section outro (0:32)
A deeper look at Vue: Guest list app
Section intro (0:39)
Adding a progress bar (7:46)
Computed properties (8:58)
Watchers (3:50)
Key events and modifiers (3:21)
Filters (6:08)
More on looping: keys & index numbers (5:27)
Using multiple Vue instances (6:25)
Looping with objects (6:56)
Adding our navigation links & keys (6:16)
Accessing vue instances externally (4:32)
Vue instance properties and methods (4:50)
Referencing elements with ref (4:45)
Using string templates (7:06)
The Vue lifecycle (5:40)
Vue lifecycle hooks in action (6:51)
Section outro (0:39)
Build Tools & Workflow: Creative Cards App
Section intro (0:37)
Installing Node and NPM (4:08)
Scaffolding projects with the vue cli (8:06)
Exploring our project layout & build tools (9:26)
Using the data object with single file templates (7:49)
Section outro (0:19)
Introduction to Components: Creative Cards App
What are components? (5:07)
Registering global components (10:57)
Registering local components (5:26)
Creating single file components (8:37)
Adding the card front component (9:07)
Emit data to parent components (9:21)
Dynamic components (2:49)
Creating the additional card components (5:53)
Creating the text input component (9:40)
Receiving data from the text input (4:38)
Creating the text output component (3:38)
Passing data with props (5:37)
Keeping components alive (2:26)
Scoping CSS styles (7:40)
Prop validation (5:01)
Passing prop data to a style object (3:19)
Introduction to slots (9:38)
Slot scope and fallback content (4:57)
Named slots (3:30)
Components Continued & Firebase Storage: Creative Cards App
Setting up Firebase (6:55)
Creating the image upload component (6:40)
Uploading images to Firebase (9:44)
Image preview thumbnail (4:11)
Upload progress bar and $emit file data (8:54)
Image output component (9:09)
Downloading images from Firebase (6:15)
Set image button (7:20)
Text options menu-font sizes (8:00)
Text options menu- text alignment (5:03)
Text options menu- font style and weight (9:57)
Remove image button (4:21)
Passing data with callbacks (6:40)
Making images draggable (5:48)
Finishing the CardInsideLeft component (4:50)
Finishing the CardInsideRight component (2:48)
Finishing the CardBack component (3:39)
Introduction to the event bus (7:26)
Sending events to the event bus (6:51)
Thank You
Thank you (1:33)
What is vue.js and why should i learn it?
Lesson content locked
If you're already enrolled,
you'll need to login
.
Enroll in Course to Unlock