Many developers love and use the Serverless Framework for writing their serverless applications. In the spirit of making it even easier to manage the serverless applications using the Serverless Framework, Takahiro Horike, created the Serverless Dashboard package for the Atom editor.

In this post, I will give you an overview of the Serverless Dashboard package.

We'll cover:

• Installing the plugin in Atom
• Visualizing the serverless.yml file
• Using the Atom plugin to manage a serverless app

Installation

Let's start by installing the Atom package or plugin. If you don't have Atom, you'll need that first! If you don't have the Serverless Framework installed, you'll need that too.

Installing the Serverless Framework is a breeze:

npm install -g serverless

You can search for the Serverless Dashboard package on the Atom site:

Search for the package

To install it, do the following:

1. Launch Atom
2. Open 'Settings View' using Cmd+, on macOS or Ctrl+, on other platforms
3. Click the 'Install' tab on the left side
4. Enter serverless-dashboard in the search box and press Enter
5. Click the 'Install' button that appears

Install the package

Visualizing the serverless.yml file

Let's create a simple app named helloatom using the boilerplate template provided by the Serverless Framework.

sls create -t hello-world -n helloatom -p helloatom

Open the app files in atom.

To use the Serverless Dashboard plugin, locate the 'Serverless Dashboard' item on the 'Packages' menu list as shown below:

Post installation

Click on the 'Open your serverless.yml' and choose the serverless.yml for the project.

A new pane will open with the Serverless Dashboard showing a visual representation of the serverless.yml file.

Serverless Dashboard

Managing a serverless app

The Serverless Dashboard plugin not only lets you visualize the serverless.yml file, but also helps you easily manage a few things inside the Atom editor pane.

Deploy a service

You can easily deploy the service by clicking on the 'Deploy Service' button. The service will be deployed to the stage and the region as specified. Note that you can change those settings directly from the pane.

Update deploy settings

Let's see what the deployment looks like:

Deployment

Nothing new here if you're already familiar with Serverless Framework. The output of the deployment is exactly what you would see in the terminal if you'd deployed using sls deploy.

Updating the serverless.yml file

Let's add a new function, byeWorld, to the serverless.yml file, like so:

  byeWorld:
    handler: handler.byeWorld
    # The `events` block defines how to trigger the handler.byeWorld code
    events:
      - http:
          path: bye-world
          method: get
          cors: true

Switch over to the Serverless Dashboard pane, and click on the 'Reload serverless.yml' button.

Reload serverless.yml

Let's deploy the service by clicking on the 'Deploy Service' button.

Deploying a function

Let's update some code in our functions. We will just add a simple line to log the event object that we receive.

console.log(`***** From helloWorld: *****\n Event: JSON.stringify(event) \n******\n`);

Since we just updated our function code, let's just deploy the helloWorld function alone. Select the 'Deploy Function' and click on the 'Apply' button as shown below:

Deploying a function

Invoking a function

To invoke a function, click on the dropdown next to the function name. Select 'Invoke', and then hit 'Apply':

Invoking a function

Logs for a function

To view the logs for a function, click on the dropdown next to the function name and select 'Logs', and then hit 'Apply' as shown below:

Logs for a function

Removing a service

Last but not least, you can remove the service right from the pane:

Removing a service

Summary

The Serverless Dashboard is a convenient package that you can install in Atom to easily access various commands for the Serverless Framework within the Atom editor. It does not support all the commands that are available via the CLI, but it covers the most commonly used commands for managing a service.

Kudos to the Serverless Champion, Takahiro Horike, for writing this package and helping the community.