Laravel is a web application framework with expressive, elegant syntax. We believe development must be an enjoyable and creative experience to be truly fulfilling. Laravel takes the pain out of development by easing common tasks used in many web projects, such as:
- Simple, fast routing engine.
- Powerful dependency injection container.
- Multiple back-ends for session and cache storage.
- Expressive, intuitive database ORM.
- Database agnostic schema migrations.
- Robust background job processing.
- Real-time event broadcasting.
Laravel is accessible, powerful, and provides tools required for large, robust applications.
Laravel has the most extensive and thorough documentation and video tutorial library of all modern web application frameworks, making it a breeze to get started with the framework.
Just a simple way to start a laravel vite project with vuejs.
- create new laravel app
$ laravel new laravite-vue3
- cd into the project.
- add in tag head vite
@vite(['resources/css/app.css', 'resources/js/app.js'])
- go to view welcome blade and delete all inside body tag. create a div with id app.
<body class="antialiased">
<div id="app"></div>
</body>
- now lets install vue and plugin vitejs
$ npm i vue@next -D
$ npm i @vitejs/plugin-vue -D
- import vue on vite.config file
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';
export default defineConfig({
plugins: [
laravel({
input: ['resources/css/app.css', 'resources/js/app.js'],
refresh: true,
}),
vue({
template: {
transformAssetUrls: {
base: null,
includeAbsolute: false,
}
}
}),
],
});
- go to resources js folder and create a Welcome.vue file. Just put a welcome text like:
<template>
<h1>Welcome from vuejs</h1>
</template>
- go to resources js folder and open app.js delete all and add:
import { createApp } from 'vue';
import Welcome from './Welcome.vue';
createApp(Welcome).mount('#app');
- open a terminal on project and run:
$ npm run dev
- All set!, now open the app on web browser and you should see thw welcome text from vue.
Happy Coding! 💻 See you all! Bye 👋
Fidel Duran
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent