Material Dashboard 2 Laravel

repository·master·Indexed 41 days ago

https://github.com/creativetimofficial/material-dashboard-laravel

A Bootstrap 5-based admin dashboard template for Laravel 9.x and above. It provides pre-built UI components, authentication views (Login, Register, Password Reset), and profile management pages. The template can be installed as a Laravel UI preset via Composer or manually via archive, scaffolding controllers, Blade components, and protected dashboard routes.

Tokens
3.1K
Snippets
10
Records
16
Agent score
52%

What's inside Material Dashboard 2 Laravel

  1. Understand the Material Dashboard 2 Laravel File Structure

    master

    The project follows the standard Laravel directory structure, with specific locations for dashboard components and views. Key directories include:

    • app/Http/Controllers: Contains logic for DashboardController, ProfileController, SessionsController, and RegisterController.
    • app/Models: Contains the User model.
    • resources/views/components: Contains reusable Blade components such as layout.blade.php, plugins.blade.php, footers/, and navbars/.
    • resources/views/pages: Contains various pre-built dashboard pages like billing.blade.php, notifications.blade.php, profile.blade.php, tables.blade.php, and virtual-reality.blade.php.
    • resources/views/dashboard: Contains the main index.blade.php for the dashboard.
    • resources/views/errors: Contains Blade templates for standard HTTP error codes (401, 403, 404, 419, 500, etc.).
  2. Install Material Dashboard 2 Laravel via Composer

    master

    To install the Material Dashboard preset into an existing Laravel 9.x+ application using Composer, follow these steps:

    1. Navigate to your Laravel application root.
    2. Install the Laravel UI package: composer require laravel/ui.
    3. Install the Material Dashboard preset: composer require laravel-frontend-presets/material-dashboard.
    4. Run the Material preset installation command: php artisan ui material. This command installs assets, custom auth views, and adds auth routes to routes/web.php. Note: If running this command multiple times, manually clean up duplicate Auth entries in routes/web.php.
    5. Refresh the autoloader: composer dump-autoload.
    6. Set up your database and seed the initial user: php artisan migrate:fresh --seed.
    cd your-laravel-app
    composer require laravel/ui
    composer require laravel-frontend-presets/material-dashboard
    php artisan ui material
    composer dump-autoload
    php artisan migrate:fresh --seed
  3. Install Material Dashboard 2 Laravel via Archive

    master

    If you prefer to install the preset manually using the repository archive:

    1. Create a presets folder in your application's root.
    2. Download and unzip the repository archive.
    3. Move the unzipped folder into presets/ and rename it to material.
    4. Update composer.json by adding the following to both autoload/psr-4 and autoload-dev/psr-4: "LaravelFrontendPresets\MaterialPreset\": "presets/material/src"
    5. Register the Service Provider in config/app.php: LaravelFrontendPresets\MaterialPreset\MaterialPresetServiceProvider::class
    6. Install Laravel UI: composer require laravel/ui.
    7. Refresh the autoloader: composer dump-autoload.
    8. Install the preset: php artisan ui material.
    9. Configure your database in the .env file.
    10. Run migrations and seeders: php artisan migrate:fresh --seed.
    // composer.json
    "autoload": {
        "psr-4": {
            "App\\": "app/",
            "LaravelFrontendPresets\\MaterialPreset\\": "presets/material/src"
        }
    }
  4. Report an issue with Material Dashboard

    master

    If you encounter bugs, use GitHub Issues as the official tracker. To ensure a faster resolution, follow these guidelines:

    1. Verify Version: Ensure you are using the latest version of the Material Dashboard by checking the CHANGELOG on the Creative Tim website.
    2. Reproduce: Provide clear, reproducible steps to trigger the issue.
    3. Browser Context: Specify which browser you are using, as some issues may be browser-specific.
  5. What the MaterialPreset installation process does

    master

    The MaterialPreset class is a Laravel UI preset used to scaffold the Material Dashboard environment. When the install() method is invoked, it performs the following automated setup steps:

    1. Updates Assets: Copies Material-specific public assets, resource assets (JS/CSS), and the webpack.mix.js configuration file.
    2. Updates Welcome Page: Replaces the default Laravel welcome.blade.php with the Material Dashboard version.
    3. Updates Auth Views & Controllers: Scaffolds authentication logic by copying specific Controllers (DashboardController, ProfileController, RegisterController, SessionsController), the User model, and authentication views (Register, Sessions, Dashboard).
    4. Adds Components: Injects Material-specific Blade components into resources/views/components.
    5. Adds Pages & Database: Scaffolds additional dashboard pages, database migrations, and seeders, and appends necessary routes to routes/web.php.
  6. Install the Material Dashboard scaffolding via Laravel UI

    master

    The Material Dashboard preset extends the laravel/ui package by adding a custom material command to the ui CLI tool. You can trigger the installation of the Material Dashboard scaffolding by running the ui material command in your terminal. This will execute the MaterialPreset::install() process and output a success message upon completion.

    php artisan ui material
  7. Register a new user with RegisterController

    master

    New users can register via the /sign-up route. The App/Http/Controllers/RegisterController.php handles the creation of the user account. It validates the name, email, and password, creates the user, logs them in, and redirects them to /dashboard.

    // Example: Registration logic in App/Http/Controllers/RegisterController.php
    public function store(){
        $attributes = request()->validate([
            'name' => 'required|max:255|unique:users,name',
            'email' => 'required|email|max:255|unique:users,email',
            'password' => 'required|min:5|max:255',
        ]);
    
        $user = User::create($attributes);
        auth()->login($user);
        
        return redirect('/dashboard');
    } 
  8. Authentication logic in SessionsController

    master

    The App/Http/Controllers/SessionsController.php manages user authentication and password recovery.

    Login (store method): Validates email and password, attempts authentication, regenerates the session, and redirects to /dashboard.

    Forgot Password (show method): Validates the email and triggers the password reset link email via Password::sendResetLink.

    Reset Password (update method): Validates the token, email, and new password, then updates the user record and triggers a PasswordReset event.

    // Example: Login logic in App/Http/Controllers/SessionsController.php
    public function store()
    {
        $attributes = request()->validate([
            'email' => 'required|email',
            'password' => 'required'
        ]);
    
        if (! auth()->attempt($attributes)) {
            throw ValidationException::withMessages([
                'email' => 'Your provided credentials could not be verified.'
            ]);
        }
    
        session()->regenerate();
    
        return redirect('/dashboard');
    }
  9. Update User Profile with ProfileController

    master

    Logged-in users can manage their profile at the /user-profile URL. The App/Http/Controllers/ProfileController.php handles updates to the following fields:

    • email (must be unique, excluding current user)
    • name
    • phone (max 10 characters)
    • about (max 150 characters)
    • location
    // Example: Profile update logic in App/Http/Controllers/ProfileController.php
    public function update()
    {
        $user = request()->user();
        $attributes = request()->validate([
            'email' => 'required|email|unique:users,email,'.$user->id,
            'name' => 'required',
            'phone' => 'required|max:10',
            'about' => 'required:max:150',
            'location' => 'required'
        ]);
        auth()->user()->update($attributes);
        return back()->withStatus('Profile successfully updated.');
    }
  10. Automatic password hashing in the User model

    master

    The User model includes a setPasswordAttribute mutator. This means when you assign a value to the password attribute, it is automatically hashed using bcrypt(). You do not need to manually hash the password before saving it to the model.

    // When you do this:
    $user->password = 'my-secret-password';
    $user->save();
    
    // The model automatically executes:
    // $this->attributes['password'] = bcrypt('my-secret-password');