Laravel 5.7 Boilerplate based on Bootstrap 4 and Tabler for Backend.
This is a Bootstrap 4 starter kit site with lite blogging feature, user account registration/management and full Vue Tabler Backend based on Laravel 5.7.
- Frontend demo : https://laravel-boilerplate.okami101.io
- Backend demo : https://laravel-boilerplate.okami101.io/admincp (firstname.lastname@example.org/demo, read-only)
- Bootstrap 4 Frontend with basic home-about-contact and legal mentions pages,
- Slick carousel and Cookie Consent integrated,
- Blog section, including navigation by tags & authors,
- Intervention image for dynamic optimized images with cache plugin,
- Turbolinks included for fast navigation,
- Login throttle by recaptcha & password strength meter,
- Frontend user space and profile management. Email validation included. Registration can be disabled by environment parameter,
- Laravel Socialite included with all supported socialite providers (facebook/twitter/linkedin/github/bitbucket).
- Based on Bootstrap 4 Tabler theme with many useful plugins (SweetAlert2, Flatpickr, CKEditor 5, etc.),
- Entirely written with Vue components thanks to Bootstrap-Vue, absolutely no jQuery dependency,
- Vue-route for instant client-side navigation,
- Native Vue Datatable, with everywhere search input and batch actions features,
- All main CRUD actions are ajaxified,
- Native vue-select component for powerful select system (autocomplete, tags, etc.),
- Excel Export (thanks to Maatwebsite) & Batch actions integrated within DataTables,
- Instant search engine (for posts) thanks to Laravel Scout & TNTSearch.
- User and permissions management (classic users <-> roles <-> permissions structure),
- Impersonation feature for quick user context testing,
- Frontend forms module, including settings (recipients and translatable message confirmation) & submissions management,
- Posts management for frontend blog, with granular publication permissions (classic draft-pending-published workflow). Posts include title, summary, html body, tags, featured image, metas. They can be published and/or unpublished at specific datetime and pinned if needed. Specific user can have limited access to his own posts only, according to his permissions,
- Wysiwyg drag & drop image upload.
- Multilingual ready thanks to Laravel Localization package. Each routes are prefixed by locale in URL for best SEO support. For this boilerplate, EN, FR locales are 100% supported, including translated routes,
- Spanish language added thanks to Codedeep,
- Arabic language with RTL support added thanks to AhmadOf,
- Model Translatable Fields support (JSON format) with Spatie Laravel Translatable, used for metatags and posts,
- Robots and Sitemap integrated, including multilingual alternates,
- Full Metatags manager interface with translatable title & description. Meta entity can be either linked to route or specific entity like post,
- 301/302 redirections manager interface, with CSV import feature.
- Usage of Spatie Laravel Medialibrary package for orderable media model management, used for featured image on posts,
- Permissions configuration based on config file rather than database,
- Form types defined on config file for settings & submission support. This boilerplate include just one "contact form" type,
- Custom webpack integration rather than laravel mix, for better flexibility (cf bellow),
- PHP 7.1
- MySQL 5.7 with JSON support
composer create-project --prefer-dist --stability=dev adr1enbe4udou1n/laravel-boilerplate my-new-project
- Set database and environment variables from .env.example
- Set Web write permission if needed to
- Launch follow commands :
composer install php artisan key:generate php artisan storage:link php artisan migrate [--seed]
# Running this on development environment will throw error so run below command only on production composer install --no-dev --optimize-autoloader php artisan key:generate php artisan storage:link php artisan migrate --force
php artisan scout:import "App\Models\Post"
Laravel Scout takes care of updating posts index on CUD operations.
The first user to register will be automatically super admin with no restriction and will cannot be deletable. Both frontend and backend have dedicated login pages.
- Install dependencies with
yarn devfor compiling assets and start dev-server with HMR enabled (preferred way for fast admin building)
N1 : Use DEV_SERVER_PORT variable to configure local port of Webpack Dev Server,
N2 : Use DEV_SERVER_URL to configure HTTP access to Webpack Dev Server from your host, especially useful if you work on homestead/docker),
N3 : Use
yarn watchif you prefer old school watcher,
N4 : If assets modified, don't forget to launch
yarn prodbefore deploy on production environment.
The mainly difference is that instead of store all permissions into specific SQL table, there are directly defined in a specific config file permissions. SQL side, roles entities relies only to a list of permissions key names.
Indeed i feel this approach better for maintainability simply because permissions are hardly tied to the application with Laravel Authorization. This is anyway the standard way in CMS as Drupal where each module have specific config permission file. Permissions should be only owned by developers.
You will observe that this boilerplate does not use Laravel Mix which is shipped in Laravel for all assets management.
Laravel Mix still stay awesome for newcomers thanks to his laravel-like webpack fluent API, but, even if Laravel Mix can be easily overridden, for this project i preferred use my custom framework-free webpack setup in order to have total control of assets workflow.
For instance, with this custom setup HMR work natively with configurable port (essential for easy vue admin developpement) and productions assets are bundled into specific "dist" directory.
PHP-CS-Fixer & ESLint are used for strong style guidelines for both server and client side code.
PHP is pre-configured for official Laravel styling, just launch
./vendor/bin/php-cs-fixer fix for global project auto-formatting.
Moreover, Official ESLint plugin for Vue.js is included for heavy consistent code through all components vue files.
- Data seeds
- Batch actions
- Form & menu access helpers
- Metas management
- Permissions management
- Form submissions management
- Client validation with vee-validate
- 301 redirection management with CSV/XLS import
- Own account deletion
- Account language & timezone selection
- Account avatar
- Facebook/Twitter/Google Sign in with socialite package
- Blog system (posts, publication date, multilangue, HTML wysiwyg, tags, featured image, medias, public user profile)
- Switch to full Bootstrap 4 for both Frontend & CoreUI Backend
- Migrate to 100% client-side Vue backend with vue-route
- Migrate to Bootstrap-Vue
- Webpack bundle size optimizations
- Get rid of jquery datatables
- Consistent VueJS components code styling
- Switch to Tabler
- Inclusion of unit/featured/browser tests (stand by for now)
This project is open-sourced software licensed under the MIT license.