Tutorial: Next MoleculerJS Postgres PGAdmin

This tutorial is about how to run a Molecular Postgres PgAdmin on Docker and Next on our local using Bolt. Molecular is used for the backend, and Next is for the frontend. For the database, we have used Postgres, and for the management of Postgres, we have used PgAdmin. Below is the video showing how to run this tutorial.

Objectives
Project Structure
Initialising the project using Bolt
Adding all services as a Bolt Service
Adding Ingress
Running the Project
Services that are running on Docker
Services that are running on Local
Listing Bolt Services
Monitoring Service Logs
Stopping Your Project
Repo Link

Objectives

Here we have created a project where we have four folder named frontend, backend, postgres and pgadmin which has a next app with postgres, backend and pgadmin as services.

Our Main objectives are:

Run this project using bolt in local machine.
Run this project using bolt in docker.

Project Structure

The project structure of our app is as follows:

# Below's the directory structure of our project.
next-moleculerjs-postgres-pgadmin/
╰─➤ services/
  ╰─➤ backend
  ╰─➤ frontend
  ╰─➤ pgadmin
  ╰─➤ postgres
╰─➤ .env
╰─➤ .env.tpl
╰─➤ .bolt.nginx.conf
╰─➤ bolt.yaml
╰─➤ Readme.md

Initialising the project using Bolt

At first we have initialised the project by running bolt init command to create bolt.yaml file.

$ cd next-moleculerjs-postgres-pgadmin
$ bolt init

It has created a bolt.yaml file in our project's root directory.

envfile: .env.tpl
project_id: "1690971331922"
project_name: next-moleculerjs-postgres-pgadmin
services: null
ingress: null

Adding all the services as Bolt Service

Now in order to add each and every services we have executed the following commands:

$ bolt service:add backend services/backend
Creating app in backend
Scanning source code
Detected NodeJS app
Installed backend service in backend
Verifying metadata for other services..
Metadata verified

$ bolt service:add frontend services/frontend
Creating app in frontend
Scanning source code
Detected NextJS app
Installed backend service in backend
Verifying metadata for other services..
Metadata verified

$ bolt service:add postgres services/postgres
Creating app in postgres
Scanning source code
Detected Postgres app
Installed postgres service in postgres
Verifying metadata for other services..
Metadata verified

$ bolt service:add pgadmin services/pgadmin
Creating app in pgadmin
Scanning source code
Detected pgadmin app
Installed pgadmin service in pgadmin
Verifying metadata for other services..
Metadata verified

Bolt service:add command runs and automatically detects the type of service you are using and creates a bolt.service.yaml template init & includes the same into your bolt.yaml file.

# This is how bolt.yaml file looks after executing the above commands
envfile: .env.tpl
project_id: "1690971331922"
project_name: next-moleculerjs-postgres-pgadmin
services:
  postgres:
    path: ./services/postgres
  pgadmin:
    path: ./services/pgadmin
  backend:
    path: ./services/backend
  frontend:
    path: ./services/frontend
ingress: null

Each services has their own bolt.service.yaml file, here we have configured it as per our requirement.

We have configured run.dockerfile and build.dockerfile for PGAdmin, Postgres and Backend to run them in Docker. And frontend to run on Local.

Adding Ingress

We have added ingress configuration for our project inside bolt.yaml file to access our services from outside.

# This is how bolt.yaml file looks finally after adding ingress configuration
envfile: .env.tpl
project_id: "1690971331922"
project_name: next-moleculerjs-postgres-pgadmin
services:
  backend:
    path: services/backend
  frontend:
    path: services/frontend
  postgres:
    path: services/postgres
  pgadmin:
    path: services/pgadmin
ingress:
  - domain: bolt.frontend.app.com
    port: 8000
    options:
      - location: /
        rewrite_key: ^/(.*)
        rewrite_value: /$1
        proxy_pass: http://${FRONTEND_ASSIGNED_HOST}:${FRONTEND_ASSIGNED_PORT}
  - domain: bolt.backend.app.com
    port: 8001
    options:
      - location: /
        rewrite_key: ^/(.*)
        rewrite_value: /$1
        proxy_pass: http://${BACKEND_ASSIGNED_HOST}:${BACKEND_ASSIGNED_PORT}
  - domain: bolt.pgadmin.app.com
    port: 8002
    options:
      - location: /
        rewrite_key: ^/(.*)
        rewrite_value: /$1
        proxy_pass: http://${PGADMIN_ASSIGNED_HOST}:${PGADMIN_ASSIGNED_PORT}
vm:
  name: nextmoleculerjspostgrespgadmin

Running the Project

Now, let's run our service using Bolt.

