1. vuejs-quick-start

Vue.js Quick Start

Vue.js is a progressive JavaScript framework for building user interfaces. It is highly modular and lightweight, making it a great choice for both small and large-scale projects. In this quick start guide, we will cover the basic steps required to get started with Vue.js.


There are different ways to use Vue.js in your project, but the most common approach is to include it in your HTML file using a script tag. Here's the basic syntax for using Vue.js:

<!DOCTYPE html>
  <title>My Vue.js App</title>
  <script src=""></script>
  <div id="app">
    {{ message }}

    var app = new Vue({
      el: '#app',
      data: {
        message: 'Hello, world!'


In the above syntax, we are creating a simple Vue.js app that displays a message on the page. Here's a breakdown of what's happening:

  • We include the Vue.js library using a script tag.
  • We create a new Vue instance and mount it to the #app element on the page.
  • We define a data object that contains a message property that we want to display.
  • We use curly brackets with the message property to display its value on the page.


When you open the above HTML file in a browser, you should see the message "Hello, world!" displayed on the page.


Vue.js uses a reactive system to update the view based on changes in the data. In the example above, we define a data object with a message property. When the Vue instance is created, Vue.js sets up a watcher for the message property, so any changes to the property will automatically update the view.


Vue.js can be used for building complex user interfaces, web applications, and SPA (Single Page Applications). It is highly pluggable and integrates well with other libraries and frameworks.

Important Points

  • Vue.js is a progressive framework, which means it can be used for small and large-scale projects.
  • Vue.js uses a reactive system to update the view based on changes in the data.
  • Vue.js supports a wide range of plugins and extensions, making it highly pluggable.
  • Vue.js provides a simple, yet powerful API for building complex user interfaces.


Vue.js is a lightweight and modular framework for building user interfaces. In this quick start guide, we covered the basic syntax and usage of Vue.js. With its reactive system, simple API, and pluggability, Vue.js has become a popular choice for building modern web applications and SPA.

Published on: