Intro to Kubernetes Through React, SVG, and the OpenShift API Jan Kleinert jan.kleinert@redhat.com February 22, 2019

@jankleinert 2 Jan Kleinert Developer Advocate, Red Hat twitter/github: @jankleinert Hello!

@jankleinert 3 What is Kubernetes? 4 basic primitives How the visualization works Additional OpenShift concepts What We’ll Cover

@jankleinert 4 What is Kubernetes?

@jankleinert 5 Kubernetes is... An open source platform for running container-based workloads and managing them at scale

@jankleinert 6 Kubernetes provides... An API kind apiVersion metadata spec status API object primitives include these attributes:

@jankleinert 7 Basic K8s Terminology 1. node 2. pod 3. service 4. deployment

@jankleinert 8 Node ● Node: a host machine where containerized processes run ● Node activity is managed via one or more Master instances

@jankleinert 9 Pod ● A group of one or more co-located containers ● Minimum unit of scale kind: Pod apiVersion: v1 metadata: creationTimestamp: name: hello-k8s labels: run: hello-k8s spec: containers: - name: hello-k8s image: jkleinert/nodejsint-workshop ports: - containerPort: 8080 resources: {}

@jankleinert 10 https://youtu.be/E7KWcvuFVns

@jankleinert 11 Service ● Acts as a single endpoint for a collection of replicated pods ● Like a load balancer kind: Service apiVersion: v1 metadata: name: hello-k8s creationTimestamp: labels: run: hello-k8s spec: ports: - protocol: TCP port: 8080 targetPort: 8080 selector: run: hello-k8s type: NodePort status: loadBalancer: {}

@jankleinert 12 https://youtu.be/mkLNa_5w_58

@jankleinert 13 Deployment ● Helps you specify container runtime requirements (in terms of pods) kind: Deployment
 apiVersion: apps/v1beta1
 metadata:
 name: hello-k8s
 creationTimestamp: 
 labels:
 run: hello-k8s
 spec:
 replicas: 1
 selector:
 matchLabels:
 run: hello-k8s
 template:
 metadata:
 creationTimestamp: 
 labels:
 run: hello-k8s
 spec:
 containers:
 - name: hello-k8s
 image: jkleinert/nodejsint-workshop
 resources: {}
 strategy: {}
 status: {}

@jankleinert 14 https://youtu.be/1gjTeR4tsj0

@jankleinert 15 https://youtu.be/V8BOQhmC30w

@jankleinert 16 https://youtu.be/C8xAqfFaSLI

@jankleinert 17 https://youtu.be/YEkIAWFc9WE

@jankleinert 18 How does the visualization work? 1. Java backend
 https://github.com/jankleinert/k8s-visualization-backend 2. Node.js server 3. React frontend
 https://github.com/jankleinert/k8s-visualization-frontend

@jankleinert 19

@jankleinert 20 server.js client.on('subscribeToPods', (interval) => { setInterval(() => { var req = http.request(podOptions, function (res) { var responseString = ""; res.on("data", function (data) { responseString += data; }); res.on("end", function () { pods = JSON.parse(responseString); }); }); req.end(); client.emit('pods', pods); }, interval); });

@jankleinert 21 App.js class App extends Component { render() { const podGroup = Object.keys(this.state.pods).map(key => <> {this.state.pods[key].objectType} {this.state.pods[key].objectName} > )

@jankleinert 22 Kubernetes By Example: http://kubernetesbyexample.com Interactive Learning Portal: https://learn.openshift.com Backend repo:
 https://github.com/jankleinert/k8s-visualizer-backend Frontend repo: https://github.com/jankleinert/k8s-visualizer-frontend Resources

THANK YOU plus.google.com/+RedHat linkedin.com/company/red-hat youtube.com/user/RedHatVideos facebook.com/redhatinc twitter.com/RedHat