Welcome to KubestellarUI! This guide will help you set up the KubestellarUI application on your local machine after cloning the repository for development. The application consists of two main parts:

1. Frontend: Built with React and TypeScript
2. Backend: Built with Golang using the Gin framework.

Before you begin, ensure that your system meets the following requirements:

• Version: 1.23.4
• Download Link: Golang Downloads

• Node.js Version: ≥ 16.x.x
• npm Version: Comes bundled with Node.js
• Download Link: Node.js Downloads

• Ensure Git is installed to clone the repository
• Download Link: Git Downloads

• Ensure you have access to a Kubernetes clusters setup with Kubestellar Getting Started Guide & Kubestellar prerequisites installed

• Kubestellar guide: Guide

git clone https://github.com/your-github-username/ui.git

cd ui

To configure the frontend, rename the example.env file to .env in the project root directory (where package.json is located).

Example .env file:

VITE_BASE_URL=http://localhost:4000
VITE_APP_VERSION=0.1.0
VITE_GIT_COMMIT_HASH=$GIT_COMMIT_HASH

This is because .env files are intended to be a personal environment configuration file. The included example.env in the repo is a standard that most other node projects include for the same purpose. You rename the file to .env and then change its contents to align with your system and personal needs.

KubestellarUI uses environment variables to track the app version and the current Git commit hash.

KubestellarUI uses Redis for caching real-time WebSocket updates to prevent excessive Kubernetes API calls.

Run Redis using Docker:

docker run --name redis -d -p 6379:6379 redis

Verify Redis is running:

docker ps | grep redis

cd backend

go mod download

go run main.go

The backend server will start on port 4000. You should see output indicating the server is running.

From the project root directory:

npm install

npm run dev

The frontend development server will start, typically on port 5173.

If you prefer to run the application using Docker Compose, follow these steps:

• Download Link: Docker Downloads

From the project root directory:

docker-compose up --build

To stop the application:

docker-compose down

For ongoing development, use the following steps:

• Quit the Application:

  docker-compose down

• Pull the Latest Changes:

  git pull origin main

• Restart the Application:

  docker-compose up --build

This will:

• Stop the running containers.
• Pull the latest source code changes.
• Rebuild and restart the application.

If you'd like to work with the Docker images for the KubestellarUI project, here's how you can use the latest and versioned tags:

1. Frontend Image:

   • Tag: quay.io/kubestellar/ui:frontend
   • Latest Version: latest
   • Specific Version (Commit Hash): frontend-<commit-hash>

2. Backend Image:

   • Tag: quay.io/kubestellar/ui:backend
   • Latest Version: latest
   • Specific Version (Commit Hash): backend-<commit-hash>

• Frontend Image:

  docker pull quay.io/kubestellar/ui:frontend

• Backend Image:

  docker pull quay.io/kubestellar/ui:backend

If you want to pull an image for a specific version (e.g., commit hash), use:

• Frontend Image with Version:

  docker pull quay.io/kubestellar/ui:frontend-abcd1234

• Backend Image with Version:

  docker pull quay.io/kubestellar/ui:backend-abcd1234

1. Backend API: http://localhost:4000
2. Frontend UI: http://localhost:5173