A premium video course on Vue components

Reusable Components

Write less code.
Get more done.

Screenshot of a course videoScreenshot of a course videoScreenshot of the course websiteScreenshot of the course website

Master the art of writing highly reusable Vue — and make the most of your components.

Reusable Components is all about how to make your components more flexible and reusable, saving you time and effort and helping you to get more done with less code.

You'll go through in-depth lessons that cover the 6 Levels of Reusability, a framework for thinking about and understanding reusability in Vue.

It's a full-length video course covering:

  • Best practices for using props — and what to do when there are too many
  • Leveraging slots in unique ways to maximize flexibility without the headaches
  • The tradeoffs between different patterns, how to use them, and why they work

Hi, my name is Michael Thiessen

I'm a speaker and author, and my mission is to help developers master Vue, going far beyond the basics.

I'm most well-known for my blog, where I write all about Vue. My articles have been read over a million times in the last year alone!

But I've also spoken three years in a row at VueConf Toronto, spoken at Vue meetups, and appeared on several podcasts including Enjoy the Vue and Views on Vue.

I created the extremely well-received course, Clean Components, and now I'm back at it with Reusable Components!

Reusability is not just for component libraries

When you think of "reusability", you probably think of component libraries — a collection of components like buttons and sliders and checkboxes, that will be used dozens or hundreds of times throughout a single application.

But reusability is also important for the more custom made components in your application.

Reusing a component even two or three times saves a lot of effort and makes you more effective.

Plus, once you understand reusability more deeply you'll start to see opportunities for applying it all over your codebase.

This course isn't like any other course.

Most courses teach you syntax and how the API works. Things that you can probably learn on your own by reading the docs (if you have the time for that).

This course focuses on teaching you insights.

On getting you to think differently about your code, and understand how it works in a totally new way.

I spent months developing a framework for thinking about reusability in Vue

I drew on my years of experience building highly reusable components and component libraries, and came up with the 6 Levels of Reusability that this course is based on.

This framework is necessary for understanding reusability deeply. It gives us a way to talk about these concepts in a very organized and detailed way.

But these aren't laws of the universe.

I invented this framework in order to teach reusability to you. Perhaps there is a 7th level that I missed?

No fluff, no filler. Only what you need to master reusability

I hate wasting your time.

So I spent months agonizing over the outline, reworking it over and over again to make sure it only included what was absolutely necessary for you to master reusability.

In fact, I started to record the first few videos of this course, only to realize it wasn't good enough yet. So I went back again, reworking the course and how it flowed to make sure it was as good as it could be.

Your time is valuable — finish it in only two weeks of lunch breaks (or less)

This course isn't terribly long — it only takes a few key insights to get a whole lot better at writing reusable components.

So you can easily finish this course in 30 minutes a day for two weeks.

Or, if you're really ambitious, go through it in a single day.

(Although I would recommend taking more time with it, so that these concepts have a chance to really sink in)

There's no risk in buying now — get a full refund if you don't like the course

If you go through the course and find it's not for you, no worries.

Just email me at michael@michaelnthiessen.com and I'll give you a full refund.

There's no reason not to grab the course and dive into it today!

(Refund must be requested within 30 days of buying the course)

The 6 Levels of Reusability

It's incredibly difficult to talk about concepts without first giving them names.

So in order to create this course, I first had to invent a way of talking about reusability in components.

Here are the six levels of reusability:

1. Templating — Reusing code by wrapping it up inside of a component

2. Configuration — Using configuration props to allow for varying behaviour

3. Adaptability — Allowing components to become future-proof

4. Inversion — Letting other components control the process

5. Extension — Using reusability throughout our component

6. Nesting — Creating powerful hierarchies of components

Some previews of the course

The 6 Levels of Reusability (Module 1, Lesson 2)

Configuration Pattern (Module 3, Lesson 1)

Planning for Flexibility (Module 4, Lesson 4)

Understanding Scoped Slots (Module 5, Lesson 7)

Course Outline

Module 1: Intro to Reusability

  1. Intro to Reusable Components
  2. What is Reusability?
  3. Why Reusability is Important
  4. The 6 Levels of Reusability

Module 2: Level 1 — Templating

  1. Templating Pattern
  2. Rule of Three
  3. Dealing with Large Components

Module 3: Level 2 — Configuration

  1. Configuration Pattern
  2. When to use Configuration
  3. Prop Explosions
  4. Tearing Everything Apart
  5. Base Component Pattern

