You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
This directory contains all GitHub Actions workflow files for automated continuous integration, deployment, and quality assurance of the project.
4
+
5
+
## Directory Structure
6
+
7
+
```
8
+
.github/workflows
9
+
├── README.md # This documentation file
10
+
├── client-linters.yml # Linting and formatting checks for client code (JavaScript/TypeScript)
11
+
├── deploy-to-ec2.yml # Deploys the application stack to an AWS EC2 VM using Docker Compose
12
+
├── deploy-to-k8s.yml # Full Kubernetes deployment workflow with automatic Docker build & push
13
+
├── genai-linters.yml # Linting & formatting for the GenAI Python service
14
+
├── genai-tests.yml # Runs unit and integration tests for the GenAI service
15
+
├── realtime-tests.yml # Runs Go tests for the Realtime service
16
+
├── server-linters.yml # Linting and formatting for the backend server (Java/Spring)
17
+
└── server-tests.yml # Runs tests for the backend server
18
+
```
19
+
20
+
## Workflow Files Description
21
+
22
+
-**client-linters.yml**
23
+
Runs various linting, formatting, and type-checking tools (`ESLint`, `Prettier`, and `TypeScript`) for the `client/` (frontend) codebase on relevant pull requests and workflow_dispatch.
24
+
25
+
-**deploy-to-ec2.yml**
26
+
Manually triggered action that deploys the application to an AWS EC2 virtual machine. Uses SCP and SSH actions to upload Docker Compose files and execute deployment on the VM.
27
+
28
+
-**deploy-to-k8s.yml**
29
+
Complete pipeline for CI and automated deployment on Kubernetes.
30
+
-**Triggers:** Push to `main`/`develop`, or pull request to `develop`
31
+
-**Actions:**
32
+
- Checks out code
33
+
- Builds and pushes Docker images (client, server, genai, realtime) to GitHub Container Registry
34
+
- Deploys the new images using Helm with environment-specific values
35
+
- Outputs deployment URLs and posts them as PR comments.
36
+
37
+
-**genai-linters.yml**
38
+
Python-specific code linting and formatting for the `genai/` service using `ruff` (with both check and auto-fix capabilities).
39
+
40
+
-**genai-tests.yml**
41
+
Runs automated tests for the `genai/` (Python) service on PRs and manual triggers, using `pytest`.
42
+
43
+
-**realtime-tests.yml**
44
+
Executes Go tests for the `realtime/` go service when changes are made or when manually triggered.
45
+
46
+
-**server-linters.yml**
47
+
Linting and formatting checks for the backend server using `gradle spotlessCheck`, ensuring code quality before merging.
48
+
49
+
-**server-tests.yml**
50
+
Runs backend (Java/Spring Boot) tests automatically for all changes to the `server/` codebase.
This workflow handles **automated CI/CD deployment** to Kubernetes for every push to `main`, `develop`, and for PRs to `develop`. It is the main workflow ensuring that all core services are always built, published, and deployed in a uniform, automated way.
56
+
57
+
#### Workflow Steps Overview
58
+
59
+
The pipeline consists of the following core stages:
60
+
61
+
1.**Setup**
62
+
Determines the branch and deployment environment, sets up variables (e.g., image tags, URLs), and, for PRs, ensures the PR branch is up-to-date with the base branch.
63
+
64
+
2.**Parallel Build Jobs**
65
+
-**build-client:** Build and push the client (frontend) Docker image.
66
+
-**build-server:** Build and push the backend server Docker image.
67
+
-**build-genai:** Build and push the GenAI (Python) Docker image.
68
+
-**build-realtime:** Build and push the Realtime (Go) Docker image.
69
+
70
+
71
+
These four jobs run **in parallel** for maximum speed, as visualized below:
72
+
73
+

74
+

