What is Vue.js and how to get Started with it

-


WHAT IS VUE.JS ?

Have you ever came across the techonology named Vue and wondered what exactly it is? 

Vue js is an open source JavaScript framework for building the front end of your website. With the help of Vue, you can create modern looking Single Page Applications (SPA). A SPA have less loading time as compared to a normal website because the pages and components gets loaded all together at the start and that means, a user can navigate through the whole website without reloading the page and that saves quiet a lot of time and enhances the user experience aswell. 

Vue.js was developed by Evan You and it is written in JavaScript. It have a Model-View View-Model architecture. The MVVM architecture seperates the User interface with the back end functionalities of the website. 

The routing in Vue applications are done using the Vue Router libraries which we will discuss in later articles. 

Vue.js have a state management system which can be used for passing data along the components from a single store. Data passing to a from a component can be a hectic task without the used of stores. In Vue.js, state management is handles by Vuex libraries which will be discuessed in later articles. 



GETTING STARTED WITH VUE

For using Vue, you need to install the Vue CLI using your command prompt, but before that, make sure you have Node.js installed on your local computer because Vue relies on Node environment.

If you don't have Node.js installed. You can install it from here

After the Node installation is done, you can move forward and install Vue CLI, for that, open your command promopt and type
npm install @vue/cli -g
and that's it,  you can now use Vue anywhere in your computer. For an example, let us check the Vue version
for that you can type vue --version in your command prompt and it will show you the current vue version installed.

Time to create our first vue project.
Navigate to the directory where you want your project to be created and type
vue create [project_name]. For example vue create blog  and with this, your vue project will get created. In the process of creation, the CLI will ask you several questions to setup the project, just select what you want by pressing the navigation keys on your keyboard.

Have fun with your newly created Vue Project!

Comments

Post a Comment

Popular posts from this blog

What is MVC Architecture ?

-
Image
WHAT IS MVC ARCHITECHTURE ? MVC stands for MODEL - VIEW - CONTROLLER and it is an architecture that seperates different logics of an application. The 3 different logics namely the Model, the View and the Controller have different roles in an application which will be discussed below In short, a View is something a user sees when they log on to the website. View gets generated when a Controller communicates with a Model and sends data recieved .  When a user opens browser and types a website address into the search bar and hits ENTER, the request gets sent to the CONTROLLER gathers the required data needed for the route using the MODEL and then throws the data to the VIEW which then gets displayed to the users. The MCV architecture can be used with many different programming languages like ASP.net , JavaScript and PHP. But here specifically, we will discuss things based on PHP and to be more precise, Laravel, A PHP framework. If you want to learn about some other programming language, d
Read more

Getting started with Laravel | Laravel Part - I

-
Image
WHAT IS LARAVEL ? Laravel is a PHP framework. It is an MVC framework that is designed to ease your backend efforts and to minimize the keystrokes and maximize the output. With Laravel, you don't have to write several lines of codes just to achieve a simple task as you do in Vanilla PHP. For example, in PHP if one wants to fetch all the results from the database, they have to write code similar to one below  notice the number of keystrokes and a mess it would be to query multiple databases in multiple lines. Thankfully, Laravel got us covered. In Laravel the same thing can be done in a much simpler way as below  With just that, we fetch all the content of our "Table". The table keywork in the above snippet is the Model reference.  You can read more about Models here GETTING STARTED WITH LARAVEL Setting up Laravel is pretty simple, but for that, you need to have Composer installed on your computer.  After installing composer, you need to make sure that you have a local ser
Read more