Scroll to top

Creating a Simple Vue.js Project

Creating a Simple Vue.js Project

In this Vue.js series, we are going to have quick view how to create a Vue.js project with few simple steps. Vue.js is Progressive JavaScript Framework, which are modern used and becoming popular.

Why we use Vue.js?

Vue.js is a whole world in its own. As it is Framework, it allows a couple of features for our development. Those features are:

  • Approachable (Start building things in no time)
  • Versatile (An incrementally approachable ecosystem )
  • Performant (Reduced Size)

 

Creating a Vue.js Project:

In order to create a project in Vue.js you have to install the latest stable version of NodeJS and Yarn. Simply, download the setup of these and install them. After installing please run these command npm --version and yarn --version to verify these packages are installed successfully.

After installation of packages, We are going to install the Vue using yarn global add @vue/cli see the documentation. After successful installation, run the command vue --version to verify installation.

Tip: We can create Vuejs project using multiple ways like using npm (npm i vue) and yarn. But i have faced alot of problems using npm so i suggest the beginner to create Vue project using yarn.

To install the Vuejs project, we can use different templates like:

  • Simple (index.html + Vue CDN import ).
  • Webpack Simple (Basic webpack Workflow).
  • Webpack (Complex webpack workflow including testing).
  • Browserify (Browserify Workflows)
  • Vue-CLI (CLI Service is built on top of webpack)

Now we are going to create a project through Vue-CLI, navigate to the directory where you want to create project in cmd and use the command vue create projectname

Now you have to choose the preset:

Choose Manually select features, now Choose the Router and CSS Preprocessor from the list using space and then press enter. Now you will have a simple project in vuejs.

1 comment

  1. It’s a pity you don’t have a donate button! I’d most certainly donate
    to this fantastic blog! I suppose for now i’ll settle for book-marking and adding your RSS feed to my Google account.
    I look forward to new updates and will talk about this site with
    my Facebook group. Chat soon!

Post a Comment

Your email address will not be published. Required fields are marked *