Search⌘ K

Hands-on Vue.js: Build a fully functional SPA

0%

1.Commencing the Journey: Introductions and Conventions

What Does This Course Cover?Who Is This Course For?Conventions of the Course

2.Why Use JavaScript Front-end Frameworks?

How Do Traditional Web Pages Work?What is Vue.js?How is Vue.js Better? (Virtual DOM)Quiz on Front-end Frameworks

3.Basic Structure of Vue.js App

Structure Rundown of Vue.js App el: ‘#app’ and .$mount('#app')Data in Vue.js App Methods in Vue.js Vue Instance Lifecycle Lifecycle Hooks Coding Challenge: Vue.js App Structure

4.Vue Directives, Bindings, And Reactivity

Directives Text, Raw HTML, And the Template Syntax Using JavaScript Expressions Computed Properties Conditional Rendering List Rendering Reactive List Rendering and State Class and Style Bindings Quiz on Vue Directives, Bindings, and Reactivity Coding Challenge: Bindings and Reactivity

5.Handling User Input and Event Handlers

Two-way Binding Using v-model Value Bindings Using v-bind Mouse and Keyboard Events Event Modifiers Input Modifiers Quiz on User Input And Event Handlers Coding Challenge: Event Handling

6.Vue Components

Components Basics Single File Components Passing Data to Child Components Using Props Dynamic Props Value Binding And Reusing Components Mixins Listening to Child Component Events Syncing Child Components With Parents Slots Dynamic Components Quiz on Components Coding Challenge: Components

7.Interaction With Backend Server (Database and API)

Getting Data From External API Backend Server and Database Integration Getting Data From Backend Server

8.The Final App

Fully Working Vue.js SPA Conclusion

Assessment

Assessment on Vue.js

Project

Authentication With Vue.js Using Auth0

Hands-on Vue.js: Build a fully functional SPA

Quiz on User Input And Event Handlers

Test your user input and event handling skills by solving the following quiz.

We'll cover the following...

This quiz is utilized to ...