How to deploy your Vue app with Netlify in less than 2 min!

Jean-Philippe Fong
Feb 3, 2018 · 3 min read

Netlify is a platform to deploy modern static websites that will help you to easily deploy your Vue app and I will show you how to do it.

Prerequisites

A Vue App

You have your Vue app (If you don’t know how to setup one quickly, check this tutorial!), and now you want to deploy it to show it to other people or the entire world.

A git repository

In order to follow this tutorial, your code must be in a git repository, let’s use GitHub (but you can also use Gitlab or Bitbucket).

Netlify comes into action now. First, head to Netlify and create an account, it’s free!

Create a new site with Netlify

All the further steps can be done thanks to Netlify’s interface.

After having created your account, click on New site from Git.

The main page of your Netlify account

You’ll be transferred to a 3 steps wizard. In the first step, all you have to do is to choose your Git provider between three options: GitHub, GitLab, and Bitbucket.

Choose your Git provider

Then you’ll be able to pick a repository among what belongs to you.

Your repos appears underneath

After that, it’s time to tell Netlify how to build our Vue app.

In the third and last step, we need to fill the build command and publish directory, do as follow, it’s the most important part:

  • for Build command: yarn run build

Then press the Deploy site button, wait that the build finishes and voila, your app is online.

Your site is now live!

What is great is that each time you will push in your selected branch, you will see the result in your URL after it has been build by Netlify. You don’t need to do anything else manually to deploy your app.

You can also choose to have as many URL as branches in your Git repository. That’s really nice when you have many features each sitting on a different branch!

Your site is live with a Netlify URL but if you want, you can also configure a custom URL.


I’m building a Vue ebook with lot of tips! Subscribe here!

VueJoy

Get a slice of vueJS konwledge

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

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