Integration of Adminator into Laravel 6.x/7.x/8.x with RTL support

Related tags

Starter Projects css sass php laravel admin html5 dashboard es6 laravel-mix adminator
Overview

Laradminator

Laravel PHP Framework with Adminator as admin dash

Setup:

All you need is to run these commands:

git clone https://github.com/kossa/laradminator.git

cd laradminator

composer install # Install backend dependencies

sudo chmod 777 storage/ -R # Chmod Storage

php artisan storage:link # Enable link to storage

cp .env.example .env # Update database credentials configuration

php artisan key:generate # Generate new keys for Laravel

php artisan migrate:fresh --seed # Run migration and seed users and categories for testing

yarn install # or npm i to Install node dependencies(>= node 9.x)

npm run production # To compile assets for prod

Demo:

Note: Username: [email protected] Password: 123456

All the data are reset each 30mn ;) please d'ont forget to remove this function in your app

Included Packages:

Laravel (php):

JS plugins:

Page size optimization:

  • Using Laravel Mix, all CSS and JS are in minified to one file each.
  • Laradminator leverages browser caching, using .htaccess file from html5-boilerplate
  • GZip compression is activated by default(APP_DEBUG=false => only onfile for js, and one file for css).
  • app.css: 107 KB with gzip (943 Kb without)
  • app.js : 427 KB with gzip (1.4 Mb without)

Note: If you're using Nginx check: server-configs-nginx

alt text

RTL support

Uncomment this line and you have the RTL version

alt text

How can I use custom CSS and JS ?

The current architecture of assets are inspired from adminator, so all assets(css and js) are located in resources. if you want to add new component, like select2 juste create file like resources/js/select2/index.js, and don't forget to load it in bootstrap.js

If you want to update the CSS, you can put them directly in resources/sass/app.scss or create new file under resources/sass and import it in resources/sass/app.scss

VERY IMPORTANT: Any change you make on resources you have to run : npm run dev or npm run prod.

If you have a lot of changes it's much better to run: npm run watch to watch any changes on your files, take a look on browersync

Create new CRUD

Creating CRUD in your application is the job you do most. Let's create Post CRUD:

  • Add new migration and model : php artisan make:model Post -m

  • Open migration file and add your columns

  • Create PostsController : php artisan make:controller PostController. fill your resource (you can use UserController with some changes) or, if you are a lazy developer like me, use a snippet and make only 2 changes

  • Duplicate resource/views/admin/users folder to posts, make changes in index.php, create.blade.php, edit.blade.php

Move Image and file ?

To move images im using a helper function based on intervention/image and variables.php

you can check full example in User.php

Do you have question ?

Not hesitate, open new issue ;)

License

Laradminator is licensed under The MIT License (MIT). Which means that you can use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the final products.

Comments