oslabs-beta/kubby-buddy-extension

Your container management buddy

Table of Contents

• About
• Demo
• Setup
• File Structure
• Contributing
• Dev Setup
• Progress
• Meet the Team
• License

ABOUT

Kubby Buddy is your container manegment buddy, giving you an easy to use GUI for all your Docker needs. All you need to do is launch our application, and your local images will load into our app, from there you can easily view, launch, stop and even delete your containers and images straight from our app. We also include metrics and even averages of your CPU and memory usgage utilizing a containerized database running on your local machine.

Demo

Here we can see creating a container from an image.

Here we can see our running containers, starting and stopping those containers as well as the logs for those containers.

Here we create a new volume, then delete it.

SETUP

Follow these steps for easy setup.

And you're done, enjoy the simplicity of using your new container management buddy.

File Structure

.
├── Dockerfile
├── LICENSE
├── Makefile
├── README.md
├── assets
├── backend
│   ├── package-lock.json
│   ├── package.json
│   └── server.js
├── docker-compose.yaml
├── docker.svg
├── metadata.json
└── ui
    ├── index.html
    ├── package-lock.json
    ├── package.json
    ├── src
    ├── tsconfig.json
    ├── tsconfig.node.json
    └── vite.config.ts

Contibuting

Contributing is what makes the open source community great. If you want to contribute to this project, you can follow these guidelines.

• Fork and clone the repository.
• Branch off the dev branch, with a branch name starting in feat, fix, bug, docs, test, wip or merge, then adding a new folder named whatever it is you are adding. (ex. feat/database)
• When you commit, be sure to follow conventional commit standards.
• Once your new feture is built out, you can submit a pull request to dev.

Local Development Setup

You can use docker to build, install and push your extension. Also, we provide an opinionated Makefile that could be convenient for you. There isn't a strong preference of using one over the other, so just use the one you're most comfortable with.

To build the extension, use make build-extension or:

  docker buildx build -t kubbybuddy/kubby-buddy-extension:latest . --load

To install the extension, use make install-extension or:

  docker extension install kubbybuddy/kubby-buddy-extension:latest

If you want to automate this command, use the -f or --force flag to accept the warning message.

To preview the extension in Docker Desktop, open Docker Dashboard once the installation is complete. The left-hand menu displays a new tab with the name of your extension. You can also use docker extension ls to see that the extension has been installed successfully.

Frontend Development Setup

During the development of the frontend part, it's helpful to use hot reloading to test your changes without rebuilding your entire extension. To do this, you can configure Docker Desktop to load your UI from a development server. Assuming your app runs on the default port, start your UI app and then run:

  cd ui
  npm install
  npm run dev

This starts a development server that listens on port 3000.

You can now tell Docker Desktop to use this as the frontend source. In another terminal run:

  docker extension dev ui-source kubbybuddy/kubby-buddy-extension:latest http://localhost:3000

In order to open the Chrome Dev Tools for your extension when you click on the extension tab, run:

  docker extension dev debug kubbybuddy/kubby-buddy-extension:latest

Each subsequent click on the extension tab will also open Chrome Dev Tools. To stop this behaviour, run:

  docker extension dev reset kubbybuddy/kubby-buddy-extension:latest

Backend development (optional)

This example defines an API in Go that is deployed as a backend container when the extension is installed. This backend could be implemented in any language, as it runs inside a container. The extension frameworks provides connectivity from the extension UI to a socket that the backend has to connect to on the server side.

Note that an extension doesn't necessarily need a backend container, but in this example we include one for teaching purposes.

Whenever you make changes in the backend source code, you will need to compile them and re-deploy a new version of your backend container. Use the docker extension update command to remove and re-install the extension automatically:

docker extension update kubbybuddy/kubby-buddy-extension:latest

If you want to automate this command, use the -f or --force flag to accept the warning message.

Extension containers are hidden from the Docker Dashboard by default. You can change this in Settings > Extensions > Show Docker Extensions system containers.

Clean up

To remove the extension:

docker extension rm kubbybuddy/kubby-buddy-extension:latest

Progress

Feature	Status
Image page
Container page
Add containerized database
Impliment Grafana
Bring extention to feature parody
Volume page
Add alerts for when buttons fail to load
Fix container not loading when started outside the app
Add more diverse and costomizable commands

• = Finished feature
• = Work in progress feature
• = Not yet started feature

Meet the Team!

Chang Moon

Josh Goo

Steve Lemlek

Trey Walker

William Reilly

License

This project is licensed under the terms of the MIT LICENSE.