75
+
76
+
*(These screenshots are from one of our PRs)*
77
+
78
+
3.**Deploy**
79
+
Once all build jobs succeed, the deployment job takes over. It:
80
+
- Determines the appropriate Kubernetes namespace, release name, and Helm values file (production, staging, or PR-specific).
81
+
- Authenticates using secrets.
82
+
- Runs a Helm upgrade/install so that the newly built images are rolled out to the right environment cluster using K8s best practices.
83
+
84
+
4.**Comment PR**
85
+
For PRs, the workflow posts a comment on the pull request with all relevant deployment URLs (client, server swagger, real-time swagger, GenAI docs, Auth/Keycloak), making it easy for reviewers to access and verify deployments directly.
86
+
87
+
#### Key Features
88
+
89
+
-**Multi-service:** Handles building and pushing all main services in parallel (client, server, genai, realtime).
90
+
-**Dynamic Environments:** Deploys to `production`, `staging`, or per-PR namespaces based on branch.
91
+
-**Branch Safety:** PRs get their own unique namespace and resource set, keeping environments isolated.
92
+
-**Secrets Handling:** Leverages GitHub Secrets for Kubernetes credentials, API keys, and sensitive data.
93
+
-**Automated PR Feedback:** Deploys post directly to the PR for instant reviewer access to live endpoints.
94
+
95
+
96
+
97
+
## Additional Information
98
+
99
+
- Use `workflow_dispatch` to manually trigger deployments when needed.
100
+
- Deployment URLs are posted automatically on PRs for fast access and testing.
101
+
- Sensitive information is managed securely through [GitHub Actions Secrets](https://docs.github.com/en/actions/security-guides/encrypted-secrets).
102
+
103
+
104
+
---
105
+
106
+
**For more information or customizations, please refer to the individual `.yml` files in this folder.**
An AI enhanced digital whiteboard web-application that helps users visualize, organize, and share their ideas.
@@ -10,12 +10,12 @@ It addresses the need for a flexible, collaborative space where users can visual
10
10
11
11
## 🚀 Main Features
12
12
13
-
-**Visual Whiteboard**: Add and arrange text, shapes, and colors to visualise ideas.
14
-
-**Real-Time Collaboration**: Share boards with others and edit together in real-time.
13
+
-**Visual Whiteboard**: Add and arrange text, shapes, and colors to visualise ideas.
14
+
-**Real-Time Collaboration**: Share boards with others in realtime.
15
15
-**Generative AI Integration**:
16
16
-**Text Autocompletion**: AI text-autocompletion.
17
-
-**Text-to-Image Generation**: Select text and generate relevant images.
18
-
-**Text Enhancement**: Summarize and rewrite paragraphs with the help of AI.
17
+
-**Text Summarization**: Summarize the text of the User.
18
+
-**Text Enhancement**: Rewrite paragraphs with the help of AI.
19
19
---
20
20
21
21
## 👥 Intended Users
@@ -31,25 +31,167 @@ It addresses the need for a flexible, collaborative space where users can visual
31
31
- A student builds a study guide with concept branches and uses AI to autocomplete summaries or visualize key ideas.
32
32
- A product team drafts a user flow, enhanced with images generated from task descriptions.
33
33
- An educator prepares a digital lesson board with the help of AI-generated visuals.
34
+
- An educator can collaborate with students, allowing them to view the whiteboard in real time while the educator shares it.
34
35
35
36
---
36
37
37
38
## Initial Product Backlog Item
38
39
39
40
1. As a user, I want to sketch my ideas on the whiteboard, so that I can quickly capture and explore concepts visually.
40
41
2. As a user, I want to add shapes and apply colors, so that I can organize information visually and enhance clarity.
41
-
3. As a user, I want to collaborate with others in real time, so that we can brainstorm and edit ideas together efficiently.
42
+
3. As a user, I want to collaborate with others in real time, so that we can brainstorm ideas together efficiently.
42
43
4. As a user, I want to add and edit text on the whiteboard, so that I can capture thoughts and annotations clearly.
43
44
5. As a user, I want the app to autocomplete my text as I type, so that I can write faster and stay focused on my ideas.
44
-
6. As a user, I want to select a piece of text and generate a relevant image, so that I can visually enhance my whiteboard content.
45
-
7. As a user, I want to summarize long paragraphs using AI, so that I can condense information and understand key points quickly.
46
-
8. As a user, I want to rewrite selected text with AI assistance, so that I can improve clarity, tone, or grammar effortlessly.
45
+
6. As a user, I want to summarize long paragraphs using AI, so that I can condense information and understand key points quickly.
46
+
7. As a user, I want to rewrite selected text with AI assistance, so that I can improve clarity, tone, or grammar effortlessly.
47
47
48
48
---
49
-
## UML Models
49
+
## Architecture and Modelling
50
+
51
+
### Subsystem Decomposition Diagram
52
+

53
+
50
54
### UML Use Case Diagram
51
55
52
56

53
57
54
58
### Analysis Object Model
55
59

60
+
61
+
---
62
+
63
+
## Team Members & Responsibilities
64
+
65
+
## 👥 Team Contributions
66
+
67
+
68
+
**Armanpreet Ghotra**
69
+
Arman took the lead on creating and integrating the GenAI service, making sure all AI-powered features worked smoothly within our application. She was also responsible for setting up observability tooling to ensure our services were monitorable and reliable. In addition, she was hands-on with EC2 deployment. Additionally, she played an important role on the client side by implementing UI features and more. She also contributed to our documentation and system modeling.
70
+
71
+
**Leon Liang**
72
+
Leon focused primarily on building the end-to-end real-time collaboration features using Go, Redis PubSub and WebSockets. Het was responsible for setting up authentication for our platform, using Keycloak. He made sure real-time interactions in the app were robust and smooth. Leon also took ownership of deploying observability tools and was instrumental in setting up our deployment processes, especially for managing PR environments on Kubernetes and EC2.
73
+
74
+
**Xhulia Jasimi**
75
+
Xhulia was the main force behind our Spring Boot server—developing most of the backend logic, endpoints, and database integrations. She contributed on the client side, implementing UI features and bridging the client and spring boot server. Additionally, she was involved in creating Grafana dashboard for Observability. Xhulia contributed on Kubernetes deployments, documentation, and system modelling diagrams.
76
+
77
+
78
+
---
79
+
Throughout the project, all team members collaborated closely—setting up the initial project structure, designing the CI/CD pipeline, performing code reviews, and helping each other across different parts of the stack. Everyone jumped in where needed, ensuring a smooth and successful delivery.
80
+
81
+
82
+
# Running the Application
83
+
84
+
Each service includes its own `Dockerfile` in the respective folder. The entire stack is orchestrated via `compose.yml`, which also configures and fetches required external services. You are welcome to explore these files to better understand the system architecture.
85
+
86
+
## Prerequisites
87
+
88
+
- Docker Desktop installed locally with permission to run scripts
89
+
- Stable internet connection
90
+
91
+
## Setup
92
+
93
+
1.**Create Environment File**
94
+
Before running the application, create a `.env` file in the root directory using `.env.example` as a reference.
95
+
Make sure to add your API key for OpenWeb UI.
96
+
97
+
2.**Navigate to Project Root**
98
+
In your terminal, go to the root directory of the project (where this README is located).
99
+
100
+
3.**Build and Start the Containers**
101
+
```bash
102
+
docker compose build
103
+
docker compose up
104
+
```
105
+
_Note: Spring Boot may take some time to start up._
106
+
107
+
## Troubleshooting: PostgreSQL Database Not Created
108
+
109
+
If the PostgreSQL database is not created, it may be due to Docker lacking permission to execute `.sh` files. To fix this:
110
+
111
+
1. Enter the Exec shell of the running `db` container on Docker Desktop:
112
+
2. Navigate to the init script directory:
113
+
```bash
114
+
cd docker-entrypoint-initdb.d
115
+
```
116
+
3. Ensure the script is executable and run it:
117
+
```bash
118
+
chmod +x db_init.sh
119
+
./db_init.sh
120
+
```
121
+
122
+
## Additional Information
123
+
124
+
Enjoy our application! Every service has its own README file which you can read for further information on how to run tests and other commands.
0 commit comments