Download the PHP package lummy/laravel-vue-api-crud-generator without Composer
On this page you can find all versions of the php package lummy/laravel-vue-api-crud-generator. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download lummy/laravel-vue-api-crud-generator
More information about lummy/laravel-vue-api-crud-generator
Files in lummy/laravel-vue-api-crud-generator
Package laravel-vue-api-crud-generator
Short Description Creates a basic skeleton for a CRUD app in both Laravel & Vue.js single file components.
License MIT
Informations about the package laravel-vue-api-crud-generator
Laravel Vue API Crud Generator
Overview
A Laravel package that lets you generate boilerplate code for a Vue.js/Laravel app. Simply enter the name of a database table and based on that it will create:
- A Laravel model
- A Laravel controller (with get, list, create, update, delete as well as validation based on a chosen DB table)
- Laravel routes (get, list, create, update, delete)
- 2 Vue.js single file components to create, update, list, delete and show (using Vform & axios)
This package aims to speed up the process of communicating between backend (Laravel) and frontend (Vue.js).
Installation
composer require lummy/laravel-vue-api-crud-generator
Usage
Firstly you should create a new migration in the same way that you usually would. For example if creating a posts table use the command
php artisan make:migration create_posts_table
Then in your migration file add your fields as usual
Then run the migrate command to create the posts table
php artisan migrate
Once you have done that you just need to run one vueapi
command. Add the name of your table to the end of the command so in this case it's posts.
php artisan vueapi:generate posts
This will then generate all the files mentioned above.
Once you have run this command, using the posts
example above, it will create the following boilerplate files:
Routes
Based on a posts
DB table it will produce these routes
Controller
Based on a posts
DB table it will produce this controller
Model
Based on a posts
DB table it will produce this model
Vue (List template)
Based on a posts
DB table it will produce this Vue.js list single file component (Posts-list.vue)
Vue (Single template)
Based on a posts
DB table it will produce this Vue.js single file component (Posts-single.vue)
Configuration
Here are the configuration settings with their default values.
To copy the config file to your working Laravel project enter the following artisan command
php artisan vendor:publish --provider="lummy\vueApi\vueApiServiceProvider" --tag="config"
model_dir
Specifies the location where the generated model files should be stored
controller_dir
Specifies the location where the generated controller files should be stored
vue_files_dir
Specifies the location where the Vue single file templates should be stored
vue_url_prefix
Specifies what prefix should be added to the URL in your view files. The default is /api
ie /api/posts
routes_dir
Specifies the location of the routes directory
routes_file
Specifies the name of the routes file
Customising the templates
If you use another frontend framework such as React or you want to adjust the structure of the templates then you can customise the templates by publishing them to your working Laravel project
`php artisan vendor:publish --provider="lummy\vueApi\vueApiServiceProvider" --tag="templates"``
They will then appear in
\resources\views\vendor\vueApi
Variables in the templates
Each template file passes a data array with the following fields
$data['singular']
The singular name for the DB table eg Post
$data['plural']
The plural name for the DB table eg Posts
$data['singular_lower']
The singular name for the DB table (lowercase) eg post
$data['plural_lower']
The plural name for the DB table eg (lowercase) eg posts
$data['fields']
An array of the fields that are part of the model.
- name (the field name)
- type (the mysql varchar, int etc)
- simplified_type (text, textarea, number)
- required (is the field required)
- max (the maximum number of characters)
Other things to note
I have only tested this on Laravel MYSQL driver so I'm not sure if it will work on other databases.
In Vue.js files the routes are presumed to be: using the posts example. You can easily configure these from the templates generated
/posts (Posts-list.vue) /posts/{id} (Posts-single.vue)
Please feel free to contact me with any feedback or suggestions https://github.com/aarondo