London | 26-SDC-July | Raihan Sharif | Sprint 2 | Chat-app by RaihanSharif · Pull Request #124 · CodeYourFuture/Module-Decomposition

RaihanSharif · 2026-09-22T18:30:29Z

Learners, PR Template

Self checklist

I have titled my PR with Region | Cohort | FirstName LastName | Sprint | Assignment Title
My changes meet the requirements of the task
I have tested my changes
My changes follow the style guide

Task code

CYF-1162

Changelist

Created a live updating chat app that allows client to use either long polling or short polling.

Users can add new message
User is notified whenever a new message is created by another user
User can like or dislike a message
User is notified when a message is liked/disliked

backend: https://z4k2yzxetkpevkwf6zy9ea37.trainees.hosting.cyf.academy/messages
frontend: https://qhdyqohwxffxraktvwh1e0ys.trainees.hosting.cyf.academy/

Can post message, with validation. Can get all messages.

Only return list of messages, or a single message. Clean up js doc

Messages can now be fetched or created using REST API. Client can then fetch subsequent messages using event streaming.

create new message handling function.

Websocket version only has websocket code, everything else is in a separate file that can be reused by polling version.

Extract common code for the web socket and polling versions.

RaihanSharif · 2026-10-05T15:31:42Z

Update: I have now created the two separate apps, one polling and one Websocket. Both try to reuse as much code as possible, both in the frontend and backend.

Backend:

pollingApp.js
websocketApp.js
All other files are common between the two, such as the model, helper functions etc.

Frontend:

pollingScript.js
websocketScript.js
common.js -- contains the common files between the two.

Application uses HTTP post to create new messages and reactions and event streaming through either long polling or websocket to read new events.

Has some functionality to avoid race conditions by using even cursor per client.

github-actions · 2026-10-07T15:31:31Z

The files changed in this PR don't match what is expected for this task.

Please check that you committed the right files for the task, and that there are no accidentally committed files from other sprints.

Please review the 'files changed' tab at the top of the page.

Here is an example of a file that has been changed on this branch but shouldn't be: .vscode/settings.json

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

LonMcGregor

Good work building this app, you've organised the files neatly and used classes where appropriate. I can also see places where you've given consideration to how you could extend with new functionality later.

I have spotted a few areas where you could improve, or where you could answer my questions to check your understanding of the code.

LonMcGregor · 2026-10-07T15:39:00Z

