Back to blog

P3 | Quick intro to Craftable PRO and comparison of existing admin panels

Aug 15, 2024
.
Kristína Odziomková

In this part of the blog series, we will look into how to quickly generate a CRUD for our events and event categories model from the previous parts. To accomplish that we will use our own Craftable PRO admin panel package:

Setting up Craftable PRO (15 minutes)

Following the Craftable PRO documentation, first we will install Craftable PRO. If you don’t have your license yet, head to craftable.pro to buy one for yourself or for your team.

At the time of writing, the installation process is as follows:

sail composer config repositories.craftable-pro composer https://packages.craftable.pro
sail composer require brackets/craftable-pro
sail artisan craftable-pro:install
npm install && npm run craftable-pro:dev

After heading to http://localhost/admin and logging in with the credentials provided by the craftable-pro:install command, we can check that our project’s admin panel has been successfully set up.

 <br>
 

From the get-go, we are able to manage Craftable PRO users with roles and permissions, translations, settings and media.


Quick generation of the events and event categories CRUD (15 minutes)

We have created the migrations in one of the previous parts of this blog series. For convenience, we will provided it here as well:

Schema::create('event_categories', function (Blueprint $table) {
    $table->id();
    
    $table->jsonb('title');
    
    $table->timestamps();
});

Schema::create('events', function (Blueprint $table) {
    $table->id();
    
    $table->jsonb('title');
    $table->jsonb('description')->nullable();
    $table->integer('max_number_of_participants')->nullable();
    $table->foreignId('event_category_id')->constrained('event_categories');
    $table->dateTime('date_time');

    $table->timestamps();
    $table->softDeletes();
});

The whole generation can be done with just 1 command (per model) and rebuilding the assets.

  1. Run the CRUD generator command To use the detail wizard to help you customize the CRUD before it is being generated, use it with the -w option.
    sail artisan craftable-pro:generate-crud event_categories -w
    sail artisan craftable-pro:generate-crud events -w
    
    For the event_categories, we selected all default options in the wizard, which also replaced our existing EventCategory model. It did not contain any extra information yet, so we did not lose anything. For the events, we selected all default options in the wizard, and we also added a BelongsTo relation with event_categories.
  2. Build NPM
    npm run craftable-pro:dev
  3. Check the generated CRUD and add one entry for testing purposes
Event category form with translations
Event category form with translations
Event category listing<br>
Event category listing
Event form with translations and relationship<br>
Event form with translations and relationship
Event listing with relaltionship<br>
Event listing with relaltionship

Customize the generated CRUD according to your needs (15 minutes - 2 hours)

What’s next


Conclusion

In conclusion, this part of our blog series demonstrated how to quickly generate CRUD operations for our events and event categories models using the Craftable PRO admin panel package. By utilizing Craftable PRO, we were able to efficiently create a comprehensive admin interface, significantly speeding up our development process. This approach not only saves time but also provides a robust and user-friendly management system for our application.