P3 | Quick intro to Craftable PRO and comparison of existing admin panels
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.
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.
- 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.
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.sail artisan craftable-pro:generate-crud event_categories -w sail artisan craftable-pro:generate-crud events -w
- Build NPM
npm run craftable-pro:dev
- Check the generated CRUD and add one entry for testing purposes
Customize the generated CRUD according to your needs (15 minutes - 2 hours)
To see the storybook of our components, look here: Craftable PRO Storybook
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.