VueJS

MEVN stack is the open-source JavaScript software stack that has emerged as a new and evolving way to build robust and dynamic web applications. npm install -g @vue/cli # OR yarn global add @vue/cli You can check the version of Vue.js using this command. vue –version Here are the steps to create a MEVN stack … Read more

Here are the steps to create a notification in Vue using Vue-toasted. Step 1: Install Vue.js using Vue CLI Type the following command to install Vue CLI globally. npm install -g @vue/cli # or yarn global add @vue/cli Create a Vue.js project using the following command. vue create vuenotify Step 2: Install Bootstrap 4 Install … Read more

Dropzone.js is an open-source library providing drag-and-drop file uploads with image previews. DropzoneJS is lightweight, doesn’t depend on any other library (like jQuery), and is highly customizable. The vue-dropzone is a vue component implemented on top of Dropzone.js. Here are the steps to upload a file in Vue using vue-dropzone. Step 1: Install Vue.js using Vue CLI. Go … Read more

Here are the steps to implement elasticsearch with Node.js in Vue. Step 1: Install Vue.js We install Vue.js using Vue CLI. So if you have not installed Vue CLI, you can install it using the following command. npm install -g @vue/cli # OR yarn global add @vue/cli Create a new Vue.js project using the following command. … Read more

To create a hover animation in Vue.js, use the “mouseover, mouseout event, and the selected property, which will change the css3 properties and create an animation.” Here are steps to implement hover animation in Vue.js. Step 1: Install Vue.js. npm install -g @vue/cli # OR yarn global add @vue/cli Create a new Vue.js project using … Read more

Here are the steps to create a Vue application with Laravel. Step 1: Install Laravel boilerplate. laravel new vuelaravelcrud Go to the project folder and install frontend dependencies using the following command. npm install Open the project in your editor. I am using Visual Studio Code. code . Set up the database configuration inside the … Read more

Vue is already an excellent Javascript library that allows you to create dynamic frontend applications. Vue.js is also great for single-page applications (SPA).  Vue Router is the official router for Vue.js. It profoundly integrates with Vue.js core to make building Single Page Applications with Vue.js a breeze. Features include: Nested route/view mapping. It is a modular, … Read more

Nuxt.js is a free and open-source web application framework based on Vue.js, Node.js, Webpack, and Babel.js. Nuxt is inspired by Next.js, a framework of similar purpose based on React.js. Nuxt is based on a robust modular architecture. With Nuxt.js, your application will be optimized out of the box. Let’s use Nuxt.js and Laravel together to … Read more

Here are the steps to send an axios get request using vuex in Vue.js. Step 1: Install Vue using Vue cli. Type the following command in your terminal. npm install -g @vue/cli # or yarn global add @vue/cli If you find any installation error, try the administrator mode command. Create a project using the following … Read more

Here are the steps to implement pagination in Vue.js with Laravel. Step 1: Install Laravel. To use Laravel Valet, you can install Laravel using the following command. composer create-project laravel/laravel paginate –prefer-dist Go to your project folder and start the development server with the following command. php artisan serve If you are using Laravel Valet, … Read more

Here are the steps to implement the vue-router loading indicator. Step 1: Install Vue using vue-cli npm install -g @vue/cli # or yarn global add @vue/cli Create a project using the following command. vue create vuerouterprogress Go to your project. cd vuerouterprogress Start the development server with the following command. npm run serve It will … Read more

Here are the steps to use Axios with Vue.js. Step 1: Install Vue.js. If you have not installed the vue cli, type the following command. npm install -g @vue/cli Type the command to generate the Vue project. vue create vueaxiospro It will create a necessary boilerplate for us to work with it. Step 2: Install … Read more

Here are the steps to upload a file using Laravel and Vue.js. Step 1: Install Laravel composer create-project laravel/laravel vuefileupload –prefer-dist After installation, go to the project folder root and type the following command. npm install It installs all the necessary dependencies to build Vue components. Step 2: Configure the database. Add your database credentials … Read more

The vue-resource is a well-known HTTP request library in VueJS. Of course, you can also use axios and jQuery if you want, but today we will attempt HTTP calls using vue-resource. For the backend API, we are using Laravel Framework. For this project, we are using Vue along with vue-router and vue-resource. Here are the … Read more

Routing in Vue is used to navigate the Vue application, and it happens on the client side (in the browser) without full page reload, which results in a faster user experience. Here are the steps to implement vue-router in Vue.js. Step: 1 Create one project. Create one project.  mkdir VueRoute Go to that project and … Read more