The Delightful World of Vue.js

5:05:52

What you'll be learning

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!


Your Guides

Matias Ryan Weaver

Buy Access
Login or register to track your progress!

Questions? Conversation?

  • 2020-07-30 Nathan De Pachtere

    Thanks ! Great tutorial ! :)

  • 2020-07-28 Matias Jose

    I'm glad you like it!

  • 2020-07-28 Alberto

    thank's guys, nice tutorial

  • 2020-07-20 Diego Aguiar

    We're on it! We release one new and exciting chapter every day from Monday to Friday

    Cheers!

  • 2020-07-20 Alberto

    Hey guys, release more chapters please! :)

  • 2020-07-02 Diego Aguiar

    Hey Gilson DElrei

    This course it's been actively released, what it means that we deliver one new chapter every day (Monday to Friday). There're 20 chapters left so I would say it will be fully released in one month

  • 2020-07-02 Gilson DElrei

    I'll buy access for this tutorial. Do you've an estimative when will be available completely?

  • 2020-05-29 Matias Jose

    Hi Wilco!

    I'm glad you're liking this tutorial! We're releasing about 1 chapter a day with our current schedule (we try to release a group of Chapters near the start of each week)!

    If you click on "Next Chapter" on the last recorded one, you might also get a sneak peak of what the next unreleased chapter will be (but no video)!

  • 2020-05-28 Wilco

    I can't wait for the next chapters

  • 2020-05-20 weaverryan

    It will be :). MPA's (multi page apps) - traditional apps that have Vue embedded into parts of them are actually trickier in my opinion than an SPA. We wanted to show that.

  • 2020-05-20 Sergiu Popa

    I hope it's MPA, not SPA :)

  • 2020-05-19 Krzysztof Krakowiak

    Great!

  • 2020-05-19 weaverryan

    Monday! :)

  • 2020-05-19 Alberto

    when?????