{"id":19003989,"url":"https://github.com/victorgoubet/livechat","last_synced_at":"2026-04-28T16:07:54.857Z","repository":{"id":143512003,"uuid":"614493265","full_name":"VictorGoubet/LiveChat","owner":"VictorGoubet","description":"Simple live chat using soket.io, react and google authenticator","archived":false,"fork":false,"pushed_at":"2023-04-04T18:30:34.000Z","size":524,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-06-17T05:01:56.006Z","etag":null,"topics":["chat","google-authenticator","livechat","nodejs","react","socket-io","webchat"],"latest_commit_sha":null,"homepage":"https://live-chat-pearl.vercel.app","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/VictorGoubet.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2023-03-15T17:39:24.000Z","updated_at":"2024-10-09T17:56:07.000Z","dependencies_parsed_at":null,"dependency_job_id":"ce63d74c-2feb-4dda-ab12-2b8d2d12ef62","html_url":"https://github.com/VictorGoubet/LiveChat","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/VictorGoubet/LiveChat","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VictorGoubet%2FLiveChat","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VictorGoubet%2FLiveChat/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VictorGoubet%2FLiveChat/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VictorGoubet%2FLiveChat/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/VictorGoubet","download_url":"https://codeload.github.com/VictorGoubet/LiveChat/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VictorGoubet%2FLiveChat/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":262240108,"owners_count":23280460,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["chat","google-authenticator","livechat","nodejs","react","socket-io","webchat"],"created_at":"2024-11-08T18:21:09.470Z","updated_at":"2026-04-28T16:07:49.837Z","avatar_url":"https://github.com/VictorGoubet.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![Forks][forks-shield]][forks-url]\r\n[![Stargazers][stars-shield]][stars-url]\r\n\r\n\u003ca name=\"readme-top\"\u003e\u003c/a\u003e\r\n\u003cbr /\u003e\r\n\u003cdiv align=\"center\"\u003e\r\n  \u003ca href=\"https://live-chat-goubs.fly.dev/\"\u003e\r\n    \u003cimg src=\"https://livechat.design/images/livechat/DIGITAL%20%28RGB%29/PNG/Stacked_RGB_Black.png\" alt=\"Logo\" width=\"90\" height=\"80\"\u003e\r\n  \u003c/a\u003e\r\n\r\n  \u003ch3 align=\"center\"\u003eLive Chat\u003c/h3\u003e\r\n\r\n  \u003cp align=\"center\"\u003e\r\n    \u003ci\u003eWho wants to use facebook anymore..\u003c/i\u003e\r\n    \u003cbr /\u003e\r\n    \u003ca href=\"https://live-chat-goubs.fly.dev/\"\u003e\u003cstrong\u003eVisit »\u003c/strong\u003e\u003c/a\u003e\r\n    \u003cbr /\u003e\r\n    \u003cbr /\u003e\r\n    \u003ca href=\"https://github.com/VictorGoubet/LiveChat/issues\"\u003eReport Bug\u003c/a\u003e\r\n    •\r\n    \u003ca href=\"https://github.com/VictorGoubet/LiveChat/issues\"\u003eRequest Feature\u003c/a\u003e\r\n  \u003c/p\u003e\r\n\u003c/div\u003e\r\n\r\n\r\n## About The Project\r\n\u003c/br\u003e\r\n\r\nWhat could be easier than a web chat? We use it every day to exchange messages, photos, news or even confidential information. But do we really trust them? Do we really know what's behind it, where our data goes, how it transits and could we easily reimplement this everyday technology? \r\n\r\nThat's the goal of this project, let's do it!\r\n\r\n[![Product Name Screen Shot][product-screenshot]](screenshot.PNG)\r\n\r\n\r\n\r\n\u003cp align=\"right\"\u003e\u003ca href=\"#readme-top\"\u003e🔝\u003c/a\u003e\u003c/p\u003e\r\n\r\n\r\n## Implementation\r\n\r\n\u003cbr\u003e\r\n\r\n### About API\r\n\r\n\u003cbr\u003e\r\n\r\nThe architecture of a web chat is pretty simple. First you will have the backend server. You will find two types of handled requests. First, the classic rest api requests. These one will be used for login, registeration, getting the number of users and so on. The second type is socket.io events. You can see it as a biderectionnal tunnel. Indeed, in the classic pattern you would have a client calling a server and getting a response. Here, the client can send but also receive a response. It's really like a human conversation, each entity speaking but also listening to the other. This type of protocol is perfect then for a web chat!\r\n\r\nFor the front part, nothing crazy: just a react app with routers for the differents pages.\r\n\r\n\u003cbr\u003e\r\n\r\n### About authentication\r\n\r\n\u003cbr\u003e\r\n\r\nThe new trends is about MFA, and one of the used tier is google authenticator. I thought that it could be fun to take part of this technology to avoid to remember all the time its password but just to have to give its username and the time-generated token from google authenticator. \r\n\r\nYou can see here the workflow of google authenticator extracted from this nice [twit](https://twitter.com/alexxubyte/status/1549781763999744000).\r\n\u003ccenter\u003e\r\n\u003cbr\u003e\r\n\u003cimg src=\"https://pbs.twimg.com/media/FYHuTB0VUAMTGI0?format=jpg\u0026name=4096x4096\" alt=\"Google Authenticator archi\" width=\"400\"\u003e\r\n\u003c/center\u003e\r\n\r\n\u003cbr\u003e\r\n\r\n### And for the storage ?\r\n\r\n\u003cbr\u003e\r\n\r\nUsers and messages are store in mongo DB. A nice improvment would be to integrate E2E encryption which is discussed for example in [this](https://www.youtube.com/watch?v=jkV1KEJGKRA\u0026ab_channel=Computerphile) great video from computerphile. \r\n\r\n\u003cbr\u003e\r\n\r\n### Conclusion\r\n\r\n\u003cbr\u003e\r\n\r\nWeb chat are simple! Even a baby (or chatgpt) could create a live chat nowadays. The challenge is not about the architecture and the technologies used in these applications but about the governance and the security of the data. The question is not, \"is this app working?\" but \"is this app secured\". We saw that E2E protocols can help to provide a good level of encryption, but keep in mind that even if the system can't tell what do you speak about, he knows that you, the user 07900978 sent 11 messages to the user 0909809 at 9pm. The usage metrics are often the time more precious than the last story of when you were drunk. \r\n\r\n\u003cp align=\"right\"\u003e\u003ca href=\"#readme-top\"\u003e🔝\u003c/a\u003e\u003c/p\u003e\r\n\r\n## Getting Started\r\n\r\nYou can directly go on the [webapp](https://live-chat-goubs.fly.dev/), but if you want, you can execute locally the project.\r\n\r\n### Prerequisites\r\n\r\nYou will just need a recent version of node.\r\n\r\n  ```sh\r\n  \u003e node -v\r\n  \u003e v18.12.1\r\n  ```\r\n\r\n### Installation\r\n\r\nYou can follow the different steps inorder to get the app working on your computer\r\n\r\n\r\n1. Clone the repo\r\n\r\n   ```sh\r\n   git clone https://github.com/VictorGoubet/LiveChat.git\r\n   ```\r\n\r\n2. Install packages. (It will install required packages from front and back)\r\n\r\n   ```sh\r\n   npm run build\r\n   ```\r\n\r\n3. Launch the server\r\n\r\n   ```sh\r\n   npm start\r\n   ```\r\n\r\n4. Go to **localhost:5000** in a browser\r\n\r\n5. Try it yourself! \r\n\r\n\r\n\r\n\u003cp align=\"right\"\u003e\u003ca href=\"#readme-top\"\u003e🔝\u003c/a\u003e\u003c/p\u003e\r\n\r\n\r\n\r\n\r\n\r\n\u003c!-- CONTACT --\u003e\r\n-----\r\n\u003c/br\u003e\r\n\r\n[![LinkedIn][linkedin-shield]][linkedin-url]\r\n\u003c/br\u003e\r\nVictor Goubet - victorgoubet@orange.fr  \r\n\r\n\r\n\r\n\u003c!-- MARKDOWN LINKS \u0026 IMAGES --\u003e\r\n[forks-shield]: https://img.shields.io/github/forks/VictorGoubet/LiveChat.svg?style=for-the-badge\r\n[forks-url]: https://github.com/VictorGoubet/LiveChat/network/members\r\n[stars-shield]: https://img.shields.io/github/stars/VictorGoubet/LiveChat.svg?style=for-the-badge\r\n[stars-url]: https://img.shields.io/github/issues/VictorGoubet/LiveChat/stargazers\r\n[issues-shield]: https://img.shields.io/github/issues/VictorGoubet/LiveChat.svg?style=for-the-badge\r\n[issues-url]: https://github.com/VictorGoubet/LiveChat/issues\r\n[linkedin-shield]: https://img.shields.io/badge/-LinkedIn-black.svg?style=for-the-badge\u0026logo=linkedin\u0026colorB=555\r\n[linkedin-url]: https://www.linkedin.com/in/victorgoubet/\r\n[product-screenshot]: screenshot.png","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvictorgoubet%2Flivechat","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvictorgoubet%2Flivechat","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvictorgoubet%2Flivechat/lists"}