Introducing our Laravel Nova packages

Laravel Nova is a beautiful admin panel that was first showcased at Laracon 2018 by Laravel creator Taylor Otwell. Using Nova building rich admin panels is a breeze. Nova was released today. Taylor was kind enough to give us early access to Nova shortly after Laracon. During our early access my team at Spatie and I created two Nova tools that I'd like to introduce in this blogpost.

What is a Nova tool?

One of the key characteristics of Nova is that it's very extendable. You can create your own field types, custom actions, create nice little cards and much more.

Tools are a way to add entire custom screens to Nova. They consist of a service side API that you can define and Vue tools that can consume that API. You can really do anything you want.

nova-tail-tool

The first tool we created was one to tail to application log. Here's a little demo that shows the tool in action.

We made this tool to get familiar with creating tools in Nova. You can find the source code in this repo on GitHub.

nova-backup-tool

After getting our feet wet with the tail tool, it was time to create a bigger Nova tool. At Laracon US, Nova co-creator David Hemphill showed me a little mockup of how a backup tool could look like in Nova. I was immediately sold on creating an actual backup tool. We already have a popular package out there to backup a laravel app so the tool needed to be an UI for the laravel-backup package.

Here is a video that showcases what the Nova tool can do.

That UI is rendered by a few Vue components. It communicates with the Laravel app via a simple API. Because laravel-backup already was able to create, list and delete backups and statuses via Artisan commands, it already contained some good classes, like Spatie\Backup\BackupDestination\BackupDestination and Spatie\Backup\BackupDestination\Backup to easily create an API. Here's the controller that is responsible to feed that upper part in the UI of the tool that lists backup statuses.

<?php
namespace Spatie\BackupTool\Http\Controllers;
use Illuminate\Support\Facades\Cache;
use Spatie\Backup\Tasks\Monitor\BackupDestinationStatus;
use Spatie\Backup\Tasks\Monitor\BackupDestinationStatusFactory;
class BackupStatusesController extends ApiController
{
    public function index()
    {
        return Cache::remember('backup-statuses', 1 / 15, function () {
            return BackupDestinationStatusFactory::createForMonitorConfig(config('backup.monitorBackups'))
                ->map(function (BackupDestinationStatus $backupDestinationStatus) {
                    return [
                        'name' => $backupDestinationStatus->backupName(),
                        'disk' => $backupDestinationStatus->diskName(),
                        'reachable' => $backupDestinationStatus->isReachable(),
                        'healthy' => $backupDestinationStatus->isHealthy(),
                        'amount' => $backupDestinationStatus->amountOfBackups(),
                        'newest' => $backupDestinationStatus->dateOfNewestBackup()
                            ? $backupDestinationStatus->dateOfNewestBackup()->diffForHumans()
                            : 'No backups present',
                        'usedStorage' => $backupDestinationStatus->humanReadableUsedStorage(),
                    ];
                })
                ->toArray();
        });
    }
}

You'll find the source code for nova-backup-tool in this repo on GitHub.

Creating new Nova tools

We already have plans to create a few more Nova tools. Nova itself has an artisan command to scaffold a new tool. But for packaging it up there are some extra steps to be done, even with that scaffolding.

That's why we created a skeleton repo called skeleton-nova-tool as a starting point for new Nova tool packages. It's based on the scaffolding Nova provides, but with some niceties added. There are configuration files for Style CI out of the box, the .gitignore already doesn't ignore the dist directory, there's already a test for the API, etc.

Feel free to use our skeleton repo to kickstart your Nova tool packages.

https://github.com/spatie/skeleton-nova-tool

On getting early access

The past few days there were some concerns voiced on how Spatie, and other parties who got early access, had an unfair advantage. The reasoning was that this way anyone who got early access could dominate a paid Nova marketplace.

Our two Nova tools and the other ones we will make will be free and open source. We don't get paid for making these tools. During early access we helped a bit with streamlining the Nova tool creation workflow and our two tools. All was done to provide a better experience for new Nova users on day one of the release.

Looking forward

At Spatie we created a lot of packages in the past. This package collection has grown organically. Because we were early adaptors of Laravel, there simply weren't that many quality packages around, so we needed to create our own.

Since then the Laravel ecosystem has grown considerably. At Spatie we do plan on creating more Nova packages, but there are a lot of other parties now as well creating Nova stuff. That's why I don't expect that our Nova collection will be as big as our package collection.

To make Nova work we'll need many helping hands. It's going to be a big boat and everyone's welcome to create awesome stuff. If you made something be sure to add it to the Nova packages site that our friends at Tighten Co. are creating. There are already some cool packages by Marcel Pociot and Mohammed Said listed there.

We had a lot of fun creating these tools. Under the hood it's all just Laravel and Vue so the learning curve wasn't hard at all for us. Can't wait to see the awesome stuff that's going to be released by the community in the coming weeks, months and years!