Creating a live collaboration web page [duplicate]

This post is hidden. You deleted this post 3 days ago.

Closed. This question is seeking recommendations for software libraries, tutorials, tools, books, or other off-site resources. It does not meet Stack Overflow guidelines. It is not currently accepting answers.


I want to create a normal web page with images, buttons, elements, etc. I want to be able to turn on live mode, and then have this page be interactive with multiple users.

So I can start a session, send the link to others, let’s say 5 people, and then we can all click around on the page and the result of this clicking around will appear for everyone. So if you click on a button and a modal opens, it needs to open for everyone else. The idea here for what needs to be “real-time” is simply like this, and nothing complicated, just a static web page.

An example is, if I click a button and the background changes to red, it changes to red for all live users, and also the ability to track cursors with names like Miro Board.

All the tutorials and articles I’ve seen, like using collaboration engine, or meteor.js, or others, are purely for canvas/document collaboration like Google Docs, Miro Board, etc.

What I want to know is,
1. Is this possible, to have live collaboration on a web elements like button or navigation rather than a form or a canvas, if so how would I do this?
3. What would the logic flow for a code sample for this look like? What data do I track, send to the server, and what data do the other users receive, etc?