MP4 | Video: h264, 1920x1080 | Audio: AAC, 44.1 KHz, 2 Ch

Genre: eLearning | Language: English | Duration: 48 Lessons (5h 7m) | Size: 1.28 GB

Ready to build an interactive frontend that you'll love! Look no further than Vue.js: a leader on the frontend world and one that you can sink your teeth into, even if JavaScript isn't your main gig. In this tutorial, we'll build a real-world "Products" area for our site using an API-Platform-powered API. Will it be a single-page application (SPA)? Nope! Not in this tutorial - because it turns out, integrating Vue into a "traditional" web app is actually a bit trickier:

Tip

Bonus! Along the way, we'll highlight the few differences needed to make this tutorial work with Vue 3.

Installing & Setting up Vue with Encore (including a nice eslint setup!)

All about the Vue object: let's make it feel boring!

Single file Components (SFCs)

Modular styles

Props, data & state! Ya know, the key to everything

v-bind, v-text, v-on, v-for, v-show: basically all the special v-STUFF!

Communication up the tree with $emit

Making (and organizing) AJAX calls

Organizing your files & adding Webpack "alias" shortcuts

methods, computed properties

v-model (what it really does)

Server-side searching and filtering

Passing data directly from your server to Vue via Twig

Watchers: what, when and when not

By the end of this tutorial, you'll feel comfortable - dare I say confident - in all the Vue basics!