Vue.js

Building a modal with Vue.js and Tailwind CSS

In this tutorial, we’ll walk through how to build a reusable card modal using Vue.js and Tailwind CSS. The component will use Vue.js slots, so you can change the contents of the modal wherever it is used while retaining the open/close functionality and the wrapper design.

Vue Devtools 5.0 Released

Vue Devtools 5.0 is here! Learn about what’s new and improved in the biggest Vue Devtools release yet.

Tiptap is a Rich Text Editor Framework for Vue.js

Tiptap by Philipp Kühn is a renderless and extendable rich-text editor for Vue.js. Where React has slate.js, Tiptap aims to be that style of a framework for Vue.js. Learn more about this project and how you can integrate a highly customizable rich text editor in your Vue.js projects.

Vue Devtools 5.0 Beta is Here

Guillaume Chau, a member of the core Vue.js team, announced Friday that the Vue.js devtools 5.0 beta release it out! Learn about the new features coming to Vue Devtools 5.0, and where to install the extension.

Vue CLI 3.0

Vue CLI is the standard tooling baseline for the Vue ecosystem. It ensures the various build tools work smoothly together with sensible defaults so you can focus on writing your app instead of spending days wrangling with configurations.

Laravel Localization Package for Vue

“Laravel Localization to Vue” is a new package by Stefan Ninic that converts Laravel localization into a format consumable by JavaScript packages like Lang.js, which is a Laravel translator class in Javascript. The package will help you quickly transform Laravel translations into a format consumable by a Vue.js application.

VuePress: A Vue-powered Static Site Generator

VuePress is a minimalistic Vue-powered static site generator from Evan You, the creator of Vue.js. VuePress was built to support the documentation needs of Vue’s projects. By default, the generated VuePress theme comes optimized for technical documentation. Learn more about how you can use VuePress to generate excellent documentation for your technical project.

Testing Vue components with Laravel Dusk

Adding tests to a project is always beneficial for different reasons, but choosing the right strategy can be a struggle for many developers. The problem multiplies itself when you are using different tools or frameworks, and although “having as many tests as you can” sounds like a good idea, at least in theory, in practice this can be very different. In this post, we demonstrate how Laravel Dusk can make feature testing intuitive and easy. Come along and learn how to test Vue comp... Read more…

Building a Vue SPA with Laravel Part 2

In Part 2 of Building a Vue SPA with Laravel, we are going to load async data from a Laravel API endpoint in a Vue component and look at error handling when an API response returns an error.

If you recall, in part one we wired up a Vue single page application (SPA) with Laravel and Vue Router. We are going to build on our SPA foundation by adding async API requests.

Learn How to Write a Vue JS Wrapper Component

A Vue “wrapper” component is a technique used to integrate a 3rd party plugin with Vue by wrapping it in a custom Vue component. The wrapper technique means that you are likely bringing in a library like jQuery and a jQuery plugin. This combination seems to be the most ubiquitous, and it’s my personal preference when I want to use a jQuery plugin inside of a Vue application.

Let’s quickly cover an example of how we might build a wrapper component with a date ran... Read more…