Vue.js: The Practical Guide

Natalia Tepluhina

Your instructor: Natalia Tepluhina

Workshop includes:

Unfortunately, this workshop is fully sold out! To be notified when we run the workshop again, please join the waiting list below:

Workshop, 5×2h + Q&A • Tue & Wed, September 14–28 2021
09:00 – 11:30 AM PT (Pacific, US) • 18:00 – 20:30 CET (Europe)

According to the State of Javascript 2020 survey, Vue.js is one of the frameworks developers are most interested to learn. If you always wanted to get to grips with it but didn’t know where to begin, this workshop is for you.

Natalia, Vue.js core team member, will teach you how to get started with Vue.js, from setting up the infrastructure to building a full application.

Although Vue has a really nice documentation, it doesn’t cover many practical cases we meet in our everyday work. How do we migrate an application to Vue.js? What’s to keep in mind when dealing with CSS modules and preprocessors? How should we structure components and abstract logic in the Vue app? What about unit testing? And what is this new Composition API and how do we incorporate it into our components? These are some of the questions we’ll tackle in this workshop.

$450 ^.00Register for this workshop →5 × 2h live sessions + Q&A. Sep 14–28.
With all video recordings & slides. Get a ticket.

🎪 Save up to 25% on this workshop with a Smashing Membership.

In this workshop, you’ll learn:

How to migrate your app to Vue.js or select a template if you want to build an app from scratch.
How to architect your application and abstract reusable parts into components or composition functions.
What the Composition API is and when to use it.
What is an optimal way to work with CSS in Vue.
How to use advanced routing techniques like dynamically added routes or navigation guards.
Tricks for Vuex state management.
Alternatives to Vuex if that’s not your cup of tea.
How to unit test your application without testing a framework itself.
Dos and don’ts for your Vue code.

Who is this workshop for?

If you want to start learning Vue.js or if you have already worked with Vue.js and want to get a deeper understanding of it, this workshop is for you. To follow along, you should have a fundamental understanding of HTML, CSS, and JS, as well as a basic understanding of Vue (on the level of “I read some docs and would like to give it a try”).

What hardware/software do you need?

A laptop with an up-to-date copy of Chrome and your favorite text editor.

About Natalia Tepluhina

Natalia Tepluhina is a Vue.js core team member and a Senior Frontend Engineer at GitLab. She is a conference speaker and author of articles on different topics related to Vue.js and she loves to write docs. Natalia is also a Google Developer Expert in Web Technologies.

Time & Schedule

This workshop is split over five days. Our virtual doors open at 8:45, we start at 9 AM PDT. Please mark your calendars:

Tue, Sep 14, 09:00 – 11:30 AM PDT
Wed, Sep 15, 09:00 – 11:30 AM PDT
Tue, Sep 21, 09:00 – 11:30 AM PDT
Wed, Sep 22, 09:00 – 11:30 AM PDT
Tue, Sep 28, 09:00 – 11:30 AM PDT

$450 ^.00Register for this workshop →5 × 2h live sessions + Q&A. Sep 14–28.
With all video recordings & slides. Get a ticket.

🎪 Save up to 25% on this workshop with a Smashing Membership.

Day 1: Essentials

8:45 AM PDT
Virtual doors open, registration, chat, and introductions.

9:00 AM – 11:00 AM We’ll start our first workshop day exploring how to scaffold a new Vue app and how to migrate an existing one:

Starting a new app from scratch with Vue — what to use
- Vue CLI as a common Webpack-based SPA solution
- SSR
- Vite
Migrating to Vue
- Replacing legacy JS/JQuery logic
- Migrating from another framework
Single file components blocks
- Script
  - Options API or Composition API?
  - TypeScript - worth it or not?
- CSS
  - Preprocessors
  - Global styles, scoped styles, CSS modules