Skip to content

Pm2-webui - opensource Alternative to PM2 Plus

Intro

In this example we will set up pm2-webui in the workspace.

PM2 WebUI - is a minimalistic app manager and log viewer.

pm2-webui

Attention

PM2 WebUI can be installed in any workspace. We will use Codeserver workspace v.4.0 in this example.

Note

We will create isolated node environment for PM2 WebUI and its dependencies.
Then we will start it in a permanent way, and add PM2 WebUI tab shortcut to the workspace UI.

Install

Open workspace terminal, clone PM2 WebUI git repository and enter it

$ git clone https://github.com/suryamodulus/pm2-webui /home/abc/apps/pm2-webui

Cloning into '/home/abc/apps/pm2-webui'...

$ cd /home/abc/apps/pm2-webui
with <font color="#FDEB61">abc</font> in <font color="#37E6E8">/home/abc/apps/pm2-webui</font> on <font color="#BC94B7">⇡master</font> <font color="#98E242">➜</font>

Create node enviroment and activate it (you can find required version in package.json file)

$ nodeenv --node=17.0.0 env && . env/bin/activate

 * Install prebuilt node (17.0.0) ..... done.
(env) 19:58:14 with <font color="#FDEB61">abc</font> in <font color="#37E6E8">/home/abc/apps/pm2-webui</font> on <font color="#BC94B7">⇡master</font> is 📦  <font color="#5EA702">via ⬢ v17.0.0</font>  <font color="#98E242">➜</font>

Install dependencies

$ npm install

...
added 407 packages, and audited 408 packages in 20s

Configure

$ cp env.example .env

(env) 19:58:14 with <font color="#FDEB61">abc</font> in <font color="#37E6E8">/home/abc/apps/pm2-webui</font> on <font color="#BC94B7">⇡master</font> is 📦  <font color="#5EA702">via ⬢ v17.0.0</font>  <font color="#98E242">➜</font>

$ npm run setup-admin-user 

<font color="#5EA702">✔</font> <b>App Username</b> … admin
<font color="#5EA702">✔</font> <b>App Password</b> … ***********
<font color="#5EA702">✔</font> <b>Confirm to create/update admin user ?</b> … yes

Run

Start PM2 WebUI

$ npm start

> pm2-webui@1.0.0 start
> node .
Application started at http://127.0.0.1:4343

Application is running on port 4343. Let's tunnel it to the port 8031

Open another terminal window, and execute

$ socat tcp-listen:8031,reuseaddr,fork tcp:localhost:4343

<font color="#646562">_</font>

Now you can open PM2 WebUI from the tab "My App on port 8031"

myapp-8030.jpg

Add to workspace

PM2 WebUI is up and running. But it started from terminal. As soon as we close the terminal, PM2 WebUI will terminalte.

Let's create a permanent workspace service for PM2 WebUI:

  • Open "Admin" tab of the workspace UI and avigate to "Workspace Settings"
  • Go to the tab "Apps & Services"
  • Select "START NEW" from the picklist
  • Enter the following command 

cd /home/abc/apps/pm2-webui; . env/bin/activate; npm start
This command consists of several parts: 1) go to the PM2 WebUI repo, 2) activate node environment, 3) serve PM2 WebUI on port 8032

  • Give it any name you want
  • Click "Save"

pm2-webui-service

we also need to create service for socat that tunnels port 4343 to another port

  • Open "Admin" tab of the workspace UI and avigate to "Workspace Settings"
  • Go to the tab "Apps & Services"
  • Select "START NEW" from the picklist
  • Enter the following command 
socat tcp-listen:8032,reuseaddr,fork tcp:localhost:4343
  • Give it any name you want
  • Click "Save"

pm2-webui-port

Restart workspace to apply changes.

Create UI tab

Let's add shortcut tab for PM2 WebUI on the "Home" page.

Shortcut tab has title, description and image. Use filebrowser or IDE to upload any image you want into the workspace. You can choose whatever you like, one option - is to create a printscreen of the PM2 WebUI app itself.

After you upload the image to the workspace

  • Go to the "Interface" tab of the workspace settings and select "CREATE NEW" from the picklist.
  • Give it any title and description.
  • In the field "Port" enter port 8032
  • In the file picker find your image.
  • Leave field "path" blank and click "Create"

pm2-webui-tab

Now we have PM2 WebUI tab on the Home page

pm2-webui-home

Tip

Use the Alnoda Hub for application installation - it greatly simplifies the process!