Bootstrap 5 integration with PHP & Laravel

1. Create a database

For the application to work correctly, you need to create a new MySQL database. For the purposes of this guide, we named it mdb_admin_dashboard_laravel, but you can use your custom database name here.

In this instruction we won't get into details about MySQL databases and how to set them up - you can learn more here:

• MySQL docs
• MariaDB

2. Configure connection

To connect to a database, we need to configure the connection parameters in the .env file:

        
            
            DB_CONNECTION=mysql
            DB_HOST=127.0.0.1
            DB_PORT=3306
            DB_DATABASE=mdb_admin_dashboard_laravel
            DB_USERNAME=root
            DB_PASSWORD=
          
        
    

Replace username and password values with your credentials. If you created database with a custom name in the first step, paste it in the DB_DATABASE field. Otherwise, leave the default mdb_admin_dashboard_laravel name.

3. Migrations

Now, when everything is set, we can run automatic migrations to create the required tables and columns in the database.

In your terminal run:

        
             php artisan migrate 
        
    

Once you refresh your database, you should see new tables and columns.

4. Seeding

Laravel includes a simple method that allow to seed your database with test data.

In your terminal run:

        
             php artisan db:seed 
        
    

Once you refresh your database, you should see test data.

1. Login / Logout

The full version of the application is available only to a logged-in user (admin user also has access to the users management panel). The application uses cookies based authentication.

After logout, cookies will be deleted and user will be redirected to the login/register page.

2. Registration

You can add new user by completing the registration form. To create an user with admin priveleges, you need to manually add the user with a specific role_id to the users table in the database.

3. User Profile

Each user can update his profile (avatar, username, password) by submitting the form in the User Profile view.

4. User Management (admin only)

User with the admin privileges can update information about other users.

1. Users

By default, the seeder will create five normal users with random data and one admin user with following credentials:

        
            
            {
              name: "Admin",
              email: "admin@mdbootstrap.com",
              password: "mdbootstrap",
              roleId: 1
            }
          
        
    

2. Roles

• Admin (id: 1)
• User (id: 2)

3. Traffic Data

Five randomly generated entries used in chart and table in the Dashboard view.

1. Models

Models available in your app out of the box:

• Users
• Role
• TrafficData

2. Controllers

Controllers:

• LoginController - user login management
• RegisterController - user registration management
• DashboardController - rendering dashboard view
• ProfileController - rendering user profile view, profile data updates management
• UsersController - rendering admin panel view, user data updates management

1. Views

Views for your application:

• Index - Login and register forms
• Dashboard - General Dashboard
• UserProfile - User data and password management
• UserManagement - Admin panel

2. Public folder

• /mdb - MDB 5 files
• /js - js files for views
• /css - css files for views