prepare project with Laravel + AdminLTE + Vue.js

install laravel 5.4 + adminlte-laravel + Vue.js

lojorider lojo
Aug 23, 2017 · 3 min read

Config php.ini

extension=php_openssl.dll
extension=php_pdo_mysql.dll

Create project

run command

composer create-project --prefer-dist laravel/laravel blog "5.4.*"

Setup adminlte package

ref : https://github.com/acacha/adminlte-laravel

run command

composer require "acacha/admin-lte-template-laravel:4.*"

edit config/app.php

'providers' => [
...
Acacha\AdminLTETemplateLaravel\Providers\AdminLTETemplateServiceProvider::class,
];
'aliases' => [
...
'AdminLTE' => Acacha\AdminLTETemplateLaravel\Facades\AdminLTE::class,
];

run command

php artisan vendor:publish --tag=adminlte --force
php artisan make:adminUserSeeder
composer dump

Setup menu

ref : https://github.com/acacha/adminlte-laravel
ref : https://laravelcollective.com/

run command

composer require "spatie/laravel-menu:2.1.5"
composer require "laravelcollective/html:5.4.9"

edit config/app.php

'Html' => Spatie\Menu\Laravel\Html::class,
'Link' => Spatie\Menu\Laravel\Link::class,
'Menu' => Spatie\Menu\Laravel\Menu::class,

run command

php artisan adminlte:menu

Install Excel package (optional) ไม่ต้องทำก็ได้

ref : https://github.com/Maatwebsite/Laravel-Excel

run command

composer require "maatwebsite/excel:2.1.0"

edit config/app.php

'providers' => [
...
Maatwebsite\Excel\ExcelServiceProvider::class,
];
'aliases' => [
...
'Excel' => Maatwebsite\Excel\Facades\Excel::class,
];

image package (optional) ไม่ต้องทำก็ได้

ref : http://image.intervention.io/getting_started/installation

run command

composer require "intervention/image:2.4.1"

edit config/app.php

'providers' => [
...
Intervention\Image\ImageServiceProvider::class,
];
'aliases' => [
...
'Image' => Intervention\Image\Facades\Image::class,
];

run command

php artisan vendor:publish --provider="Intervention\Image\ImageServiceProviderLaravel5"

Install jwt-auth (optional) ไม่ต้องทำก็ได้

ref : https://github.com/tymondesigns/jwt-auth

run command

composer require "tymon/jwt-auth:0.5.12"

edit config/app.php

'providers' => [
...
Tymon\JWTAuth\Providers\JWTAuthServiceProvider::class,
];
'aliases' => [
...
'JWTAuth' => Tymon\JWTAuth\Facades\JWTAuth::class,
'JWTFactory' => Tymon\JWTAuth\Facades\JWTFactory::class,
];

Setup Database

config database : config\database.php

'charset' => env('DB_CHARSET', 'utf8mb4'),
'collation' => env('DB_COLLATION', 'utf8mb4_unicode_ci'),

config .env

config for mysql database not suuport utf8mb4

DB_CHARSET = utf8
DB_COLLATION = utf8_unicode_ci
public function run()
{
$this->call(AdminUserSeeder::class);
//$this->call(UsersTableSeeder::class);
}

run command

php artisan migrate --seed

Seed User (optiona ) ไม่ต้องทำก็ได้

php artisan make:seeder UsersTableSeeder
public function run()
{
$faker = Faker\Factory::create();
App\User::create([
'name' => 'user',
'email' =>'user@project.app',
'password' => bcrypt('123456'),
]);
}
public function run()
{
$this->call(UsersTableSeeder::class);
}

Start Internal Server for dev

run command

php artisan serv

Develop with vuejs watch

ref : https://laravel.com/docs/5.4/frontend

edit file ./webpack.mix.js and comment

// .less(‘resources/assets/less/adminlte-app.less’,’public/css/adminlte-app.css’)

run command

npm install
npm run watch


**** Fast Script

ไม่จำเป็นต้องทำขั้นตอนนี้เลย : No need to do this step.

composer create-project --prefer-dist laravel/laravel blog "5.4.*" &
cd blog & composer require "acacha/admin-lte-template-laravel:4.*" "maatwebsite/excel:^2.1" "intervention/image:2.4.1" "tymon/jwt-auth:0.5.12" "laravelcollective/html:5.4.9" "spatie/laravel-menu:2.1.5"

edit config/app.php

'providers' => [
...
Acacha\AdminLTETemplateLaravel\Providers\AdminLTETemplateServiceProvider::class,
Maatwebsite\Excel\ExcelServiceProvider::class,
Intervention\Image\ImageServiceProvider::class,
Tymon\JWTAuth\Providers\JWTAuthServiceProvider::class,
];
'aliases' => [
...
'AdminLTE' => Acacha\AdminLTETemplateLaravel\Facades\AdminLTE::class,
'Excel' => Maatwebsite\Excel\Facades\Excel::class,
'Image' => Intervention\Image\Facades\Image::class,
'JWTAuth' => Tymon\JWTAuth\Facades\JWTAuth::class,
'JWTFactory' => Tymon\JWTAuth\Facades\JWTFactory::class,
'Html' => Spatie\Menu\Laravel\Html::class,
'Link' => Spatie\Menu\Laravel\Link::class,
'Menu' => Spatie\Menu\Laravel\Menu::class,
];

Run Command

php artisan vendor:publish --tag=adminlte --force & php artisan vendor:publish --provider="Intervention\Image\ImageServiceProviderLaravel5" & php artisan adminlte:menu & php artisan make:adminUserSeeder & 
composer dump

config

edit file .\database\seeds\DatabaseSeeder.php
add $this->call(AdminUserSeeder::class);

public function run()
{
$this->call(AdminUserSeeder::class);
//$this->call(UsersTableSeeder::class);
}

Setup User

Setup Database before migrate (วิธีการอยู่ด้านบน ๆ)

php artisan migrate --seed 
npm install node-sass sass-loader node-less less-loader --save-dev

)
Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade