White Dashboard Laravel Package

Getting Started

This is a scaffolding preset, not a runtime dependency. You run it once, it dumps Blade views, SCSS, compiled assets, routes and a HomeController into your app, and then you own that code. Everything below follows from that.

Minimal install:

# commit first — the preset overwrites files
git add -A && git commit -m "before preset"

composer require --dev laravel-frontend-presets/white-dashboard

# the command name depends on your Laravel version / package release:
php artisan list | grep -iE 'preset|ui'
# Laravel 7+ era releases:  php artisan ui white-dashboard
# Laravel 5.5–6 era:        php artisan preset white-dashboard

npm install && npm run dev      # or npm run build
php artisan migrate
php artisan serve

Confirm the command with php artisan list rather than trusting a blog post — these presets have shipped both preset and ui entry points across releases, and older docs are everywhere.

Where to look first, in this order:

1. routes/web.php — the preset rewrites it (Auth::routes(['verify' => true]), /home, profile routes). This is your map.
2. resources/views/layouts/app.blade.php — the master layout. Every page extends it.
3. resources/views/home.blade.php — the dashboard: four stat cards (daily sales, subscriptions, tasks, performance), a Chart.js line chart, a table.
4. resources/sass/app.scss — should @import the White Dashboard styles.
5. public/white-dashboard/ — the pre-compiled template CSS/JS/fonts (Bootstrap 4, jQuery, Chart.js, Perfect Scrollbar, SweetAlert).

First use case: get login → /home working end-to-end, then replace one stat card with a real query. That single edit teaches you the layout contract (@extends, @section('content'), @push('js')) faster than reading the whole template.

// app/Http/Controllers/HomeController.php
public function index()
{
    return view('home', [
        'sales' => Order::whereDate('created_at', today())->sum('total'),
        'tasks' => Task::whereNull('completed_at')->count(),
    ]);
}

Implementation Patterns

The layout contract. layouts/app.blade.php yields content and expects stacks for page-specific JS. Stick to it; don't fork the layout per page:

@extends('layouts.app')

@section('title', 'Orders')

@section('content')
  <div class="content">
    <div class="row">
      @include('partials.cards.stat', ['label' => 'Revenue', 'value' => $sales])
    </div>
  </div>
@endsection

@push('js')
  <script src="{{ asset('js/orders.js') }}"></script>
@endpush

Adding a page (the 90% task). Three touchpoints, always:

1. New view under resources/views/, extending layouts.app.
2. Route in routes/web.php inside the auth middleware group.
3. Sidebar entry in resources/views/layouts/navbars/sidebar.blade.php.

The sidebar ships with hardcoded active classes on the demo links. Swap them for route checks immediately or you'll fight "two links highlighted" forever:

<li class="{{ request()->routeIs('orders.*') ? 'active' : '' }}">
  <a class="nav-link" href="{{ route('orders.index') }}">
    <i class="tim-icons icon-bag-16"></i><p>Orders</p>
  </a>
</li>

Turn repeated card markup into components. White Dashboard has three or four card shapes (.card-stats, .card, .card-user, .card-tasks) with fiddly nested divs. Copy-pasting them across ten pages is the main way this codebase rots. Extract resources/views/components/card-stat.blade.php and card.blade.php on day one.

Charts. The dashboard inlines a new Chart(...) call in a <script> block. Move each one into resources/js/ and load via @push('js'), passing series data through @json($series) or a data-* attribute. Inline scripts break under CSP and get duplicated per page.

Auth and profile. The preset gives you Bootstrap-4-styled auth/login, auth/register, auth/passwords/*, and a profile edit page with an avatar upload. Treat the auth views as pure presentation — if you need 2FA, teams, or social login, bolt on Breeze/Fortify for logic and keep these views.

Integration tip: keep the preset's webpack.mix.js/vite.config.js edits isolated in a single commit. When you later swap asset pipelines, you'll want that diff to be one clean revert.

Gotchas and Tips

• It overwrites, silently. resources/views/, routes/web.php, app/Http/Controllers/HomeController.php, resources/sass/app.scss, the JS build config. Run it on a fresh laravel new project, or at minimum on a clean branch. There is no dry-run flag.
• It is not upgradable. composer update will never touch your published views. Pin the version ("laravel-frontend-presets/white-dashboard": "x.y.*"), then composer remove --dev the package after committing the output so CI and production don't carry it.
• Laravel 11/12 skeleton mismatch is the big one. Presets in this family were written against a app/Http/Kernel.php, RouteServiceProvider, and Auth::routes() world. On Laravel 11+ there's bootstrap/app.php, routes/auth.php, and no Auth::routes() facade call. Expect to hand-port the routes and middleware registration; the views usually survive intact.
• Mix vs Vite. Check whether the published layout references mix('css/app.css') or @vite(...). If it's Mix and you're on a Vite app, either keep laravel-mix around (two build systems — ugly) or port: move resources/sass/white-dashboard.scss imports into resources/css/app.css and point @vite at it. Don't mix both in one layout.
• Bootstrap 4, jQuery, and demo.*. The template's JS exposes global demo helpers (demo.showNotification('top','right'), demo.initChartist()). They live in the template's demo script and are the first thing to break when you prune vendor files. Grep your views for demo. before deleting anything from public/white-dashboard/js/.
• Never drop Bootstrap 5 on top. White Dashboard is BS4; BS5's utility/class changes will quietly mangle the markup.
• Assets in public/white-dashboard/ aren't hashed or versioned. npm run build doesn't touch them, so browser caches serve stale CSS after a template tweak. Add a query-string version (asset('white-dashboard/css/white-dashboard.css') . '?v=' . config('app.version')) or move them through the bundler.
• Licensing is two-layered. The package is MIT; the Creative Tim White Dashboard template assets are not — the free tier expects the footer credit to stay. Check before you strip footer.blade.php.
• Debugging checklist when a page renders unstyled: php artisan view:clear (preset views cache aggressively), confirm the @import survived in app.scss, confirm npm run dev actually rebuilt, and check the network tab for 404s under /white-dashboard/.
• php artisan route:list after install — the preset's route file may collide with existing named routes (home, profile).
• Weigh the alternative. 50 stars, zero dependents, last release Nov 2024. If you only want the look, laravel new + Breeze + copying the CSS/partials is often less work than fighting an old skeleton — and it's the same amount of code you end up owning either way.