Vuetify3 (Alpha) + Storybook Vuetify 3 alpha has been released! Here’s a tutorial on how to get Storybook working with it.
Configuring Storybook 6 for Vue 2 + Vuetify 2.3 You probably know this story. You go to start a brand new Vue + Vuetify project. You think, Hmmm… I think I’d like to use Storybook to build and test my components in relative isolation. –me, every time I start a new project (BTW, if you don’t know what Storybook is, the 2-ish minute video […]
Building Packageable Components to Extend Vuetify with TypeScript–Part 6 Welcome to the 6th (and final?) installment of this series. Now that I’m nearing the end I’ve started thinking of this as more of a “short course” than a “tutorial.” If you’d like to follow along from the beginning, please head on over to Part 1. When we left off in Part 5, we had […]
Building Packageable Components to Extend Vuetify with TypeScript–Part 5 Welcome back! If you’re just joining us, it would behoove you to go back and read the earlier installments of this series: Part 1, Part 2, Part 3, and Part 4. In this installment, we’re going to pick up where we left off. More specifically, we want to: Deal with the [Vue warn] message we’ve […]
Building Packageable Components to Extend Vuetify with TypeScript–Part 4 Okay! Down to business. Before we get started writing code, let’s recap how we got here. Part 1 introduced VStripeElements, a component that applies Vuetify styles and interactions to Stripe Elements. Part 2 gave a detailed explanation of the development environment necessary for you to build your own packageable Vuetify extension. Part 3 walked you […]
Building Packageable Components to Extend Vuetify with TypeScript–Part 3 In this post, I’ll walk you through the steps required to build your own custom component that extends Vuetify with TypeScript. Part 1 of this series gave an overview of VStripeElements, a component I built to apply Vuetify styling to the credit card inputs provided by Stripe Elements. In Part 2, we took a deep […]
Building Packageable Components to Extend Vuetify with TypeScript–Part 2 In Part 1 of this series, I introduced VStripeElements, an NPM package that I wrote to be able to use functionality of Stripe Elements with the power and beauty of the Vuetify UI library. Part 1 described the goals and end product of the project, and gave an overview of the project structure. In Part […]
Building Packageable Components to Extend Vuetify with TypeScript–Part 1 Recently I have been working on a project built with Vue.js and the amazing Vuetify Material UI library. I needed the ability to accept payments from users and decided to use Stripe Elements to accomplish this. While Stripe demonstrates that their Elements are highly customizable, actually integrating them with Vuetify was much easier said than […]
Refreshing Google API Access Tokens in Auth0 Apps tl;dr just show me the tutorial! As I’ve written before, I love using Auth0 to provide authentication-as-a-service in the apps that I build. One of the things I love about it is how easy it is to set it up to use 3rd party identity providers (e.g. Google, GitHub, etc.). Not only does it make […]
Authorizing Feathers API Requests for Vue/React/Angular Apps Using Auth0 Recently I’ve been building a progressive web app (PWA) using VueJS as the frontend framework, FeathersJS as the backend API, and Auth0 as my authentication-as-a-service provider. Knitting these three components together turned out to be more difficult and time-consuming than I anticipated–not because it is difficult, but because of some fundamental misconceptions I had about […]