Module 4: Level 3 — Adaptability

  1. Adaptability Pattern
  2. When to use Adaptability
  3. Markup as a First-Class Data Type
  4. Planning for Flexibility
  5. Template Props
  6. Understanding Slots

Module 5: Level 4 — Inversion

  1. Inversion and Data (Part 1)
  2. Inversion and Data (Part 2)
  3. Inversion and Data (Part 3)
  4. When to use Inversion
  5. Inversion and Actions
  6. Keeping Things Clean and Tidy
  7. Understanding Scoped Slots
  8. Why are Scoped Slots Upside Down?
  9. Providing a Good Default Experience

Module 6: Level 5 — Extension

  1. Intro to Extension Points
  2. Extension Points (Part 1)
  3. Extension Points (Part 2)
  4. A Note on App Architecture
  5. Extension Points (Part 3)
  6. When to use Extension

Module 7: Level 6 — Nesting

  1. Nesting Extension Points Through Component Trees
  2. Default Content at Every Level
  3. When to use Nesting
The way you laid out the use case for scoped slots was perfect. I was having a very similar issue and my brain was hurting trying to find a clean solution for that. Not only did you solve that problem but also helped me organize the things I already know in my head.
Ayhan
I thought I knew all there was to know about reusable components but after finishing the templating section (particularly the Rule of Three lesson), my eyes were opened.
Miko
This course is very informative, exceptionally well structured, and with excellent examples. Now I have a lot of ideas for refactoring some of my old code.
Michael is an excellent teacher. He clearly explains each step in building reusable Vue components, and when those concepts should be implemented.

Anyone who is interested in a more maintainable Vue codebase would benefit from this course.
Michael does a fantastic job explaining the complex topic of scoped slots in a way that I'm sure is straightforward to understand by all levels of Vue.js developers. You'll learn everything you need to know about slots to build highly reusable components.
Markus Oberlehner
I recently purchased Reusable Components, and it's great!
Victor Martins Onuoha
An amazing course which explained some of the advanced Vue concepts so clearly (especially the inversion/scoped slot module).
Tushar Tyagi
Your ideas about sending data “wherever I want (within the hierarchy of components) just blew me away
Doug Franklin
This was one of the best courses I bought so far :)
Dávid Rehak
I really appreciated your style of teaching and I am absolutely satisfied with the course. I realized that the code I am currently writing is not that far from your teachings. This reassured me.
Pierpaolo Calanna
This course is a very powerful tool to improve your Vue Skills, with creative component patterns, use cases, and more. He takes us to another level of knowledge of Vue development. Fully recommended.
Claudio Polo

Frequently Asked Questions

Is this course for me?

If you're pretty comfortable with Vue and want to dig deeper, this is for you.

It assumes that you are familiar with Vue, and is not a beginner course.

Are there subtitles / closed captioning?

Yes! Every video has English subtitles so you can read along as we go through the material.

Is this course awesome?

Obviously I think it's pretty dope! That's an easy one.

Are there speed controls?

Absolutely! I usually watch videos faster, and some find that I talk slow, so you can watch at a faster speed — or slower speed — if that's more comfortable for you.

Can I get a discount?

Why yes! If you get your manager or boss to buy a set of licenses for your entire team, you can get your copy of the course for free. It's a win-win situation!

How can I get a set of team licenses?

If you want to get 5 or more licenses, just email me at michael@michaelnthiessen.com and I'll get you set up with a bulk discount.

5-9 licenses gets you a 25% discount, and 10 or more gets you a 35% discount.

Do you have student discounts?

No I don't, sorry!

Do you do purchase power parity?

Yes I do! If you're in a country with less purchasing power than the US, you will see a discount applied below.

What is your refund policy?

You can get your money back if you don't like the course, for any reason at all. But you must do this within the first 30 days.

Still not sure?

💰 There's a 30-day money-back guarantee 💰

If you aren't happy with the course, I'll give you a full refund.

All you need is proof that you've actually gone through the material. If you didn't learn from the course, I'll be happy to give your money back.

Just email me at michael@michaelnthiessen.com and I'll sort you out.

Which package will you choose?

Essentials
Just the basics to get you started
  • The first 3 modules of the course
  • Subtitles on all videos
★★★ Mastery ★★★
Take your Vue development skills to the next level
  • All 7 modules of the course → outline
  • 37 video lessons produced at 4k 60 fps
  • Access to all future updates, forever
  • Full source code for each lesson, showing before and after
  • Online web app version of the course
  • Subtitles on all videos
Looking for a team license? Message me on Twitter or email me for details.
🎉 Get 30% off Vue Tips Collection!