Skip to main content

Remix App

info

Make sure you have followed the installation guide before continuing.

Remix is a full stack web framework that lets you focus on the user interface and work back through web standards to deliver a fast, slick, and resilient user experience.

This stack is based on Remix Indie Stack and optimized by Heighliner core team. Currently the stack includes below core features:

Through this tutorial, you will experience all above exciting features in a Remix app with just one command.

What's more, the whole stack will be spinned up in just few minutes.

Let's begin traveling!

Create A New Remix Application​

hln up remix-note-app -s remix -i

The command hln up is the only command that will be typed by you, which means the command will do all of the things.

Option -s specify the chosen stack, here it's remix, option -i will enter interactive mode, you need to input several required parameters step by step, for more details about parameters or error printed, you could view Installation Guide

remix-hln-up

When hln up command completed successfully, the output should be like this:

output

If you don't get output like this or some error printed on screen, feel free to give us a feed back at Heighliner Issue, thanks.

What Happend Just Now?​

The hln up command will set up a several of components that preconfigured in remix stack. Range from infrastructure level to application level, below is a full list:

tip

To be able to access your applications created by Heighliner, make sure you have set your local hosts, or you could follow instructions from Setting Local Hosts

1. Two Git Repositories​

Firstly, two Git repositories are created on your GitHub organization, one repository contains whole Remix Indie Stack source code and another repository contains Helm charts source code which will be pulled and deployed by ArgoCD. For more Helm details, you can view Helm docs.

git-repo

You could view .github/workflows/docker-publish.yml file from your remix-note-app repository, which is added by Heighliner stacks engine to set up a CI pipeline.

2. A Online Running Remix Application​

You could view your remix application site at remix-note-app.h8r.site like this:

remix-app

3. A ArgoCD Application​

ArgoCD is a declarative, GitOps continuous delivery tool for Kubernetes. The remix stack uses ArgoCD to deploy new releases of your remix application, Heighliner stacks engine connects them together automatically and handles all tough configuration tasks.

You could view your ArgoCD dashboard at argocd.h8r.site like this:

argo-cd

4. A Prometheus Application​

Prometheus is an open-source monitoring framework, it provides out-of-the-box monitoring capabilities for the Kubernetes. The remix stack uses Prometheus to collect monitoring metrics.

You could view your Prometheus dashboard at prometheus.h8r.site like this:

prometheus-dashboard

5. A Grafana Application​

Grafana is a multi-platform open source analytics and interactive visualization web application. The remix stack heavily uses Grafana to visualize all collected metrics and logs from infrastructure and your own applications.

You could view your Grafana dashboard at grafana.h8r.site like this:

grafana-dashboard

6. A Nocalhost Application​

Nocalhost is an open-source IDE plugin for cloud-native applications development. The remix stack uses Nocalhost to make Develop In Cloud come true. Underneath, Nocalhost will set up an isolated development space in Kubernetes for every developer.

nocalhost-dashboard

Setting Local Hosts​

info

Below is assuming you don't own a real domain name and use h8r.site as your domain name. In production, we recommend setting your DNS record to the public ingress IP.

tip

if you are using h8r.site as your host, you can skip this step. because it is dns resolvable to 127.0.0.1.

Get your ingress ip:

127.0.0.1

Add hosts to your localhost(replace <ingress-ip> with above result):

<ingress-ip> argocd.h8r.site
<ingress-ip> grafana.h8r.site
<ingress-ip> alert.h8r.site
<ingress-ip> prometheus.h8r.site
<ingress-ip> nocalhost.h8r.site
<ingress-ip> remix-note-app.h8r.site
tip

if you are using vpn(eg: clashX\Shadowsocks), you need to close the vpn.

Cleanup​

hln down remix-note-app

The hln down command will delete all resources created by hln up, such as Git repositories, Kubernetes deployments, databases.