Viewing Laravel Databases in VS Code

The majority of VS Code users prefer to use the integrated terminal rather than the system terminal/cli app. As developers, we love and appreciate the advantages of such integrations.

Using the VS Code integrated terminal as a case study, two major advantages stand out, as explained below:

1. Less context-switching. The lesser you have to switch from one app to another, the better the Developer Experience. Thus, any workflow or tool that reduces context-switching is a great appeal, as it is with the VS Code integrated terminal.

2. Contextual integration. Another advantage of using the integrated VS Code terminal rather than the default/stock OS tool is that we now enjoy integrations related to IDE context. e.g. cwd defaults to the root of the currently opened project, links/paths from command outputs in the integrated terminal are clickable and can even be used to open files from the terminal in the IDE, etc.

The above are just a few of the advantages when VS Code provides integrations for tools.

The above begs the question: why can't we have the same experience when working with databases? Databases are one of the recurring themes in Laravel apps. Why do we have to configure our database credentials in the .env file, and also configure it in another database GUI desktop app? Why do we have to switch from VS Code to TablePlus/phpMyAdmin/whatever-your-favourite-database-desktop-app-is, especially if it is for the sole purpose of viewing database records and not for some database administration tasks?

Enters DevDb!

DevDb is a Laravel first, framework- and language-agnostic VS Code extension that auto-loads databases without the need for configuring database connection separately from what you already have in application code. It currently supports SQL, MySQL, and Postgres databases, with plans to support more databases in the future.

Its advantages are similar to what we discussed above regarding the integrated terminal in VS Code.

DevDb features

1. It auto-loads your database and shows your data right inside VS Code. In a Laravel project, this is done by processing some files like config/database.php, docker-compose.yml, and .env
2. If it cannot auto-load your database (yet 😉), you simply provide a .devdbrc file in the root of your application. This is why you can use it in any framework and any programming language
3. It can open any table in your app using the context menu feature. The example below is from a Node JS project:
4. It provides Code Lens for Laravel Eloquent models
5. It has dark mode! I mean, why not? 😜
6. When you're not in a hurry and idle, it tells actual dad jokes:
7. And what's more? It's Open Source! You can tinker with the source code and PR anything you're missing as long as it's okay 😊.

You can start using DevDb in your Laravel apps right now. Check it out in the VS Code marketplace.