# A simple multiuser realtime text editor

## Provide an overview of how to build and run your app

`Socket.IO` is a library that enables low-latency, bidirectional and event-based communication between a client and a server. It is built on top of the WebSocket protocol and provides additional guarantees like fallback to HTTP long-polling or automatic reconnection. With Nide js at the server side, I created a socket with `Socket.IO` and allowed a connection to the server. Once the server connects, it then listens to events. The events can be either broadcasted or emitted. Once an event has been sent, the data which is in string form also get transmitted and the sever emits the same data on receipt to all other clients connectd to it. This makes sure that the client has the same data which they can edit. The `Socket.IO` library ahs both server side socket and client side socket for bidirectional data transfer and communication.

## A brief explanation of your architecture and system design

The client side which is the application layer will be built on `React js` and `Typescript` template. This is what the user sees and also interacts with. On the backend we will have the server built with Node js / Express js. The `Node js` will be used as an api endpoint to be connected to the client side. On top of `Node js` , we will have the `Socket.io` library to create sockets and allow bidirectional data transfer in form of strings. The `socket.io` library reduces latency and provides a two-way communication between the server and the client. This is done by events where through the `Socket.io`, the server can listen to events and get the data or emit events with data to all the connected users(clients) in real time. using the Conflict-free Replicated Data Type (CRDT) data structure, the same string is replicated on multiple editors, the state of the editors can be changed for all the users as the text keep on changing in real time.

## Conflict Resolution

In a multi-user real-time collaborative text editor, conflict resolution is handled by a combination of the user's input and the text editor's algorithms. When two or more users are editing the same document at the same time, the text editor tracks the changes that each user makes. If two users make conflicting changes to the same part of the document, the text editor must resolve the conflict before the changes can be saved. The text editor does this by first identifying the conflicting changes, and then applying a set of rules to determine which change should take precedence. In most cases, the text editor will simply choose the most recent change. However, in some cases, the text editor may give preference to changes made by users with certain permissions or privileges. Once the conflicting changes have been resolved, the text editor applies the changes to the document and saves it. The next time the document is opened, all users will see the resolved changes.

## Are there any cool technology/libraries/algorithms you want to explore further related to this app if you had the time?

There are many cool technologies related to multi-user real-time collaborative text editor apps that I would like to explore further if I had the time. Some of these technologies include libraries such as `ShareDB` and `Firepad`, and algorithms such as the `CRDT` algorithm, `Operational Transformation(OT)` library. `ShareDB` is a library that allows developers to build real-time collaborative applications. It is based on the ShareJS library, and provides a number of features that make it ideal for building real-time collaborative applications, such as the ability to track changes made by each user, and to merge those changes seamlessly. `Firepad` is another library that enables real-time collaboration. It is based on the Firebase library, and provides a number of features that make it ideal for building real-time collaborative applications, such as the ability to track changes made by each user, and to merge those changes seamlessly. The `CRDT` algorithm is an algorithm that allows for the consistent and conflict-free replication of data across multiple devices. It is an ideal algorithm for use in real-time collaborative applications, as it ensures that all users will see the same data, regardless of the order in which the changes are made.

## Are there any burning questions you have about the technology?

My question is :- Which web technologies combination can be best fit to build a big system for multiple users collaborating and support large teams eg. team of 10,000 members and make the changes and conflicts as seemlessly as possible?

## Heroku online url

`https://realtimetexteditor.herokuapp.com`