How to integrate VUE JS with LARAVEL | Simple steps to vue in laravel project
Why developers use vue js in laravel
In this article we will learn how to integrate vue js with laravel . Now a days vue js is a trending javascript framework for frontend development . vue js is getting more popular day by day. Laravel which is also one of the most popular and trending PHP framework for front-end and back-end sever side programming language allows to integrate vue js in it .
As many people does not know about vue js and also for beginners who starting their projects using laravel and want to implement vue js in it faces lots of problem . when i started to use vue js with laravel , i also spend a lots of time on google to find how to do it after a lot of research finally i got the solution . i was thinking it will be difficult for integrating vue with laravel but it freaking easy . so lets see how can we integrate vue js with laravel. You just need to follow the following steps carefully .
Steps to use vue in laravel
- create a laravel project using cmd :
use the following command to create your laravel project .
composer create-project --prefer-dist laravel/laravel project-name
It might take some time upto 3-4 minute according to your internet connection . Then use the following command to get inside your project directory .
cd project-name
- Opening project in text editor
After successfull installation of laravel , open your project in any of your tet editor . i personally use sublime text editor , it absolutely depends on you what editor that you will use .
- Checking Vue is Available or Not?
This is where our integration part comes .we need to check if vue dependencies is by default provided by laravel or not . We can check this in Package.json file .
Inside package.json check if vue dependencies is available or not . As you can see in the following image, axios , laravel-mix , sass are already available in devDependencies section but vue is not available . So we need to install it .
- Commands to install vue in laravel
open your project directory in cmd and enter the following commands one by one
1 - composer require laravel/ui --dev
2 - php artisan ui vue
3 - npm install (This command might take some time)
- Check Vue installed or not ?
To check whether all the vue dependencies installed inside our laravel project or not we basically need to check two files
1 - project->resources->js->App.js
2 - project->package.json
In the App.js file should be like the following image with some basic vue codes
In the package.json vue dependencies should be implemented like the following
Now you are ready to start laravel with vue .If you want to knoe how can we upload files in larave you can click here . Thanks for reading this article.
Also Read --
How to use Laravel SweetAlert
Laravel Pagination
How to make a covid19 Tracker
Laravel PDF generator tool
Also Read --
How to use Laravel SweetAlert
Laravel Pagination
How to make a covid19 Tracker
Laravel PDF generator tool
