React Clock

.deployment

@@ -0,0 +1,2 @@
+[config]
+SCM_DO_BUILD_DURING_DEPLOYMENT=true

Dockerfile

@@ -0,0 +1,19 @@
+FROM node:12
+
+# Create app directory
+WORKDIR /usr/src/app
+
+# Install app dependencies
+# A wildcard is used to ensure both package.json AND package-lock.json are copied
+# where available (npm@5+)
+COPY package*.json ./
+
+RUN npm install
+# If you are building your code for production
+# RUN npm install --only=production
+
+# Bundle app source
+COPY . .
+
+EXPOSE 8080
+CMD [ "npm", "start" ]

README.md

@@ -1,5 +1,31 @@
 # React Clock
 
+This is a fork of this clock app that includes deployments for Azure Kubernetes Service and Docker.
+
+
+### App Service Deployment Method:
+
+In Azure cloud shell:
+
+```
+git clone https://github.com/jaydestro/react-clock-basic.git
+
+az group create  --name $NAME --location eastus
+
+az network vnet create --name $nameVNET --resource-group $NAME  --subnet-name default
+
+az acr create --resource-group $NAME--name $NAMEacr --sku Basic --admin-enabled true
+
+az acr build  --registry $NAMEacr --image react-clock-basic:v1 .
+```
+
+Go to portal in Azure, create a new app service, select your resource group, pick linux, pick docker container, create a new service plan, select dev/test - click Docker
+
+Drop down source, select Azure Container Registry.  Click the registry you created above then select the image name and version.
+
+Click Review and create.  
+
+
 A basic clock that displays the current date and time
 
 Go **[here](http://react-clock-basic.drminnaar.me/)** for live demo.
@@ -83,7 +109,7 @@ These instructions will get you a copy of the project up and running on your loc
 
 The following software is required to be installed on your system:
 
-* Node 8.x
+* Node 12.x
 * Npm 3.x
 
 Type the following commands in the terminal to verify your node and npm versions
@@ -190,4 +216,4 @@ I use [SemVer](http://semver.org/) for versioning. For the versions available, s
 [react-movie-cards]: https://github.com/drminnaar/react-movie-cards
 [react-calculator-standard]: https://github.com/drminnaar/react-calculator-standard
 [react-bitcoin-monitor]: https://github.com/drminnaar/react-bitcoin-monitor
-[react-weather-standard]: https://github.com/drminnaar/react-weather-standard
+[react-weather-standard]: https://github.com/drminnaar/react-weather-standard

azure-pipelines.yml

@@ -0,0 +1,24 @@
+# Node.js with React
+# Build a Node.js project that uses React.
+# Add steps that analyze code, save build artifacts, deploy, and more:
+# https://docs.microsoft.com/azure/devops/pipelines/languages/javascript
+
+trigger:
+- master
+
+pool:
+  vmImage: 'ubuntu-latest'
+
+steps:
+
+
+- task: AzureVmssDeployment@0
+  inputs:
+    azureSubscription: 'ca-jagord-demo-test(f9b5da45-54cc-42d3-a58b-87adf6ad27ad)'
+    action: 'Update image'
+    vmssName: 'vmclock'
+    vmssOsType: 'Linux'
+    imageUrl: '/subscriptions/f9b5da45-54cc-42d3-a58b-87adf6ad27ad/resourceGroups/vmclock/providers/Microsoft.Compute/images/vmclockimg'
+    customScriptsDirectory: '/root'
+    customScript: 'bash install.sh'
+    customScriptsStorageAccount: 'vmdeployclock'

k8s/acr.sh

@@ -0,0 +1,15 @@
+#!/bin/bash
+
+AKS_RESOURCE_GROUP=
+AKS_CLUSTER_NAME=
+ACR_RESOURCE_GROUP=
+ACR_NAME=
+
+# Get the id of the service principal configured for AKS
+CLIENT_ID=$(az aks show --resource-group $AKS_RESOURCE_GROUP --name $AKS_CLUSTER_NAME --query "servicePrincipalProfile.clientId" --output tsv)
+
+# Get the ACR registry resource id
+ACR_ID=$(az acr show --name $ACR_NAME --resource-group $ACR_RESOURCE_GROUP --query "id" --output tsv)
+
+# Create role assignment
+az role assignment create --assignee $CLIENT_ID --role acrpull --scope $ACR_ID

k8s/deployment.yaml

@@ -0,0 +1,33 @@
+apiVersion: apps/v1
+kind: Deployment
+metadata:
+  name: react-clock-basic
+spec:
+  selector:
+      matchLabels:
+        app: react-clock-basic
+  replicas: 3
+  template:
+      metadata:
+        labels:
+            app: react-clock-basic
+      spec:
+        containers:
+        - name: react-clock-basic
+          image: <>.azurecr.io/react-clock-basic:v1
+          imagePullPolicy: Always
+          readinessProbe:
+            httpGet:
+              port: 8080
+              path: /
+          livenessProbe:
+            httpGet:
+              port: 8080
+              path: /
+          resources:
+            requests:
+              memory: "128Mi"
+              cpu: "100m"
+            limits:
+              memory: "256Mi"
+              cpu: "500m"

k8s/loadbalancer.yaml

@@ -0,0 +1,13 @@
+apiVersion: v1
+kind: Service
+metadata:
+  name: react-clock-basic-loadbalancer
+spec:
+  type: LoadBalancer
+  selector:
+    app: react-clock-basic
+  ports:
+  - protocol: TCP
+    port: 80
+    targetPort: 8080
+

k8s/touch.txt

@@ -0,0 +1 @@
+test

manifests/deployment-1.yml

@@ -0,0 +1,16 @@
+apiVersion : apps/v1beta1
+kind: Deployment
+metadata:
+  name: "jayaks2-c927"
+spec:
+  replicas: 2
+  template:
+    metadata:
+      labels:
+        app: "jayaks2-c927"
+    spec:
+      containers:
+        - name: "jayaks2-c927"
+          image: "jayacr002.azurecr.io/jayaks2"
+          ports:
+          - containerPort: 8080

manifests/deployment-2.yml

@@ -0,0 +1,19 @@
+apiVersion : apps/v1
+kind: Deployment
+metadata:
+  name: "jayaksdemo-4ca2"
+spec:
+  replicas: 2
+  selector:
+    matchLabels:
+      app: "jayaksdemo-4ca2"
+  template:
+    metadata:
+      labels:
+        app: "jayaksdemo-4ca2"
+    spec:
+      containers:
+        - name: "jayaksdemo-4ca2"
+          image: "jayacrdemo.azurecr.io/jayaksdemo"
+          ports:
+          - containerPort: 8080

manifests/deployment.yml

@@ -0,0 +1,33 @@
+apiVersion: apps/v1
+kind: Deployment
+metadata:
+  name: jayaks2
+spec:
+  selector:
+      matchLabels:
+        app: jayacr002
+  replicas: 3
+  template:
+      metadata:
+        labels:
+            app: jayaks2
+      spec:
+        containers:
+        - name: jayacr002
+          image: "jayacr002.azurecr.io/jayaks2:v1"
+          imagePullPolicy: Always
+          readinessProbe:
+            httpGet:
+              port: 8080
+              path: /
+          livenessProbe:
+            httpGet:
+              port: 8080
+              path: /
+          resources:
+            requests:
+              memory: "128Mi"
+              cpu: "100m"
+            limits:
+              memory: "256Mi"
+              cpu: "500m"

manifests/ingress-1.yml

@@ -0,0 +1,17 @@
+apiVersion: extensions/v1beta1
+kind: Ingress
+metadata:
+    name: "jayaks2-c927"
+    labels:
+        app: "jayaks2-c927"
+    annotations:
+        kubernetes.io/ingress.class: addon-http-application-routing
+spec:
+    rules:
+        - host: jayaks210cf-jayaks2-c927.86b44fad5c574b39b67a.eastus.aksapp.io
+          http:
+            paths:
+            - path: /
+              backend:
+                serviceName: "jayaks2-c927"
+                servicePort: 8080

manifests/ingress-2.yml

@@ -0,0 +1,17 @@
+apiVersion: extensions/v1beta1
+kind: Ingress
+metadata:
+    name: "jayaksdemo-4ca2"
+    labels:
+        app: "jayaksdemo-4ca2"
+    annotations:
+        kubernetes.io/ingress.class: addon-http-application-routing
+spec:
+    rules:
+        - host: jayaksdemo9cfa-jayaksdemo-4ca2.7566743ebff34eb6b579.eastus.aksapp.io
+          http:
+            paths:
+            - path: /
+              backend:
+                serviceName: "jayaksdemo-4ca2"
+                servicePort: 8080

manifests/ingress.yml

@@ -0,0 +1,17 @@
+apiVersion: extensions/v1beta1
+kind: Ingress
+metadata:
+    name: "clockaks01"
+    labels:
+        app: "clockaks01"
+    annotations:
+        kubernetes.io/ingress.class: addon-http-application-routing
+spec:
+    rules:
+        - host: clockaks01d3f1-clockaks01.b9c65ff5ed3a47ef88be.eastus.aksapp.io
+          http:
+            paths:
+            - path: /
+              backend:
+                serviceName: "clockaks01"
+                servicePort: 8080

manifests/service-1.yml

@@ -0,0 +1,15 @@
+apiVersion: v1
+kind: Service
+metadata:
+    name: "jayaks2-c927"
+    labels:
+        app: "jayaks2-c927"
+spec:
+    type: ClusterIP
+    ports:
+    - port: 8080
+      targetPort: 8080
+      protocol: TCP
+      name: http
+    selector:
+        app: "jayaks2-c927"

manifests/service-2.yml

@@ -0,0 +1,15 @@
+apiVersion: v1
+kind: Service
+metadata:
+    name: "jayaksdemo-4ca2"
+    labels:
+        app: "jayaksdemo-4ca2"
+spec:
+    type: ClusterIP
+    ports:
+    - port: 8080
+      targetPort: 8080
+      protocol: TCP
+      name: http
+    selector:
+        app: "jayaksdemo-4ca2"

manifests/service.yml

@@ -0,0 +1,12 @@
+apiVersion: v1
+kind: Service
+metadata:
+  name: clockaks01
+spec:
+  type: LoadBalancer
+  selector:
+    app: clockaks01
+  ports:
+  - protocol: TCP
+    port: 80
+    targetPort: 8080

other/default

@@ -0,0 +1,10 @@
+server {
+    listen 80;
+    server_name example.com;
+
+    location / {
+        proxy_set_header   X-Forwarded-For $remote_addr;
+        proxy_set_header   Host $http_host;
+        proxy_pass         "http://127.0.0.1:1337";
+    }
+}