# The following command will run the service as per the configuration in bolt.yaml file
$ bolt up

Now this command will first run the services as per their configurations inside bolt.service.yaml for each each serivce. After that, bolt will create a nginx configuration file named as bolt.nginx.conf in your project's root directory and run the Nginx server on your host machine's Docker.

Services that are running on docker

Below's our bolt.service.yaml files for all three services configured to run on docker for your reference.

# This is bolt.service.yaml file for PGAdmin
container_name: pgadmin
stateless: true
default_service_runner: docker
service_discovery_offset:
  - 8080
supported_service_runners:
  - local
  - docker
service_runners:
  local:
    envfile: .env
    build: npm run install --workspaces --if-present && npm run dev
    ports:
      - ${ASSIGNED_PORT}:${ASSIGNED_PORT}
  docker:
    envfile: .env
    build: ./run.Dockerfile
    ports:
      - ${ASSIGNED_PORT}:8080

# This is bolt.service.yaml file for Postgres
container_name: postgres
stateless: false
default_service_runner: docker
service_discovery_offset:
  - 5432
supported_service_runners:
  - docker
service_runners:
  docker:
    envfile: .env
    build: ./run.Dockerfile
    healthcheck:
      test:
        - CMD-SHELL
        - psql -U $$POSTGRES_USER -d $$POSTGRES_DB
      interval: 10s
      timeout: 10s
      retries: 50
      start_period: 30s
    ports:
      - ${ASSIGNED_PORT}:5432
    volumes:
      - ./services/postgres/init.db/:/docker-entrypoint-initdb.d/

# This is bolt.service.yaml file for Backend
container_name: backend
stateless: true
default_service_runner: docker
service_discovery_offset:
  - 3000
supported_service_runners:
  - local
  - docker
service_runners:
  local:
    envfile: .env
    build: npm run install --workspaces --if-present && npm run dev
    ports:
      - ${ASSIGNED_PORT}:${ASSIGNED_PORT}
  docker:
    envfile: .env
    build: ./run.Dockerfile
    ports:
      - ${ASSIGNED_PORT}:${ASSIGNED_PORT}

Services that are running on local

Below's our bolt.service.yaml files for all three services configured to run on docker for your reference.

# This is bolt.service.yaml file for Frontend
container_name: frontend
stateless: true
default_service_runner: local
service_discovery_offset:
  - 3000
supported_service_runners:
  - local
  - docker
service_runners:
  local:
    envfile: .env
    build: npm install && npm run dev -- --port ${ASSIGNED_PORT}
    ports:
      - ${ASSIGNED_PORT}:${ASSIGNED_PORT}
  docker:
    envfile: .env
    build: ./run.Dockerfile
    ports:
      - ${ASSIGNED_PORT}:3000
    volumes:
      - :/app
      - /app/frontend/node_modules/

Now if you run bolt up command it will run the service in docker.

Listing Bolt Services

You can also see the list of services in your bolt project and their statuses using the service:list command.

$ bolt service:list
╔═══╤══════════════╤════════╤════════════════╤══════╤═══════════╗
║ # │ Service Name │ Status │ Service Runner │ Port │ ProcessId ║
╟───┼──────────────┼────────┼────────────────┼──────┼───────────╢
║ 1 │ backend      │ up     │ docker         │ 3000 │ backend   ║
╟───┼──────────────┼────────┼────────────────┼──────┼───────────╢
║ 2 │ frontend     │ up     │ local          │ 3001 │ 15560     ║
╟───┼──────────────┼────────┼────────────────┼──────┼───────────╢
║ 3 │ postgres     │ up     │ docker         │ 5432 │ postgres  ║
╟───┼──────────────┼────────┼────────────────┼──────┼───────────╢
║ 4 │ pgadmin      │ up     │ docker         │ 8080 │ pgadmin   ║
╚═══╧══════════════╧════════╧════════════════╧══════╧═══════════╝

Monitoring Service Logs

To monitor logs, use the following command:

$ bolt log SERVICE_NAME

To keep monitoring logs in live mode, use the following command:

$ bolt log --follow SERVICE_NAME

For example, if you want to monitor logs of todonext service, you can use the following command:

# To monitor logs at once
$ bolt log frontend

# To keep monitoring logs in live mode
$ bolt log --follow frontend

Stopping Your Project

To stop your project, you can run the following command:

$ bolt down

This command will terminate all the services running via bolt in the project.

Repo Link

To clone the project you can use bolt-framework-tutorial-apps/examples/next-molecularjs-postgres-pgadmin

Up next

Nuxt Postgres Pgadmin

Go back

Expo & ExpressJS