feat: labels filtering & improve ui styles

docs/README.md

@@ -3,6 +3,7 @@
 * [Developer Guide](./developer/README.md)
 
   * [Getting started](./developer/getting-started.md)
+  * [Architecture](./developer/architecture.md)
   * [API Specification](./developer/api-specification.md)
   * [Packaging Helm-chart](./developer/helm-chart.md)
   * [Web-Terminal Developer Guide](./developer/app-terminal.md)

docs/developer/README.md

@@ -1,8 +1,8 @@
 # Developer guide
 
 * [Getting started](./getting-started.md)
+* [Architecture](./architecture.md)
 * [API Specification](./api-specification.md)
 * [Packaging Helm-chart](./helm-chart.md)
 * [Web-Terminal Developer Guide](./app-terminal.md)
 * [Graph Developer Guide](./app-graph.md)
-

docs/developer/api-specification.md

@@ -1,43 +1,30 @@
 # API Specification
 
 ## Backend
+> kubernetes@in-cluster : in-cluster name
+> kubernetes-admin@kubernetes : kubeconfig default context name
 
 
 |URL Pattern                        |Method |설명                                     |
 |---                                |---    |---                                      |
 |/api/clusters                      |GET    |k8s cluster context 리스트 조회          |
 |/api/clusters/:cluster/topology    |GET    |토플로지 그래프 조회                     |
-|/api/topology                      |GET    |토플로지 그래프 조회 (default cluster)   |
 |/api/clusters/:cluster/dashboard   |GET    |Dashboard 데이터 조회                    |
-|/api/dashboard                     |GET    |Dashboard 데이터 조회 (default cluster)  |
-
-### prerequisites
-
-* get a token
-
-```
-COOKIE="$(pwd)/token.cookies"
-curl -X POST -H "Content-Type: application/json" --cookie-jar "${COOKIE}" http://localhost:3001/api/token -d @- <<EOF
-{
-    "secret": "eyJhbGciOiJSUzI1NiIsImtpZCI6IlFwOVFFQTRZcGFTZHExSUNYV3RtUlJHM3JkLV83akxzQU5sZ1BzSXk4eEEifQ.eyJpc3MiOiJrdWJlcm5ldGVzL3NlcnZpY2VhY2NvdW50Iiwia3ViZXJuZXRlcy5pby9zZXJ2aWNlYWNjb3VudC9uYW1lc3BhY2UiOiJrb3JlIiwia3ViZXJuZXRlcy5pby9zZXJ2aWNlYWNjb3VudC9zZWNyZXQubmFtZSI6ImtvcmUtYm9hcmQtdG9rZW4tNzdiZGciLCJrdWJlcm5ldGVzLmlvL3NlcnZpY2VhY2NvdW50L3NlcnZpY2UtYWNjb3VudC5uYW1lIjoia29yZS1ib2FyZCIsImt1YmVybmV0ZXMuaW8vc2VydmljZWFjY291bnQvc2VydmljZS1hY2NvdW50LnVpZCI6IjI3MjdhZmIzLWQ1YWEtNGEzZi05NzY2LTM2OWM4NGM2ODU5MiIsInN1YiI6InN5c3RlbTpzZXJ2aWNlYWNjb3VudDprb3JlOmtvcmUtYm9hcmQifQ.y934q_JkTiy2Es_54cMXsPtb6BL_qmlSK_xhay6kPEXsj66D-25iy8Jvau3KP1KLZI3TStA37P1VGA5jRhKECyeFxi1Vjmye0gubyCsGdi8zAc8Alhwfbv9fhQXUXaYrGEDvLjeGCx0vTYIFwilWpW4vsOqj8dv68jb18jAdnjiDbW7mEs_uWnJjCML0p_rYNyeFR4G5ONv3STFRXVhTz-T1n0OZQiirIPuJaVWm_ooBmYAWo_wOPIGTk7u1Q8v3ORYmBlTmlEq-SdoaTdqQgO1vS22nAXxh2GFvpdli6Jg3GD7gaKD92WYMXPC7jXnySKj9iVI0swnoLfOzBkg-5A"
-}
-EOF
-```
 
 * Examples
 
 ```
-$ curl -X GET -b "${COOKIE}" http://localhost:3001/api/clusters
-$ curl -X GET -b "${COOKIE}" http://localhost:3001/api/topology
-$ curl -X GET -b "${COOKIE}" http://localhost:3001/api/clusters/apps-05/dashboard
+$ curl -X GET http://localhost:3001/api/contexts
+$ curl -X GET http://localhost:3001/api/clusters/kubernetes@in-cluster/topology
+$ curl -X GET http://localhost:3001/api/clusters/kubernetes@in-cluster/dashboard
 ```
 
 
-## Kubernetes Raw API
+### Backend kubernetes Raw API
 > 멀티 클러스터를 지원하는 Kubernetes API Proxy API
 
 
-### Kubernetes API
+#### Kubernetes API
 * [Kubernetes API Concepts](https://kubernetes.io/docs/reference/using-api/api-concepts/)
 * [OepnAPI spec.](https://raw.githubusercontent.com/kubernetes/kubernetes/master/api/openapi-spec/swagger.json)
 * Kubernetes API 에서 제공하는 resource 와 resource의 api-group은 `kubectl api-resources -o wide` 으로 resource와 apiGroup 조회 가능
@@ -50,7 +37,7 @@ $ kubectl get crd
 $ kubectl get crd virtualservices.networking.istio.io -o jsonpath="{.spec.group}"
 ```
 
-### URL Pattern
+#### URL Pattern
 
 * URL Patter은 다음과 같이 URL Prefix : `/raw` 와 kubernetes-api URL로 구성
 * kubernetes-api 는 각 resource 의 `metadata.selfLink` 참조 가능
@@ -66,18 +53,17 @@ $ kubectl get crd virtualservices.networking.istio.io -o jsonpath="{.spec.group}
   * `:apiGroups` : Resource groups 
 
 
-### Apply APIs
+#### Apply APIs
 > Create a resource
 
 |URL Pattern            |Method |설명                     |
 |---                    |---    |---                      |
 |/raw/clusters/:cluster |POST   |Applay                   |
-|/raw                   |POST   |Apply (default cluster)  |
 
 * Example
 
 ```
-$ curl -X POST -H "Content-Type: application/json" -b "${COOKIE}" http://localhost:3001/raw -d @- <<EOF
+$ curl -X POST -H "Content-Type: application/json" http://localhost:3001/raw/clusters/kubernetes@in-cluster -d @- <<EOF
 {
     "apiVersion": "v1",
     "kind": "Namespace",
@@ -88,13 +74,12 @@ $ curl -X POST -H "Content-Type: application/json" -b "${COOKIE}" http://localho
 EOF
 ```
 
-### Update APIs
+#### Update APIs
 > Update a resource
 
 |URL Pattern            |Method |설명                     |비고             |
 |---                    |---    |---                      |---              |
 |/raw/clusters/:cluster |PATCH  |Update                   |                 |
-|/raw                   |PATCH  |Update (default cluster) |                 |
 
 
 * Reuqest Header `Content-Type` 으로 patch 방식 선택 (
@@ -107,7 +92,7 @@ EOF
 * JSON merge patch example
 
 ```
-$ curl -X PATCH -H "Content-Type: application/merge-patch+json" -b "${COOKIE}" http://localhost:3001/raw/api/v1/namespaces/default/pods/busybox -d @- <<EOF
+$ curl -X PATCH -H "Content-Type: application/merge-patch+json" http://localhost:3001/raw/clusters/kubernetes@in-cluster/api/v1/namespaces/default/pods/busybox -d @- <<EOF
 {
     "metadata": {
         "labels": {
@@ -123,7 +108,7 @@ $ kubectl get po busybox -n default  -o jsonpath="{.metadata.labels}"
 * JSON patch example
 
 ```
-$ curl -X PATCH -H "Content-Type: application/json-patch+json" -b "${COOKIE}" http://localhost:3001/raw/api/v1/namespaces/default/pods/busybox -d @- <<EOF
+$ curl -X PATCH -H "Content-Type: application/json-patch+json" http://localhost:3001/raw/clusters/kubernetes@in-cluster/api/v1/namespaces/default/pods/busybox -d @- <<EOF
 [
     {
         "op": "replace", 
@@ -138,7 +123,7 @@ $ kubectl get po busybox -n default -o jsonpath="{.metadata.labels}"
 
 
 
-### Resources 분류
+#### Resources 분류
 
 * Resources는 다음과 같이 4가지로 분류 가능
 
@@ -151,7 +136,7 @@ $ kubectl get po busybox -n default -o jsonpath="{.metadata.labels}"
 
 
 
-### Core Resources APIs
+#### Core Resources APIs
 
 |URL                                                                        |Method |설명                             |
 |---                                                                        |---    |---                              |
@@ -165,7 +150,7 @@ $ kubectl get po busybox -n default -o jsonpath="{.metadata.labels}"
 |/raw/clusters/:cluster/api/:version/namespaces/:namespace/:resource/:name  |PATCH  |N\namespaced 리소스 수정         |
 
 
-### apiGrouped Resource APIs
+#### apiGrouped Resource APIs
 
 |URL                                                                                  |Method |설명                             |
 |---                                                                                  |---    |---                              |
@@ -178,11 +163,11 @@ $ kubectl get po busybox -n default -o jsonpath="{.metadata.labels}"
 |/raw/clusters/:cluster/apis/:apiGroup/:version/namespaces/:namespace/:resource/:name |DELETE |namespaced 리소스 삭제           |
 |/raw/clusters/:cluster/apis/:apiGroup/:version/namespaces/:namespace/:resource/:name |PATCH  |namespaced 리소스 수정           |
 
-### CRUD examples
+#### CRUD examples
 
 ```
 # Create
-$ curl -X POST -H "Content-Type: application/json" http://localhost:3001/raw -d @- <<EOF
+$ curl -X POST -H "Content-Type: application/json" http://localhost:3001/raw/clusters/kubernetes@in-cluster -d @- <<EOF
 {
     "apiVersion": "v1",
     "kind": "Namespace",
@@ -193,10 +178,10 @@ $ curl -X POST -H "Content-Type: application/json" http://localhost:3001/raw -d
 EOF
 
 # Get
-$ curl -X GET http://localhost:3001/raw/api/v1/namespaces/test-namespace
+$ curl -X GET http://localhost:3001/raw/clusters/kubernetes@in-cluster/api/v1/namespaces/test-namespace
 
 # Update
-$ curl -X PATCH -H "Content-Type: application/merge-patch+json" -b "${COOKIE}" http://localhost:3001/raw/api/v1/namespaces/test-namespace  -d @- <<EOF
+$ curl -X PATCH -H "Content-Type: application/merge-patch+json" http://localhost:3001/raw/clusters/kubernetes@in-cluster/api/v1/namespaces/test-namespace  -d @- <<EOF
 {
     "metadata": {
         "labels": {
@@ -210,22 +195,20 @@ EOF
 $ kubectl  get ns/test-namespace -o jsonpath={.metadata.labels.istio-injection}
 
 # Delete
-$ curl -X DELETE -b "${COOKIE}" http://localhost:3001/raw/api/v1/namespaces/test-namespace
+$ curl -X DELETE http://localhost:3001/raw/clusters/kubernetes@in-cluster/api/v1/namespaces/test-namespace
 
 # List
-$ curl -X GET -b "${COOKIE}" http://localhost:3001/raw/api/v1/namespaces
+$ curl -X GET http://localhost:3001/raw/clusters/kubernetes@in-cluster/api/v1/namespaces
 ```
 
 
 ## Metrics-Scraper
 
-|URL Pattern                                                                  |Method |설명                               |
-|---                                                                          |---    |---                                |
-|/api/v1/clusters/:cluster                                                    |GET    |클러스터 summary metrics  조회     |
-|/api/v1/clusters/:cluster/nodes/:node/metrics/:metrics                       |GET    |클러스터 Node metrics 조회         |
-|/api/v1/nodes/:node/metrics/:metrics                                         |GET    |default 클러스터 노드 metrics 조회 |
-|/api/v1/clusters/:cluster/namespaces/:namespaces/pods/:pod/metrics/:metrics  |GET    |클러스터 Pod metrics 조회          |
-|/api/v1/namespaces/:namespaces/pods/:pod/metrics/:metrics                    |GET    |default 클러스터 Pod metrics 조회  |
+|URL Pattern                                                 |Method |설명                       |
+|---                                                         |---    |---                        |
+|/api/v1/clusters/:cluster                                   |GET    | summary metrics  조회     |
+|/api/v1/clusters/:cluster/nodes/:node                       |GET    | Node metrics 조회         |
+|/api/v1/clusters/:cluster/namespaces/:namespaces/pods/:pod  |GET    | Pod metrics 조회          |
 
 * 변수
   * `:cluster` : Kubeconfig context name
@@ -236,10 +219,9 @@ $ curl -X GET -b "${COOKIE}" http://localhost:3001/raw/api/v1/namespaces
 * Examples
 
 ```
-$ curl -X GET http://localhost:8000/api/v1/clusters/apps-05/nodes/apps-114/metrics/cpu
-$ curl -X GET http://localhost:8000/api/v1/nodes/apps-114/metrics/cpu
-$ curl -X GET http://localhost:8000/api/v1/clusters/apps-06/namespaces/default/pods/dnsutils-797cbd6f5f-8sq8t/metrics/memory
-$ curl -X GET http://localhost:8000/api/v1/namespaces/default/pods/dnsutils-797cbd6f5f-8sq8t/metrics/memory
+$ curl -X GET http://localhost:8000/api/v1/clusters/kubernetes@in-cluster
+$ curl -X GET http://localhost:8000/api/v1/clusters/kubernetes@in-cluster/nodes/vm-live-01
+$ curl -X GET http://localhost:8000/api/v1/clusters/kubernetes@in-cluster/namespaces/default/pods/busybox
 ```
 
 

docs/developer/architecture.md

@@ -0,0 +1,32 @@
+# Architecture
+
+Kore-Board 프로젝트는 Frontend, Backend, Metric-Scraper, Terminal 4가지 컴포넌트로 구성됩니다.
+
+Frontend는 브라우저에서 실행되는 단일 페이지 웹 애플리케이션으로 표준 HTTP 메서드를 사용하여 Backend에서 비즈니스 데이터를 조회합니다.
+
+Backend는 데이터 요청을  원격 쿠버네티스 API로 프록시 처리하거나 비즈니스 로직을 구현하는 HTTP 서버로 원격 쿠버네티스 API가 필요한 정보를 직접 지원하지 않는 경우 비즈니스 로직을 구현합니다.
+
+Metric-Scraper는 [metrics-server](https://github.com/kubernetes-sigs/metrics-server) 로 부터 주기적으로 메트릭 정보를 수집하고 저장하고 UI 요청에 따라 backend 를 거쳐 Frontend 에 매트릭 데이터를 제공합니다.
+
+Terminal은 웹 UI에서 클러스터 및 파드 실행 터미널 서비스를 제공합니다.
+
+아래 그림은 프로젝트의 아키텍처를 간략하게 보여줍니다.
+
+![Architecture Overview](../images/architecture.png)
+
+
+* Frontend
+  * Vue, NuxtJS framework
+  * source code : src/app/frontend
+
+* Backend
+  * Golang
+  * 소스코드 위치 src/app/backend 디렉토리
+
+* Metric-Scraper
+  * Golang
+  * source code : src/app/metric-server
+
+* Terminal
+  * Golang
+  * source code : src/app/terminal

docs/user/installation.md

@@ -13,8 +13,12 @@ $ kubectl get po  -n kube-system | grep metrics-server
 # installation
 $ kubectl apply -f https://github.com/kubernetes-sigs/metrics-server/releases/latest/download/components.yaml
 ```
+* if necessary, add a startup option `--kubelet-insecure-tls` 
 
-* add startup option `--kubelet-insecure-tls` 
+* or apply "metrics-server" with options `--kubelet-insecure-tls`
+```
+$ kubectl apply -f https://raw.githubusercontent.com/kore3lab/dashboard/master/scripts/install/metrics-server/metrics-server-v0.5.1-kubelet-insecure-tls.yaml
+```
 
 ## Kubernetes
 
@@ -36,6 +40,7 @@ $ kubectl delete -f ./scripts/install/kuberntes/recommended.yaml
 * Installation
 
 ```
+$ kubectl create ns kore
 $ helm install -n kore kore-board ./scripts/install/kuberntes/helm-chart/ \
   --set backend.service.type=NodePort \
   --set backend.service.nodePort=30081 \

package.json

@@ -1,6 +1,6 @@
 {
   "name": "kore-board",
-  "version": "0.4.0",
+  "version": "0.4.2",
   "description": "Kubernetes multi-clusters dashboard",
   "repository": {
     "type": "git",

scripts/install/kuberntes/helm-chart/Chart.yaml

@@ -1,6 +1,6 @@
 apiVersion: v2
 name: kore-board
 type: application
-version: 0.4.0
-appVersion: v0.4.0
+version: 0.4.2
+appVersion: v0.4.2
 description: Kubernetes multi-clusters dashboard

scripts/install/kuberntes/helm-chart/templates/cluster-role.yaml

@@ -1,9 +1,13 @@
 kind: ClusterRole
 apiVersion: rbac.authorization.k8s.io/v1
 metadata:
-  labels:
-    app: {{ .Chart.Name }}
   name: {{ .Chart.Name }}
+  labels:
+    app.kubernetes.io/part-of: {{ .Chart.Name }}
+    app.kubernetes.io/instance: {{ .Release.Name }}
+    app.kubernetes.io/version: {{ .Chart.AppVersion }}
+    app.kubernetes.io/managed-by: helm
+    helm.sh/chart: {{ .Chart.Name }}-{{ .Chart.Version | replace "+" "_" }}
 rules:
   - apiGroups:
     - '*'
@@ -21,9 +25,13 @@ rules:
 apiVersion: rbac.authorization.k8s.io/v1
 kind: ClusterRoleBinding
 metadata:
-  labels:
-    app: {{ .Chart.Name }}
   name: {{ .Chart.Name }}
+  labels:
+    app.kubernetes.io/part-of: {{ .Chart.Name }}
+    app.kubernetes.io/instance: {{ .Release.Name }}
+    app.kubernetes.io/version: {{ .Chart.AppVersion }}
+    app.kubernetes.io/managed-by: helm
+    helm.sh/chart: {{ .Chart.Name }}-{{ .Chart.Version | replace "+" "_" }}
 roleRef:
   apiGroup: rbac.authorization.k8s.io
   kind: ClusterRole

scripts/install/kuberntes/helm-chart/templates/configmap.yaml

@@ -1,9 +1,13 @@
 apiVersion: v1
 kind: ConfigMap
 metadata:
-  labels:
-    app: {{ .Chart.Name }}
   name: {{ .Chart.Name }}-kubeconfig
+  labels:
+    app.kubernetes.io/part-of: {{ .Chart.Name }}
+    app.kubernetes.io/instance: {{ .Release.Name }}
+    app.kubernetes.io/version: {{ .Chart.AppVersion }}
+    app.kubernetes.io/managed-by: helm
+    helm.sh/chart: {{ .Chart.Name }}-{{ .Chart.Version | replace "+" "_" }}
 data:
   config: |
 
@@ -12,10 +16,14 @@ data:
 apiVersion: v1
 kind: ConfigMap
 metadata:
-  labels:
-    app: {{ .Chart.Name }}
   name: {{ .Chart.Name }}-nginx
   namespace: {{ .Release.Namespace }}
+  labels:
+    app.kubernetes.io/part-of: {{ .Chart.Name }}
+    app.kubernetes.io/instance: {{ .Release.Name }}
+    app.kubernetes.io/version: {{ .Chart.AppVersion }}
+    app.kubernetes.io/managed-by: helm
+    helm.sh/chart: {{ .Chart.Name }}-{{ .Chart.Version | replace "+" "_" }}
 data:
   default.conf: |2-
     server {

scripts/install/kuberntes/helm-chart/templates/pvc-metrics-scraper.yaml

@@ -2,11 +2,14 @@
 kind: PersistentVolumeClaim
 apiVersion: v1
 metadata:
-  name: kore-board-metrics-scraper
-  labels:
-    app: {{ .Chart.Name }}
   name: {{ .Chart.Name }}
   namespace: {{ .Release.Namespace }}
+  labels:
+    app.kubernetes.io/part-of: {{ .Chart.Name }}
+    app.kubernetes.io/instance: {{ .Release.Name }}
+    app.kubernetes.io/version: {{ .Chart.AppVersion }}
+    app.kubernetes.io/managed-by: helm
+    helm.sh/chart: {{ .Chart.Name }}-{{ .Chart.Version | replace "+" "_" }}
 spec:
   accessModes:
     - {{ .Values.metricsScraper.persistence.accessMode | quote }}