Sign in

teaching web dev at https://learnvue.co | sharing my content creation tips at https://mattmaribojoc.com
Photo by Marc Wieland on Unsplash

Let’s speak it into existence. This summer, I will grow my main website — LearnVue.coto over 100,000 monthly pageviews by August 2021. In this article, I’m going to dive into some specific and actionable ways that I intend to make this happen and I hope to give you some ideas for your content strategies, at the same time.

If you’d rather watch a video — here you go…

LearnVue.co’s current traffic

LearnVue.co teaches web programming to thousands of developers every…


The <script setup> type is a proposed change in the Vue’s Git RFCs. To be clear, this is not intended to completely replace any of the current ways to write code. …


Seriously — I doubled my website traffic without writing any new blog posts.

As a matter of fact, I actually ended up with less blog posts now when I started, and we’re going to look at why.

However, more important than SEO…


Photo by Andrik Langfield on Unsplash

In Vue, there are two ways to conditionally render parts of your app: v-if and v-show.

You may be wondering, “Why do we need two ways to this?”

And this is a fantastic question, and definitely one that I had when learning Vue. And the answer is because even though these directives have the similar end results, the way they conditionally show your content works differently.

In this tutorial, we’ll take a look at what conditional rendering is, how v-if and v-show work, and when you should use each one.

Alright, let’s jump right in.

So what even is conditional rendering?

Conditional rendering is the ability…


A Beginner’s Guide to APIs with Vue.js

In this article, we’re going to be making a Kanye West Quote Generator using Axios in a Vue 3 app. Not only are we going to get some deep inspiration from Ye himself, but we’re going to learn how to connect our Vue apps to APIs and even learn how to better organize your Vue project with reusable API calls.

Let’s jump right into the code.

Setting Up Our First Basic HTTP Request

The first thing we have to do is install Axios into…


But safe to say since then, I’ve learned a couple of things about finding your audience online.

Most recently with my site, learnvue.co, i’ve been able to grow to thousands of views a day.

In this post, i want to focus on learnvue’s first month — where it got over 10K views as a brand new website.

But first, let’s…


Vite + Electron quick start guide

Desktop computer on desk
Desktop computer on desk
Photo by Sora Sagano on Unsplash.

Hey, devs!

In this article, we’re going to be taking a look at how to build a Vue 3 desktop project from a Vite app.

To do this, we’re going to be using Electron — one of the most popular frameworks for building cross-platform desktop apps with JavaScript. So many popular apps use Electron, like VS Code, Slack, Twitch, and a ton more.


Here’s the most basic example, whatever we put inside <slot> will be the fallback content if we don’t give any slot content from the parent.

<template>
<div>
<slot> Fallback Content </slot>
</div>
</template>
<template>
<child-component>
Override fallback content
</child-component>
</template>
<div> Override fallback content </div>


As fun as it can be to build everything yourself in Vue, there are so many awesome libraries out there.

Not only can using these libraries make your development process so much faster, but it can also provide better QA because many of these dedicated component libraries have take care of all of the testing for us!

Here’s a list of some of the most useful Vue component libraries that you should know about.

Ready to learn?

Let’s go!

Disclaimer: Unless otherwise noted, these Vue component libraries are NOT currently ready for Vue 3. I definitely recommend checking out each…


Vue Router transitions are a quick and easy way to add some flair to Vue app. They allow you to add smooth animations/transitions between different pages of your app.

When used correctly, they can enhance the user experience by making your app feel more modern and professional.

In this tutorial, we’ll take a look at the basics of using Vue Router transitions and then we’ll cover a couple basic examples to give you some inspiration on where to start.

Here’s one of the four page transitions that we’ll be creating.

Alright — enough talk. Let’s jump right in.

Adding Vue Router Transitions to Your App

Typically, your…

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store