Laravel Package Development Part 1: projecting a user session recording package

Image for post
Image for post
Photo by Kaleidico on Unsplash

The starting point: package boilerplate

The core of Laravel is to help you focus on your project logic instead of losing time on legacy stuff. For package development, you can use the Laravel Package Boilerplate Generator that will automatically generate the package structure including a basic structure, composer.json with illuminate dependency, some tools like Travis, StyleCI, Scrutinizer built-in support and basic markdown files.

Image for post
Image for post
Package Boilerplate Generator Welcome Page
Image for post
Image for post
Compose your package details
  • Package name: the name you want to give to your package.
  • Author name: who are you?
  • Author email: the email people can eventually use to contact you.
  • Package Description: what does your package do? Be short here, you will have the entire README.MD to explain it!
  • License: the choice is yours, guiding you through all license type it’s kinda hard, but they help you through the “Choose an open-source license” tool. For this, I picked the MIT License: simple and permissive!
Image for post
Image for post
Package boilerplate download
$ tree
.
├── .editorconfig
├── .gitattributes
├── .gitignore
├── .scrutinizer.yml
├── .styleci.yml
├── .travis.yml
├── CHANGELOG.md
├── CONTRIBUTING.md
├── LICENSE.md
├── README.md
├── composer.json
├── config
│ └── config.php
├── phpunit.xml.dist
├── src
│ ├── LaravelSpyhole.php
│ ├── LaravelSpyholeFacade.php
│ └── LaravelSpyholeServiceProvider.php
└── tests
└── ExampleTest.php
3 directories, 17 files
  • composer.json: basic composer specification file with the data you wrote through the tutorial and the dependencies.
  • phpunit.xml.dist: the PHPUnit Configuration to run tests.
  • .travis.yml: configuration file if you want to use the Travis CI tool (note that Travis CI is free for open-source projects).
  • .scrutinizer.yml: configuration file if you want to use the Scrutinizer CI tool (even Scrutinizer CI is free for open-source projects).
  • .styleci.yml: configuration file if you want to use the StyleCI tool (StyleCI is free for open-source projects).
  • Basic Git configuration files (.gitattributes and .gitignore).
  • Config folder containing a file for laravel package configuration files.
  • The source folder will contain the package code.
  • The test folder containing the package tests.
  • adding support for multiple support package version: "illuminate/support": "^7.0|^8.0"
  • adding the Orchestral Testbench package in the dev dependencies to test the package as in a laravel application (as suggested in the laravel guide) composer require --dev orchestra/testbench.
$ composer install

The idea

Well, before starting coding, it’s better to have a clear idea of what you want to build.

  • a minimal dashboard to check all recordings, rewatch and delete them (basically a CRUD), with a Gate for permissions checking. For everyone who wants to use the package out-of-the-box.

The database

Image for post
Image for post
Session recordings table structure.
  • path: this will help to filter and rewatch how a page UX works over time and to calculate further statistics that can be helpful (like checking how long does a user pass on that page for example).
  • session ID: this can be the real Laravel session ID or a UUID (if you don’t want to track the real ID), this will help to track the full user navigation matching session ID, paths and timestamps.
  • user ID: the user identifier for user tracking. This is not an integer but a string to stick with the getAuthIdentifier of Authenticatable interface. In many cases, the identifier is an ID but some developer may want to use a UUID or some different kind of identifier.
  • recordings: the recording payload as a JSON coming from the frontend.
  • Created and updated at timestamps: for time tracking.
$this->loadMigrationsFrom(__DIR__.'/../database/migrations');

The assets

While playing around with cimice (that I covered in the other article), I discovered a more maintained library: RRWeb (Record and Replay the Web) available here.

$this->publishes([
__DIR__.'/../resources/assets' => public_path('vendor/laravel-spyhole'),
], 'assets');

The config

The configuration of the package is ready to go. The config folder already contains a file named config.php where config must be written. Laravel publishing will push this file in the config/laravel-spyhole.php so I promptly renamed it to make autocomplete work. The config file contains just an array with config key and their associated values so for not it can be omitted, it will be populated while in development.

$this->publishes([
__DIR__ . '/../config/laravel-spyhole.php' => config_path('laravel-spyhole.php'),
], 'config');

Setup completed

IT Engineering PhD and still student 🎓 Mobile&Backend Dev 💻 Growth hacking Enthusiast ☕ Startupper 🚀 Metalhead 🤘🏻 With love, from Palermo ❤️

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store