My Admin Panel Project

TLDR

This is a project for the Web and Architecture course at ESIR.

The goal is to create a web application with a microservice architecture. The application is a simple administration panel for a company that manages associations.

The application is composed of a front-end, an API, a mail microservice, a database, a message broker, a reverse proxy, a load tester and monitoring tools.

Services

Name	Technologies
Nginx	Nginx
Front	Angular, TS
API	NestJS, TS
Swagger	Swagger
Mailing	Quarkus native, Java
MailDev	MailDev
RabbitMQ	RabbitMQ
Adminer (dev)	Adminer
Database	Postgres
Monitoring UI	Grafana
Monitoring	Prometheus

Services Architecture

Choice of technologies and uses

Nginx

We ensure that all the ports are not accessible from the outside. Only the ports 80 are accessible from the outside. For this task, we used Nginx as a reverse proxy to redirect the requests to the right service. It also serves the static files of the front-end.

We chose Nginx because it is very easy to configure and is widely used in the industry. Compared to other reverse proxies like Apache, Nginx is faster.

Frontend

More information about the front end here.

Angular was chosen by the client, so we had to use it. Nevertheless, there are plenty of frontend frameworks that could have been used. (e.g.: React, Vue, Svelte, etc.)

Backend REST API

More information about the backend here.

For the API, we used NestJS using TypeScript. This was also chosen by the client. NestJS is widely used in the industry and is a good framework to use.

Swagger API

Swagger API is a development tool to show the API documentation. It is run inside of the backend server. It was chosen by the client.

RabbitMQ

Used to send messages between the backend and the mail microservice with a queue system. We chose RabbitMQ because it is a very popular message broker. Other popular message brokers are Kafka and ActiveMQ.

Quarkus

This is the mail api which send mail to the MailDev service. At the production build, GraalVM is used to compile in native mode. The build does not require GraalVM or Quarkus, since it use docker for the build.

We chose Quarkus because it is a very popular Java framework, and it is very easy to use. It is also very fast and lightweight due to its native compilation. The side effect of the native compilation is that it is very slow to compile.

MailDev

Used to debug the emails sent by the mail microservice. It is a very simple and lightweight SMTP server that displays the emails sent to it.

Preview of a received email :

Admider

Adminer is a development tool to manage the database. It is a lightweight and easy to setup with preconfigured docker image.

(note: available only on development mode)

Prometheus

Prometheus is the center of the monitoring system. Prometheus plugs into the services to collect metrics and store them in a database (Pull and Store).

Monitored services are :

• Backend server
• Quarkus
• RabbitMQ

Other alternatives are InfluxDB (Push to Store), Graphgite or Kapacitor. It was recommended by the client.

Grafana

This is the interface to display the metrics stored by Prometheus. It is a very popular and quite modern with a pleasant interface that is easy to customize.

Here is an exemple of the monitoring dashboard for the backend server :

K6

K6 is a tool to operate load testing on our REST API. We run 4 types of tests : smoke test, load test, soak test and stress test. (select in the environment variable K6_TEST_TYPE)

K6 as the advantage of being very modern and frictionless to use. The setup of the routes and the tests are configured using Javascript which we are confortable with. To send the metrics of the load test to Prometheus, we used a middleware which is Statsd.

We could use other tools like wrk and locust wich are also widely used

Report on the Grafana dashboard :

Postgres

Postgres is the database used by the backend. We firstly attempted to MySQL and SQLite which lead numerous compatibility issues. We then switched to Postgres which made everything simpler.

You can inspect the raw content of the database using the adminer interface.

Hosted Demo

You can try the application on our server at:

• wm.fgdou.ovh/
• wm.fgdou.ovh/api/api
• wm.fgdou.ovh/maildev/
• wm.fgdou.ovh/rabbitmq/
• wm.fgdou.ovh/grafana/
• wm.fgdou.ovh/prometheus/

Note : Usernames and passwords for rabbitmq and postgres are in the .env file.