What You’ll Learn In this tutorial, you’ll deploy a fullstack web application — a frontend, backend, and database — to Kubernetes using mogenius. You’ll start from GitHub repositories, connect a cluster, and set up CI/CD pipelines to deploy everything in a clean, self-service workflow.
It’s designed for developers who want to build and operate microservices on Kubernetes without needing deep platform knowledge . The mogenius Operator and Platform handle the Kubernetes complexity, while you focus on code.
Architecture Overview Your application consists of three components:
Frontend : Static HTML/CSS/JS served via NGINX Backend : Node.js (Express) API Database : MariaDB
# Architecture Diagram
Browser
|
v
[frontend.mycluster.mogenius.app] (NGINX)
|
v
[backend.internal] (Express.js)
|
v
[MariaDB Service]
All services are deployed inside a mogenius Workspace , isolated in a dedicated Namespace on your Kubernetes cluster.
Prerequisites To follow along, you'll need:
A GitHub account A mogenius account (free plan available) A connected Kubernetes cluster (mogenius supports any) git and a code editor
1. Connect Your Kubernetes Cluster Log in to mogenius. Navigate to Clusters → click Connect Cluster . Follow the instructions to install the mogenius operator on your cluster.
Once your cluster is connected, the operator automatically installs a metrics-server. If you don’t have them already, you can install baseline components like Ingress controller (Traefik), cert-manager and clusterIssuer (Let’s Encrypt) from the cluster settings.
2. Create a Workspace and Namespace Go to Workspaces , click Create Workspace . This provides you with a streamlined environment for multiple namespaces and managing RBAC. Name your workspace (e.g. comment-app), invite other users if needed. Inside the workspace, create a Namespace (e.g. dev)
3. Deploy the Frontend (NGINX) Step 1: Prepare the GitHub Repo Create a GitHub repo for your frontend (HTML, CSS, JS). Include a basic Live Server–style index.html.
Sample file structure:
# Frontend Directory
/frontend
├── index.html
├── style.css
└── script.js
Step 2: Add a Dockerfile # Dockerfile for Frontend
FROM nginx:alpine
COPY . /usr/share/nginx/html
The Dockerfile will be used by the mogenius pipeline starter to build your image. You can use this template and push it to your Github repo.
Step 3: Set Up the Pipeline in mogenius mogenius integrates with Github actions and provides a pipeline starter. This creates a workflow that builds your image with Github actions, pushes it to your container registry, and then calls the mogenius API to make the operator set the new image in your Kubernetes deployment.
In your workspace, click Add Resource → Pipeline Starter . Connect your GitHub account and select the frontend repository. mogenius will: Build your Docker image Create a deployment in Kubernetes based on a template Set the image once the pipeline is finished.
You can monitor the Github actions workflow in mogenius on the build log in your application. After a moment, a new Pod will be created with your image and the deployment is complete!
Step 4: Expose your Frontend To make our frontend available from the internet, an external hostname is required. In Kubernetes this is solved with an ingress and a service. We can add both through the settings "Ports & Domain" of the application.
Add the internal and external port. For nginx this is 80:80. Activate the toggle "Expose". The form field for your hostname will appear. Enter the host that you want to use (e.g. myapp.com) Make sure that a DNS record exists for this domain that points to the external IP address of your cluster. You can find the IP address in your cluster settings in mogenius.
That's it, your frontend is now live!
4. Deploy the Backend (Express API) Step 1: Create Backend Repo In a new GitHub repo, scaffold an Express app. Here's a boilerplate for a basic Express app that you can use.
// server.js - Node.js/Express Backend Code
const express = require ( "express" );
const cors = require ( "cors" );
const app = express();
app.use(cors());
app.use(express.json());
let messages = [];
app.get( "/messages" , ( req, res ) => {
res.json(messages);
});
app.post( "/messages" , ( req, res ) => {
messages.push({ author : req.body.author, message : req.body.message });
res.status( 201 ).send( "OK" );
});
app.listen( 3000 , () => console .log( "Server running on port 3000" ));
Step 2: Add a Dockerfile # Dockerfile for Backend
FROM node: 18 -alpine
WORKDIR /app
COPY . .
RUN npm install
EXPOSE 3000
CMD [ "node" , "server.js" ]
Just like with the frontend we'll add a Dockerfile to the repository to build our Docker image.
Step 3: Create Backend Service via Pipeline Starter Repeat the pipeline setup:
In mogenius, choose Pipeline Starter and select the repo that you want to deploy Once your container is deployed, go to Ports & Domain and add the container and service port. Expose it to create a hostname that you're frontend will target for requests (e.g. backend.myapp.com)
5. Set Up the Database (MariaDB) For this tutorial you'll be using a public MariaDB Docker image. Please note that this is not meant to run in production.
Step 1: Add New Resource in mogenius We can deploy images straight from any container registry with mogenius.
In your mogenius workspace click Add Resource → Container image Set a name and namespace for the MariaDB As container image set: mariadb:10.11
Step 2: Configure Environment Variables In your deployment settings open environment variables. Add the following variables and make sure to define the variable MYSQL_PASSWORD as type Secret.
# MariaDB Environment Variables
MYSQL_ROOT_PASSWORD = rootpass
MYSQL_DATABASE = comments
MYSQL_USER = appuser
MYSQL_PASSWORD = securepass
After saving your settings the pod will restart and the environment variables are available in the container.
Step 3: Define the Port Open Ports & Domains in your deployment settings and add the port 3306 for container and service port. Exposing your application is not recommended for security reasons - your backend container can connect to the database inside Kubernetes via internal hostname. The internal hostname of each application is [name]:[port], so for MariaDB in this case it's mariadb:3306.
6. Connect Backend to Database Clone the backend repository locally and open it in your IDE. We'll now connect backend and database in your code base.
Step 1: Add MariaDB Client in Backend Install the MariaDB client as an npm package in your Express application.
# Command to Install MariaDB Client
npm install mariadb
Step 2: Use Connection Pool in server.js Define a connection pool in your server.js. The connection details like Host, user, password, and database will be passed as environment variables in the next step.
// server.js - Setting Up MariaDB Connection Pool
const mariadb = require ( "mariadb" );
const pool = mariadb.createPool({
host : process.env.DB_HOST, // set this to the internal DNS of your DB service
user : process.env.MYSQL_USER,
password : process.env.MYSQL_PASSWORD,
database : process.env.MYSQL_DATABASE,
connectionLimit : 5 ,
});
app.get( "/messages" , async (req, res) => {
let conn;
try {
conn = await pool.getConnection();
const rows = await conn.query( "SELECT * FROM messages" );
res.json(rows);
} catch (err) {
res.status( 500 ).send(err.message);
} finally {
if (conn) conn.end();
}
});
Commit and push your changes to Github. The pipeline will be triggered and a new image of your backend application will be deployed to Kubernetes. Monitor the process in mogenius and once it's finished, proceed with the next step.
Step 3: Define environment variables in the Backend deployment Open your Express deployment in the mogenius workspace and go to Settings > Environment Variables. Define the environment variables DB_HOST, MYSQL_USER, MYSQL_PASSWORD (as a Secret), and MYSQL_DATABASE, matching the credentials that you set up in your MariaDB.
7. Connect Everything and Test Finally, we'll connect the frontend. Clone the frontend repository locally and open it in your IDE.
Update your frontend script.js to call the backend:
// script.js - Fetching Data from Backend
fetch( "https://backend.myapp.com/messages" )
.then( ( res ) => res.json())
.then( ( data ) => console .log(data));
Commit and push your changes to Github. Monitor the workflow in mogenius and once the new frontend image is deployed, open your external hostname myapp.com. You should see the request in the logs of your backend Pod.
That's it! With just a few steps you've successfully created a boilerplate setup of a microservice architecture, deployed it to Kubernetes, and enabled a CI/CD pipeline.
What’s Next? Continue development:
Just push to GitHub — mogenius builds and redeploys your changes. Pipelines are auto-triggered on every commit.
Improve resilience and quality:
Add health checks and readiness probes Define resource limits (CPU, memory) Use Secrets & KeyVault for safe configuration Monitor your services via the built-in observability tools
Ready to Go Deeper? Now that you’ve deployed your fullstack app on Kubernetes with mogenius, there’s so much more you can do to harden, scale, and polish your setup. These reads will help you take the next steps with confidence:
Start strong
Quick Start with mogenius:
Improve reliability
Kubernetes Health Checks:
Secure your setup
Enhancing Kubernetes Security
Secrets and KeyVault
Get production-ready
Introducing Helm for Kubernetes
Best Practices for Kubernetes YAML
Summary With mogenius, you deployed a fullstack microservice app — frontend, backend, and database — to Kubernetes, using GitHub and pipelines. You didn’t write a single Kubernetes manifest or need direct cluster access.
From GitHub commit to production-ready deployment in minutes.
