How To Publish a Vuetify App with Nginx

Components are a key feature of modern front-end development. A component is a piece of code that usually includes two pieces:

The logic of the component: what the component can do.
The template: how the user will interact with the web application.
Organizing your app into components helps you write modern and robust web applications. JavaScript frameworks, such as React and Vue.js, can help you develop many kinds of components and are widely used by developers.

However, one of the pain points of these frameworks is that you need to create many components, even for simple things like an input text field. Because of that, a more streamlined approach is to use a components library, which has readymade components you can select and use as needed. With a components library, you don’t need to worry about CSS design, colors, sizes, and fonts—you can focus on the functionality.

For Vue.js, there is Vuetify, a Vue UI library based on Material Design principles.

In this guide, you will learn how to create a Vue application and connect the vuetify library to it.

Pre-installation
Nginx – installed on the server
Node.JS is installed at least v14.0.0

Commands used
sudo npm install -g @vue/cli
vue –version
vue create app_name
cd app_name
npm run serve
vue add vuetify
npm run serve

Useful links
VPS/VDS – https://www.mivocloud.com/
VUEJS – https://vuejs.org/