{"id":20555468,"url":"https://github.com/munenecalvin/real-time-chat-application","last_synced_at":"2026-04-10T07:03:09.340Z","repository":{"id":263013240,"uuid":"889068401","full_name":"MuneneCalvin/Real-Time-Chat-Application","owner":"MuneneCalvin","description":"Real Time Chat App | MERN \u0026\u0026 Socket.io \u0026\u0026 JWT","archived":false,"fork":false,"pushed_at":"2024-12-05T12:01:49.000Z","size":45596,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-16T18:02:13.708Z","etag":null,"topics":["chat-application","express","mern-stack","mongodb","nodejs","react","realtime-messaging","redux","socket-io"],"latest_commit_sha":null,"homepage":"https://real-time-chat-application-peach.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/MuneneCalvin.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}},"created_at":"2024-11-15T14:50:12.000Z","updated_at":"2024-12-05T12:01:58.000Z","dependencies_parsed_at":"2024-12-03T12:36:37.465Z","dependency_job_id":null,"html_url":"https://github.com/MuneneCalvin/Real-Time-Chat-Application","commit_stats":null,"previous_names":["munenecalvin/real-time-chat-application"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MuneneCalvin%2FReal-Time-Chat-Application","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MuneneCalvin%2FReal-Time-Chat-Application/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MuneneCalvin%2FReal-Time-Chat-Application/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MuneneCalvin%2FReal-Time-Chat-Application/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/MuneneCalvin","download_url":"https://codeload.github.com/MuneneCalvin/Real-Time-Chat-Application/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":242160700,"owners_count":20081719,"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-application","express","mern-stack","mongodb","nodejs","react","realtime-messaging","redux","socket-io"],"created_at":"2024-11-16T03:18:29.602Z","updated_at":"2026-04-10T07:03:09.230Z","avatar_url":"https://github.com/MuneneCalvin.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Real-Time Chat Website with MERN Stack, Socket.io, Redux Toolkit, and Tailwind CSS\n\nThis is a real-time chat website that allows users to connect with each other and chat in real-time. It was built using the MERN stack (MongoDB, Express.js, React.js, and Node.js), Socket.io, Redux Toolkit, and Tailwind CSS. \n\n- If you liked it then give this Repository a Star⭐\n\u003c!-- - Youtube Demo : \u003ca target=\"__blanck\" href=\"https://youtu.be/11oZj2jBhOE\"\u003eClick On Me\u003c/a\u003e --\u003e\n\n## Technologies Used\n\n- MERN stack (MongoDB, Express.js, React.js, and Node.js)\n- Socket.io\n- Redux Toolkit\n- Tailwind CSS\n\n## Features\n\n- Real-time chat: users can send and receive messages in real-time\n- User authentication: users can sign up, log in, and log out using JWT and Google Auth\n- Group creation: users can create chat rooms and invite others to join\n- Notifications: users can receive notifications on new messages\n- Emojis: users can send and receive emojis in messages\n- Profile page where users can update their avatar and display name.\n- Users can create a room to chat with others.\n- Search functionality.\n- Responsive design: the website is optimized for different screen sizes and devices\n\n## Configuration and Setup\nIn order to run this project locally, simply fork and clone the repository or download as zip and unzip on your machine.\n\n- Open the project in your prefered code editor.\n- Go to terminal -\u003e New terminal (If you are using VS code)\n- Split your terminal into two (run the client on one terminal and the server on the other terminal)\n\nIn the first terminal\n- cd client and create a .env file in the root of your client directory.\n- Supply the following credentials\n\n```\nREACT_APP_GOOGLE_CLIENT_ID = \nREACT_APP_SERVER_URL='http://localhost:8000'\n```\n\nTo get your Google ClientID for authentication, go to the [credential Page ](https://console.cloud.google.com/apis/credentials) (if you are new, then [create a new project first](https://console.cloud.google.com/projectcreate) and follow the following steps;\n\n- Click Create credentials \u003e OAuth client ID.\n- Select the Web application type.\n- Name your OAuth client and click Create\n- Remember to provide your domain and redirect URL so that Google identifies the origin domain to which it can display the consent screen. In development, that is going to be `http://localhost:3000` and `http://localhost:3000/login`\n- Copy the Client ID and assign it to the variable `REACT_APP_GOOGLE_CLIENT_ID` in your .env file\n\n```\n$ cd client\n$ npm install (to install client-side dependencies)\n$ npm start (to start the client)\n```\nIn the second terminal\n- cd server and create a .env file in the root of your server directory.\n- Supply the following credentials\n\n```\nPORT=9099\nURL=\nSECRET=\nCLIENT_ID=\nBASE_URL=\"http://localhost:3000\"\n```\n```\n$ cd server\n$ npm install (to install server-side dependencies)\n\u0026 npm start (to start the server)\n```\n\n\n## Contributing\n\nContributions to this project are welcome! If you find a bug or want to add a feature, please submit an issue or a pull request. To contribute, follow these steps:\n\n1. Fork the repository\n2. Create a new branch for your feature: `git checkout -b my-new-feature`\n3. Make changes and commit them: `git commit -m 'Add some feature'`\n4. Push your branch to your forked repository: `git push origin my-new-feature`\n5. Create a Pull Request\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmunenecalvin%2Freal-time-chat-application","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmunenecalvin%2Freal-time-chat-application","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmunenecalvin%2Freal-time-chat-application/lists"}