+    const msg_body = document.getElementById("message-input").value;
+
+    try {
+        await chatRequest(`${BACKEND_URL}/messages`, {


If you are using the socket based app, does sendMessage have any way of using the socket, or does it end up making extra requests?

In my current implementation the sendMessage function just uses HTTP. This was a conscious decision to keep thing simpler. Following my previous Event Driven Architecture, in which POST requests only create/update resources, and send a confirmation, but the actual fetching of new events is done through a separate event broadcasting either through polling or WebSocket.

I could implement a version which uses WebSocket, and add the necessary protocol/schema to indicate new message send and acknowledgement.

LonMcGregor · 2026-10-07T15:39:58Z

@@ -0,0 +1,17 @@
+export class Message {
+    static #nextId = 0;


Can you explain what the static keyword here means?

This is a class field, not an instance field. It belongs to the class itself rather than any one individual instance of the message class.

LonMcGregor · 2026-10-07T15:47:02Z

+    /**
+     * Sends new events for each waiting request, if there are any events to send.
+     */
+    notifyWaiters() {


What is the difference between a "waiter" and a "subscriber"?

In this code waiters are the polling requests, and subscribers are WebSocket connections.

I was going to create a more general "subscriber" interface so that both WebSocket and HTTP, but I didn't have the time to get it done.

I've added some comments to make this clearer.

github-actions · 2026-10-07T15:48:50Z

The files changed in this PR don't match what is expected for this task.

Please check that you committed the right files for the task, and that there are no accidentally committed files from other sprints.

Please review the 'files changed' tab at the top of the page.

Here is an example of a file that has been changed on this branch but shouldn't be: .vscode/settings.json

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

github-actions · 2026-10-07T15:48:52Z

The files changed in this PR don't match what is expected for this task.

Please check that you committed the right files for the task, and that there are no accidentally committed files from other sprints.

Please review the 'files changed' tab at the top of the page.

Here is an example of a file that has been changed on this branch but shouldn't be: .vscode/settings.json

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

github-actions · 2026-10-09T13:36:04Z

The files changed in this PR don't match what is expected for this task.

Please check that you committed the right files for the task, and that there are no accidentally committed files from other sprints.

Please review the 'files changed' tab at the top of the page.

Here is an example of a file that has been changed on this branch but shouldn't be: package-lock.json

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

github-actions · 2026-10-09T13:36:04Z

The files changed in this PR don't match what is expected for this task.

Please check that you committed the right files for the task, and that there are no accidentally committed files from other sprints.

Please review the 'files changed' tab at the top of the page.

Here is an example of a file that has been changed on this branch but shouldn't be: package-lock.json

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

github-actions · 2026-10-09T13:46:16Z

The files changed in this PR don't match what is expected for this task.

Please check that you committed the right files for the task, and that there are no accidentally committed files from other sprints.

Please review the 'files changed' tab at the top of the page.

Here is an example of a file that has been changed on this branch but shouldn't be: package-lock.json

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

RaihanSharif added 25 commits September 20, 2026 20:31

backend boilerplate

1d38a28

frontend boilerplate

919a6d9

define message shape

d5af26b

post new message

5200c6f

Finish non-interactive backend

ef6d1e5

Can post message, with validation. Can get all messages.

Merge branch 'main' into frontend

507640d

complete frontend layout and from

d7df7b5

non-live chat app done

e42720b

dockerfile for deployment

49ceee5

environment variables

8f48f94

install dotenv

fe110b9

fetch from production backend

40dbadd

short polling

b5aec51

optional long polling

d31c582

no live update likes

afd1068

sort of working live update reactions

80805e0

Define message class with autoincrement id

be3e08f

rebuild using integer id and Message class

4306653

store the id of the last fetched message in state.

590918b

add validation for getMessages

0f9a390

no sleep before next fetch

630a3ae

Errors and validatoin

0f632b0

Use REST style API endpoint

034791b

frontend error handling

8b2c69d

production backend url

09d08ab

RaihanSharif added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Sep 22, 2026

RaihanSharif added 4 commits September 29, 2026 15:45

Clean up model

4f625eb

Only return list of messages, or a single message. Clean up js doc

Use event streaming and REST for messages

065aa34

Messages can now be fetched or created using REST API. Client can then fetch subsequent messages using event streaming.

use Map instead of list to store messages.

06b6430

create new message handling function.

addMessage takes in username and msg_body as separate parameters

ef22de1

RaihanSharif added 11 commits October 2, 2026 02:28

update subscribe logic and add restarting websocket from client side

b551c70

remove unnecessary check

e801458

remove comment

425817f

Refactor: websocket version of backend.

5f28f18

Websocket version only has websocket code, everything else is in a separate file that can be reused by polling version.

extract common code out of web socket frontend script

2180255

extract out express application

806633e

polling backend done

3361d8e

separate polling & websocket frontend and backend

f98b3e0

Merge pull request #2 from RaihanSharif/refactor

6ffe037

Extract common code for the web socket and polling versions.

production URL

2dc2778

update dockerfile to run the polling app

a548c4d

LonMcGregor added the Review in progress This review is currently being reviewed. This label will be replaced by "Reviewed" soon. label Oct 7, 2026

github-actions Bot removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Oct 7, 2026

LonMcGregor reviewed Oct 7, 2026

View reviewed changes

LonMcGregor added Reviewed Volunteer to add when completing a review with trainee action still to take. and removed Review in progress This review is currently being reviewed. This label will be replaced by "Reviewed" soon. labels Oct 7, 2026

RaihanSharif added 2 commits October 9, 2026 13:52

stop tracking vs code settings

d484bf9

Comments to explain waiters and subscribers.

59383a6

RaihanSharif added Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. and removed Reviewed Volunteer to add when completing a review with trainee action still to take. labels Oct 9, 2026

github-actions Bot removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Oct 9, 2026

RaihanSharif added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Oct 9, 2026

github-actions Bot removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Oct 9, 2026

Conversation

RaihanSharif commented Sep 22, 2026

Learners, PR Template

Task code

Changelist

Uh oh!

RaihanSharif commented Oct 5, 2026

Uh oh!

github-actions Bot commented Oct 7, 2026

Uh oh!

LonMcGregor left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

LonMcGregor Oct 7, 2026

Choose a reason for hiding this comment

Uh oh!

RaihanSharif Oct 9, 2026

Choose a reason for hiding this comment

Uh oh!

LonMcGregor Oct 7, 2026

Choose a reason for hiding this comment

Uh oh!

RaihanSharif Oct 9, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

LonMcGregor Oct 7, 2026

Choose a reason for hiding this comment

Uh oh!

RaihanSharif Oct 9, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot commented Oct 7, 2026

Uh oh!

github-actions Bot commented Oct 7, 2026

Uh oh!

github-actions Bot commented Oct 9, 2026

Uh oh!

github-actions Bot commented Oct 9, 2026

Uh oh!

github-actions Bot commented Oct 9, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants