Create Custom Templates in Monokle🚀
Tags: devops, monokle, beginners, kubernetes
Published: 2022-02-20 06:05:52

## What is Kubernetes?🎡
⚡ Kubernetes (sometimes shortened to K8s with the 8 standing for the number of letters between the "K" and the "s") is an open-source system to deploy, scale, and manage containerized applications anywhere.

## What are Kubernetes Resources? 🚀 
⚡ A resource is an endpoint in the Kubernetes API that stores a collection of API objects of a certain kind; for example, the built-in pods resource contains a collection of Pod objects.

More information can be found here : https://kubernetes.io/docs/concepts/extend-kubernetes/api-extension/custom-resources/

## What is Monokle? 🔰

⚡ Monokle helps you to:

1. Quickly get a high-level view of your manifests, their contained resources and relationships.
2. Easily edit resources without having to learn or look up yaml syntax.
3.Refactor resources with maintained integrity of names and references.
4. Preview and debug resources generated with Kustomize or Helm.
5. Diff resources against your cluster and apply changes immediately.
6. Visualize and navigate resources in your clusters.
7. And much more!

⚡ More information can be found here : https://kubeshop.github.io/monokle/

❄ **Today's blog is about How can we create our custom Monokle Template!!**

## What are Monokle Templates? 🔰
A Monokle Template is a mechanism for creating visual forms and interpolating the data from those forms into one or multiple manifests.

⚡ More information can be found here : https://kubeshop.github.io/monokle/templates/

❄ **I have created a custom template for Kubernetes Service**

## What is a Kubernetes Service?
An abstract way to expose an application running on a set of Pods as a network service.
With Kubernetes you don't need to modify your application to use an unfamiliar service discovery mechanism. Kubernetes gives Pods their own IP addresses and a single DNS name for a set of Pods, and can load-balance across them.

⚡ More information can be found here : https://kubernetes.io/docs/concepts/services-networking/service/

❄ **Let's start**

👉🏻 **Step-1:** Create a _`package.json`_ file

```
{
    "name": "Monokle Custom Templates Plugin",
    "author": "Vrukshali Torawane",
    "version": "1.0.0",
    "description": "This plugin provides the custom resource templates for Monokle",
    "repository": "https://github.com/Vrukshali-26/monokle-templates-plugins",
    "monoklePlugin": {
      "id": "com.github.Vrukshali-26.plugin.templates",
      "helpUrl": "https://github.com/Vrukshali-26/monokle-templates-plugins",
      "modules": [
        {
          "type": "template",
          "path": "service-template" 
        }
      ]
    }
}
```
❄ In this `name`, `author`, `version`, `description`, `monoklePlugin`, `helpUrl` and `modules` are required to specify, also we are specifying where we have the template plugin folder _e.g., in my case, `service-template`_

👉🏻 **Step-2:** Create a folder named **`service-template`** and add the following content:

**1. In `monokle-template.json` file:**

```
{
    "name": "Basic Kubernetes Service",
    "id": "com.github.Vrukshali-26.plugin.templates.basic-service-template",
    "author": "Vrukshali-26",
    "version": "1.0.0",
    "description": "Creates a Kubernetes Service",
    "repository": "",
    "type": "vanilla",
    "forms": [
      {
        "name": "Service Settings",
        "description": "Specify the settings for your Service",
        "schema": "form-schema.json",
        "uiSchema": "form-ui-schema.json"
      }
    ],
    "manifests": [
      {
        "filePath": "template.yaml"
      }
    ],
    "resultMessage": "Service resource created successfully!",
    "helpUrl": "https://github.com/Vrukshali-26/monokle-templates-plugins"
  }
```

**2. In `form-schema.json` file:**

```
{
    "type": "object",
    "required": [
      "name",
      "podSelector",
      "targetPort"
    ],
    "properties": {

      "name": {
        "type": "string",
        "default": "my-custom-service"
      },

      "namespace": {
        "type": "string"
      },

      "podSelector": {
        "type": "string",
        "default": "app: my-app"
      },

      "servicePort": {
        "type": "number",
        "default": 80
      },

      "targetPort": {
        "type": "number"
      },

      "serviceType": {
        "type": "string",
        "default": "LoadBalancer",
        "enum": [
          "LoadBalancer",
          "NodePort",
          "ClusterIP"
        ]
      }

    }
  }
```

**3. In `form-ui-schema.json` file:**

```
{
    "name": {
      "ui:title": "Name",
      "ui:help": "The name of Service"
    },

    "namespace": {
      "ui:title": "Namespace",
      "ui:help": "The target namespace for the created Service",
      "ui:widget": "namespaceSelection"
    },

    "podSelector": {
      "ui:title": "Pod Selector",
      "ui:help": "The label name-value pair to use for selecting target Pod(s) for this Service",
      "ui:widget": "podSelectorSelection"
    },

    "targetPort": {
      "ui:title": "Target Port",
      "ui:help": "The port exposed by the target Pod"
    },

    "servicePort": {
      "ui:title": "Service Port",
      "ui:help": "The port to expose the Service on"
    },
    
    "serviceType": {
      "ui:title": "Service Type",
      "ui:help": "The type of Service to create"
    }
  }
```

**4. In `template.yaml` file:**

```
apiVersion: v1
kind: Service
metadata:
  name: [[forms[0].name]]
[[ forms[0].namespace ? "  namespace: " + forms[0].namespace + "\n" : ""]]
spec:
  ports:
    - port: [[forms[0].servicePort]]
      protocol: TCP
      targetPort: [[forms[0].targetPort]]
  selector:
    [[forms[0].podSelector]]
  type: [[forms[0].serviceType]]
```
👉🏻 **Push this code to GitHub** : https://github.com/Vrukshali-26/monokle-templates-plugins

❄ **Download Monokle** : https://monokle.kubeshop.io/

Now after installation, we will use our custom template-plugin:

👉🏻 **Step-1:** Welcome to Monokle!!

![Image1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/aei8u9ovxyb5j81zmhvy.png)

👉🏻 **Step-2:** Install Plugin
_you can see a plugin button at top right corner_

![Image2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eit4rdbz9wootf6seygt.png)

![Image3](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/19iozbzmcd71ffcw2ztm.png)

❄ **Click on Install and enter the github URL!!**

![Image4](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/py8789rnd4ngllvvuldl.png)

❄ _You can see the plugin is installed_

![Image5](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/veqsjj5alqqa8y9mubyy.png)

👉🏻 **Step-3:** Now on Dashboard click _Start from a Template_:

![Image6](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nj1rv4nyq8py1w0lsl9q.png)

👉🏻 **Step-4:** Enter Project Name:

![Image7](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xbsazoovtt9olkzm21t6.png)

❄ _Click Next Select a Template_

![Image8](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lhront3qd4bkyzpwlv1g.png)

❄ _Now Click Create Project_

![Image9](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mjxhkt3plvakjqngh6en.png)

![Image10](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/i3a5cc2ol4extdlugo0b.png)

![Image11](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/39puilc8jbrgthoje1uy.png)

❄ _Click Submit and Resource is Created Successfully!!!!!_

![Image12](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y6901p1d8ffgv86f40ma.png)

![Image13](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0573h1ws0rtjqw0be3gb.png)

**We have created our custom Template successfully!!!!** 
Thanks for Reading !! 🙌🏻😁📃

🔰 Keep Learning !! Keep Sharing !!

🚀 Feel free to connect with me :
LinkedIn : https://www.linkedin.com/in/vrukshali-torawane/
GitHub : https://github.com/Vrukshali-26
Twitter : https://twitter.com/vrukshali26