120 lines
3.1 KiB
Markdown
120 lines
3.1 KiB
Markdown
# Typing Speed & RSI Awareness Game - Kubernetes & Netlify Deployment
|
|
|
|
This project showcases a web-based Typing Speed & RSI Awareness Game, deployed in two ways:
|
|
|
|
1. Locally on a Kubernetes cluster using best practices and persistent storage.
|
|
2. Published online using Netlify, making it accessible via a global CDN.
|
|
|
|
# Game Overview
|
|
|
|
The application is designed to:
|
|
|
|
1. Improve typing speed and accuracy.
|
|
2. Educate users on RSI (Repetitive Strain Injury) prevention.
|
|
3. Include real-time feedback and typing stats.
|
|
4. Encourage healthy typing habits with periodic stretch reminders.
|
|
|
|
Project Structure
|
|
|
|
File/Folder - Description
|
|
index.html, style.css, script.js - Frontend files for the typing game
|
|
Dockerfile - Builds an Nginx image to serve the game
|
|
prepare-app.sh - Prepares Docker image and volume for Kubernetes
|
|
start-app.sh - Deploys app using Kubernetes objects
|
|
stop-app.sh - Deletes all Kubernetes resources
|
|
namespace.yaml - Creates typing-game namespace
|
|
deployment.yaml - Deploys frontend with Nginx
|
|
service.yaml
|
|
pv-pvc.yaml - Persistent Volume and Claim configuration
|
|
statefulset.yaml
|
|
|
|
|
|
# Namespace
|
|
Created and referenced typing-game in all YAML files.
|
|
|
|
# Deployment
|
|
Used deployment.yaml for Nginx-based frontend.
|
|
|
|
# StatefulSet + Persistent Volume
|
|
statefulset.yaml logs data persistently via PVC.
|
|
|
|
# Service
|
|
Exposed frontend via NodePort (port 30007).
|
|
|
|
# Scripts
|
|
start-app.sh - to deploy, stop-app.sh to clean up.
|
|
|
|
prepare-app.sh - for Docker image and volume setup.
|
|
|
|
./stop-app.sh - Which will stop all Kubernetes resources associated with the app.
|
|
|
|
Dockerfile - Built custom image serving game with Nginx.
|
|
|
|
|
|
# How to Deploy on Kubernetes
|
|
|
|
Step 1: Prepare the Application (All the files and scripts)
|
|
|
|
Step 2: ./prepare-app.sh
|
|
|
|
|
|
Step 3: Deploy the App via - ./start-app.sh
|
|
|
|
Which Applies:
|
|
|
|
A)Namespace
|
|
B)Deployment
|
|
C)Service
|
|
D)StatefulSet
|
|
E)PersistentVolume and PVC
|
|
|
|
Step 4: Access the App (Locally)
|
|
|
|
Replace <your-ip> with the IP address of your Kubernetes node.
|
|
|
|
Step 5: Clean Up via - ./stop-app.sh
|
|
|
|
Which will stop all Kubernetes resources associated with the app.
|
|
|
|
# How to Deploy with Netlify (Online)
|
|
|
|
You also hosted the Typing Game on Netlify, a popular platform for deploying Games or websites on Public Cloud Environment
|
|
|
|
# Setup Steps (Completed)
|
|
|
|
1. Installed Netlify CLI using Homebrew:
|
|
2. brew install netlify-cli
|
|
3. Logged in and linked your project:
|
|
4. netlify login
|
|
5. netlify init # Or `netlify link` if project already exists
|
|
|
|
Your game is now live at:
|
|
|
|
https://typing-game-app.netlify.app
|
|
|
|
# Netlify Publish Directory
|
|
|
|
When prompted during deploy, you provided this directory:
|
|
|
|
/Users/puneetkhurana/Documents/zkt25/Examm
|
|
|
|
|
|
# CI-Like Workflow with CLI
|
|
|
|
To update your live website via CLI:
|
|
|
|
Make changes in your local Examm folder.
|
|
netlify deploy --prod
|
|
Changes will go live on the same URL.
|
|
|
|
This allows you to re-deploy instantly after edits without needing to use the Netlify UI.
|
|
|
|
# Summary
|
|
|
|
1. Typing Game promotes speed and RSI awareness.
|
|
|
|
2. Deployed on Kubernetes with storage and services.
|
|
|
|
3. Published live via Netlify using CLI.
|
|
|
|
4. Fully automated with scripts for ease of use and reusability. |