I turned my company’s PC into my own “Vercel-like” platform
Tags: kubernetes, devops, opensource, diginext
Published: 2023-06-13 12:30:23

## Why?

- Because… why not? (it’s ***FREE***, lol)
- Utilize the power of my own PC to build web apps faster *(with zero build time cost)*.
- Kubernetes is hard & pushing developers to learn it even harder, well, I learned it so you don't have to.
- Unlike Vercel, with Kubernetes cluster, I (and my teammates) can deploy ANY apps.

## Requirements

- A computer (obviously!) with [Ubuntu Server](https://ubuntu.com/download/server) OS
    - Specification at least: 2 core, 4GB memory
    - Recommendation: 4 core, 8GB memory
    (because MicroK8S will take around 2,5GB of memory to run, but you will also need some for your applications)
    - DigitalOcean has some droplets with good pricing tiers.
- [MicroK8S](https://microk8s.io/) to spin up a Kubernetes cluster
- Lastly, this magical open-source tool: [Diginext](https://github.com/digitopvn/diginext)

## Architecture

In this case, I use my company’s PC (Ubuntu Server OS, 1TB SSD drive, 8 core, 32GB of memory)

![diginext-vercel-like-architecture.drawio.png](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qwzfpe549nsebojsxrv2.png)

## Install MicroK8S & deploy Diginext Server

```bash
curl -sfL https://diginext.site/install/microk8s | sh -
```

After it’s finished, you can try to access this URL: [http://server-ip-address](http://server-ip-address/), if you can see the log in / sign up screen, then your cluster is ready!

> *For example: [http://192.168.0.52](http://192.168.0.52)*
> 

## Create new account

Navigate to: [http://server-ip-address](http://your-ip-address) then create a new account.

![Create new account](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sk1upu0q9a6f3tuzet6u.png)

### Then create your first workspace

Give your workspace a name, leave `public` unchecked if you don't want other people to freely access your workspace, then submit & you’re good to go.

## Connect Diginext CLI to your workspace

To be able to deploy webapp to your MicroK8S cluster from your computer, you will need to install Diginext CLI and connect it to your Diginext workspace.

Open the terminal and install **Diginext CLI** with:

*(If you don’t have Node.js 18+ installed, get it first)*

```bash
npm i @topgroup/diginext --location=global
```

After it’s finished, you can use `dx` commands. 

But first, let’s connect your **Diginext CLI** to the workspace:

```bash
dx login http://your-ip-address
# the browser will open up, copy & paste the access token here
# you will see a success message
```

## Deploy a static webapp

- **Diginext Server** need permissions to pull the git repository and start building, so let’s navigate to [http://](http://your-ip-address/git)[server](http://your-ip-address)[-ip-address/git](http://your-ip-address/git) and connect your Bitbucket or Github account.

    ![connect your Github account](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sz2xbum8azvzbny8sy41.png)
    
- **Diginext Server** also need a **container registry** to store the build image, I will use **Docker Hub** in this example. Navigate to [http://your-ip-address/infrastructure/registry/](http://your-ip-address/infrastructure/registry/) and connect your Docker Hub with username & password.
    
    ![connect your Docker Hub](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hevue3j7uqme83okr9f5.png)
    
- When it’s done, back to your Terminal and create a new app with `dx new` command & fill in the form:
    - Project: **Hello World**
    - App: **Static Site**
    - Framework: pick **“Static Site Framework”**
    - Git provider: select the one you have connected recently.
- Navigate to the directory: `cd ./helloworld-staticsite` and you will see the source code of the framework, nothing special here, just a static html files and a `Dockerfile`
- Deploy to your MicroK8S cluster using this command: `dx up`
It will request your Diginext Server to pull the git repo of the webapp, then build the container image from the `Dockerfile`, and deploy it the MicroK8S cluster.
    - Cluster: pick **“Default Cluster”**
    - Use generated domain: **YES**
    - Port: **80**
- Now check out the link in the Terminal to see the build & deploy process, something like this:
    
    ![build & deploy process](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bwv51x4nmdb0tuivp18n.png)

When it’s finished, click on the auto-generated link, you will see your web app now going live, woohoo!

> 👉 Since I have only set up this server for internal use, if you want to publish it on the internet, you may need to expose some ports on your internet router and configure traffic routing / security guards to your metal server. However, this is beyond the scope of this article.

## What’s next?

Learn more about the stories of [Diginext](https://github.com/digitopvn/diginext/).