Reusable Components

4h 10m 42s
English
Paid
October 30, 2024

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.

More

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

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.

Watch Online Reusable Components

Join premium to watch
Go to premium
# Title Duration
1 Intro to Reusable Components 05:00
2 What is Reusability? 09:04
3 Why Reusability is Important 03:14
4 The 6 Levels of Reusability 15:04
5 Templating Pattern 07:40
6 Rule of Three 04:42
7 Dealing with Large Components 03:53
8 Configuration Pattern 06:03
9 When to use Configuration 03:49
10 Prop Explosions 02:43
11 Tearing Everything Apart 06:27
12 Base Component Pattern 09:15
13 Adaptability Pattern 07:01
14 When to use Adaptability 01:52
15 Markup as a First-Class Data Type 03:17
16 Planning for Flexibility 06:45
17 Template Props 03:12
18 Understanding Slots 08:06
19 Inversion and Data (Part 1) 13:36
20 Inversion and Data (Part 2) 07:12
21 Inversion and Data (Part 3) 05:43
22 When to use Inversion 08:29
23 Inversion and Actions 13:28
24 Keeping Things Clean and Tidy 06:36
25 Understanding Scoped Slots 09:02
26 Why are Scoped Slots Upside Down? 07:08
27 Providing a Good Default Experience 05:43
28 Intro to Extension Points 05:20
29 Extension Points (Part 1) 09:09
30 Extension Points (Part 2) 06:32
31 A Note on App Architecture 03:53
32 Extension Points (Part 3) 10:17
33 When to use Extension 05:56
34 Nesting Extension Points Through Component Trees 10:59
35 Default Content at Every Level 07:00
36 When to use Nesting 07:32

Similar courses to Reusable Components

Learn Laravel Vuejs from scratch - Build a TESLA web app

Learn Laravel Vuejs from scratch - Build a TESLA web app

Duration 6 hours 48 minutes 12 seconds
Testing Vue.js Components

Testing Vue.js Components

Duration 1 hour 6 minutes 20 seconds
Master Laravel with GraphQL, Vue.js and Tailwind

Master Laravel with GraphQL, Vue.js and Tailwind

Duration 17 hours 48 minutes 5 seconds
Vue 3 and Laravel: Breaking a Monolith to Microservices

Vue 3 and Laravel: Breaking a Monolith to Microservices

Duration 14 hours 4 minutes 43 seconds
A “Wordle” on Test Driven Development in Vue.js

A “Wordle” on Test Driven Development in Vue.js

Duration 2 hours 48 minutes 45 seconds
Using Vue 2 to Create Beautiful SEO-Ready Websites

Using Vue 2 to Create Beautiful SEO-Ready Websites

Duration 1 hour 48 minutes 11 seconds
PWA with Vue JS, Quasar & Firebase (with NodeJS & Express)

PWA with Vue JS, Quasar & Firebase (with NodeJS & Express)

Duration 14 hours 36 minutes 16 seconds