Example 1: Text | Coding Bootcamps

Autoplay
Autocomplete

Previous Lesson Complete and Continue

Learn Vue.JS framework by examples

1. Intro to Vue.JS

a- Review of Vue.js & Hello World Example
b- Example 2: Hello World in Vue 2

2. Vue Components

a- Example 1: Component scoped (not global)
b- What are components and how to define components?
c- Local, Inline, and Data Registration
d- Events

3. Computed Properties

a- Data vs Computed Properties
b- Computed properties vs watch
c- Computed Setters & v-model

4. Conditional Rendering

a- Syntax & Examples
b- v-if
c- v-else
d- v-show and v-if / v-else

5. Custom Components with v-model

v-model on a counter component

6. Custom Directives

Syntax & Parameters & Examples

7. Custom Filters

Syntax & Parameters & Examples

8. Data Binding

Example 1: Text
Example 2: Raw HTML
Example 3: Attributes
Example 4: Filters

9. Dynamic Components

Example 1: Simple Dynamic Components
Example 2: Pages Navigation with keep-alive

Project- Shopping cart

Project PDF and source files
a- Implementing a shopping list using jQuery
b- Implementing a shopping list using Vue.js
c- Analyzing data binding using developer tools
d- Bringing user input to the data with two-way binding
e- Rendering the list of items using the v-for directive
f- Check and uncheck shopping list items
g- Adding new shopping list items using the v-on directive

Teach online with

Example 1: Text

Lesson content locked

If you're already enrolled, you'll need to login.

Enroll in Course to Unlock