Skip to content

Leaf DevTools

Leaf DevTools provides a set of tools for debugging and understanding your Leaf applications. At the Core, the DevTools provides a visual tool with a clean and intuitive UI holding information about your Leaf application, and a light-weight library that you can use to interact with the devtools frontend.

Installation

You can install the Leaf DevTools using the Leaf CLI:

leaf install devtools

Or with composer:

composer require leafs/devtools

After installing the devtools module, you need to add the hook to your app. This will register the devtools routes and allow your Leaf app to communicate with the DevTools. You can do this by adding this line to your app root.







 



<?php

require __DIR__ . "/vendor/autoload.php";

$app = new Leaf\App;

\Leaf\DevTools::install();

...




 



<?php

require __DIR__ . "/vendor/autoload.php";

\Leaf\DevTools::install();

...

Basic Usage

Once you have completed the process above, you can start your application and open the DevTools in your browser. You can do this by going to http://localhost:port/leafDevTools in your browser.

Dev Experience

Leaf DevTools are still being developed. We're working on making the experience better and more intuitive. If you have any suggestions, please feel free to open an issue on the GitHub repo.

Application Insights

Leaf DevTools has an insights tab that provides information about your Leaf app, like your application config, routes, cookies, sessions, env and more. This information is useful for debugging and understanding your app and why it behaves the way it does.

Installed Packages

On the packages tab, you can see all the installed packages in your application. The installed packages are separated into two categories: Composer packages and Leaf packages. You can also see the version of each package, a description and a link to the package's GitHub repo.

Server Console Logs

The server module allows you to log out data which will be displayed in the dev tools console (just like console.log). Since PHP doesn't have any real implementation of something like JavaScript's console.log, we decided to add something like that as it is useful for debugging.

To get started, call the console method on Leaf\DevTools

\Leaf\DevTools::console('This data should be logged in the console');
\Leaf\DevTools::console('This is a warning', 'warn');
\Leaf\DevTools::console('This is an error', 'error');
\Leaf\DevTools::console('This is an info message', 'info');
\Leaf\DevTools::console('This is a debug message', 'log');

Application Routes

The routes tab shows all the routes in your application. It shows the route's name, method, path, handler and middleware if available.

Extras

Installing the devtools module also gives you access to the dump function from Symfony's VarDumper. You can read more about it here.

dump($data);

Deployment

You should note that the devtools module is meant for use ONLY IN DEVELOPMENT. You should not use it in production as it can be a security risk. For now, the only way to disable the devtools is to remove the hook from your app or uninstall it completely.

A small workaround is to add a condition to the hook so that it only runs in development mode. You can do this using the script method on the Leaf\App class.

$app->script('development', function () {
    \Leaf\DevTools::install();
});
app()->script('development', function () {
    \Leaf\DevTools::install();
});
Leaf DevTools has loaded