#Day 1: Introduction of Vue || 30 Days of Vue

Rasel Hossain
Vue Expert
Published in
3 min readAug 24, 2021

--

What is Vue.js?

Vue is an open-source progressive javascript framework that is approachable, versatile, and performant. Vue is made for building User Interface and it’s created by “Evan You”.

How do you use it?

This is the simple way to get started working with vue by placing a script tag in the HTML that loads the latest version of Vue from CDN. We can also reference a javascript file (named index.js/ main.js) which would be the file where our Vue code will lives.

After connecting the Vue CDN, now we can create a Vue application by declaring the Vue instance in the main.js.

And the Vue instance is created by declaring the “new Vue({})” constructor.

In here we’ve just used the element option el, to dictate the HTML element with the “id” of “app”. Here I just mount the Vue application with #app

The Vue instance can also return the date that will be shown in our view.

And this data has to be dictated within a data option. let’s declare a test data property that giving a string value of Hello world!

Now we are able to display the value of the test property on the HTML template. But to bind the data value as a text content we have to use double curly bracket {{test}}

Now let’s see the output…

This is easy, isn’t it? In the same way, we can declare other data property that our need

Thank You 🥰🥰

Vue.js Official Doc https://vuejs.org/v2/guide/

--

--