KubeBrowser

Appearance

Contribute ​

Repository architecture ​

.
├── dev                       # 🧑‍💻 Raw manifests and values for dev purposes
├── docs                      # This is what you are reading
├── scripts                   # 🧑‍💻 Useful scripts
├── server                    # API and Kubeconfig controller
├── ui                        # UI
├── .envrc                    # 🧑‍💻 Loads environment variables and devbox, used by `direnv`
├── devbox.json               # 🧑‍💻 Devbox config
├── pnpm-workspace.yaml       # 🧑‍💻 Both UI and the docs are VueJS projects
├── .pre-commit-config.yaml   # 🧑‍💻 Precommit config
└── Tiltfile                  # 🧑‍💻 Tilt config

Things noted with 🧑‍💻 are purely for development purposes.

Local setup ​

Kubebrowser uses some tool for development purposes. Some are optional for minor changes, though I recommend to grab them all for an optimal developer experience.

  • Devbox creates isolated shells for development. Simply run devbox shell after installing devbox. Devbox also installs every binary you need (golang, nodejs) at the same version for everyone working on the project.
  • Only for backend Tilt eases development on Kubernetes.
  • Optional pre-commit asserts file formating upon commit.
  • Optional direnv loads dynamically content of .envrc.

Contribute on the UI ​

The UI is a VueJS project. It can run and simulate API responses without the server or Kubernetes cluster to be running.

Prerequisites ​

INFO

Either use Devbox as stated above or check in devbox.json for the version you should use for.

  • NodeJS
  • pnpm

Make the UI run ​

  1. At the project root, run pnpm install.
  2. pnpm dev:ui.
  3. Access http://localhost:5173/ 🎉

Contribute on the server ​

Prerequisites ​

INFO

Either use Devbox as stated above or check in devbox.json for the version you should use for.

  • A local Kubernetes cluster running, we recommend minikube. 🚨 This step should be done regardless of the use of Devbox.
  • kubectl and helm CLI.
  • Golang.
  • Tilt and ko.
  • UI prerequisites.
  • An OpenID provider with an application set up. It could be any OIDC compatible provider, like a local Keycloak or even Google.

Run Kubebrowser locally ​

Set up your environment

  1. Create a new OIDC application following your provider's documentation (you can set the redirect address to http://localhost:8080).
  2. Copy the ./dev/values.example.yaml to a new file named ./dev/values.yaml.
  3. Update client_id, client_secret and issuer_url in the newly created ./dev/values.yaml (from your OIDC application in step 1).
  4. Make sure your cluster is running and your context is correct. Run minikube start if you're using minikube.
  5. Add Helm repository, it should be named "avisto" for Tilt to work correctly helm repo add avisto https://avistotelecom.github.io/charts/.
  6. Run tilt up.
  7. Access http://localhost:8080 🎉

INFO

Frontend is compiled once at startup. If you want to work heavily on the UI, please follow the Contribute on the UI instead.

Contribute on the documentation ​

The documentation is like a VueJS project using Vitepress.

Prerequisites ​

Same as UI prerequisites.

Make the UI run ​

  1. At the project root, run pnpm install.
  2. pnpm dev:docs.
  3. Access http://localhost:5173/ 🎉