{"id":24854323,"url":"https://github.com/shikhu51197/socket.io-chatapp","last_synced_at":"2026-04-13T04:03:31.915Z","repository":{"id":221364073,"uuid":"753635858","full_name":"shikhu51197/Socket.io-ChatApp","owner":"shikhu51197","description":"This project is a simple real-time chat application built using Socket.io, React, and CSS. It allows users to join chat rooms, enter a username, and engage in real-time chat with multiple users.","archived":false,"fork":false,"pushed_at":"2024-02-29T20:08:51.000Z","size":253,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-31T15:41:38.137Z","etag":null,"topics":["cors","css3","expressjs","nodejs","react-bottom-scroll","react-router-dom","reactjs","socket-io","socketio-client"],"latest_commit_sha":null,"homepage":"https://socket-io-chat-app-p1dy.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/shikhu51197.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}},"created_at":"2024-02-06T14:10:56.000Z","updated_at":"2024-02-07T16:22:03.000Z","dependencies_parsed_at":"2024-02-29T21:28:09.955Z","dependency_job_id":"4d03dd9b-ad22-4d0b-b4cd-8489afdaec2f","html_url":"https://github.com/shikhu51197/Socket.io-ChatApp","commit_stats":null,"previous_names":["shikhu51197/socket.io-chatapp"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shikhu51197%2FSocket.io-ChatApp","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shikhu51197%2FSocket.io-ChatApp/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shikhu51197%2FSocket.io-ChatApp/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shikhu51197%2FSocket.io-ChatApp/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/shikhu51197","download_url":"https://codeload.github.com/shikhu51197/Socket.io-ChatApp/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245669323,"owners_count":20653131,"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":["cors","css3","expressjs","nodejs","react-bottom-scroll","react-router-dom","reactjs","socket-io","socketio-client"],"created_at":"2025-01-31T15:36:34.400Z","updated_at":"2026-04-13T04:03:31.826Z","avatar_url":"https://github.com/shikhu51197.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003e 💻 PROJECT NAME ✨ =\u003e 💻  :  Socket.io Live Chat with React and CSS 🧑‍🏫\n\u003cbr\u003e\n\u003cimg src =\"https://assessment.upscreen.ai/images/screeningcompleted.png\" alt=img /\u003e\n---\n## 🔗 Profile Links✨\n\n\n| Resume | Github                                                                                                                                   | Linkedin                                                                                                                                                            | Portfolio                                                                                                                                    | Blogger                                                                                                                                                           | Medium                                                                                                                                    |\n| ------------- | ---------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------- |\n| [![Resume](https://img.shields.io/badge/my_Resume-E75480?style=for-the-badge\u0026logo=ko-fi\u0026logoColor=white)](https://drive.google.com/file/d/1YE62u2ChjmlR-EKeqZ75UvFMg_KcY86T/view?usp=sharing) | [![github](https://img.shields.io/badge/github-1DA1F2?style=for-the-badge\u0026logo=github\u0026logoColor=white)](https://github.com/shikhu51197/)| [![linkedin](https://img.shields.io/badge/linkedin-0A66C2?style=for-the-badge\u0026logo=linkedin\u0026logoColor=white)](https://www.linkedin.com/in/shikha-gupta-12a2b5199) |[![portfolio](https://img.shields.io/badge/my_portfolio-18A303?style=for-the-badge\u0026logo=ionic\u0026logoColor=white)](https://shikhu51197.github.io/) |[![Blogger](https://img.shields.io/badge/Blogger-FE5A1D?style=for-the-badge\u0026logo=Blogger\u0026logoColor=white)](https://wwwartificial-intelligence.blogspot.com/) |[![Medium](https://img.shields.io/badge/Medium-000?style=for-the-badge\u0026logo=Medium\u0026logoColor=white)](https://medium.com/@sg780060) |  \n\n---\n# Overview✨ :-\n\nThis project is a simple real-time chat application built using Socket.io, React, and CSS. It allows users to join chat rooms, enter a username, and engage in real-time chat with multiple users.\n---\n\n# installed on your machine:\n\n    Node.js\n    npm (Node Package Manager)\n\n## Deployed Link Frontend\n\n```bash\n  https://socket-io-chat-app-p1dy.vercel.app/\n```\n\n## Deployed Link Backend\n\n```bash\n   https://chatapp-7jhb.onrender.com/\n```\n# Folder Structure\n\n     /server: Contains the Socket.io server code.\n    /client: Contains the React client code.\n    /public: Public assets.\n    \n---\n\n## Key Features :-\n\n- **User Authentication**: Users can enter a unique username on the homepage before accessing the chat application.\n- **Real-time Chat**: Engage in live chat with multiple users in real-time.\n\n---\n\n## Tech Stack\n\n- Frontend: Socket.io React CSS3\n- Backend: Node.js, Express.js\n\n\n## Getting Started\n\n### Installation\n\n1. Clone the repository:\n\n   ```\n   git clone https://github.com/shikhu51197/Socket.io-ChatApp.git\n   ```\n   \n2. Go to Backend Directory\n   ```\n   cd Backend\n   ```\n\n3. Install Dependencies:\n   ```\n   npm install \n   ```\n\n4. Application Start\n   ```\n   npm start\n   ```\n\n5. Go to Frontend Directory\n   ```\n   cd Frontend\n   ```\n\n6. Open With Live Server\n7. Enter a username on the homepage and click on the \"Login\" button.\n8. Navigate to the chat page to engage in real-time chat with multiple users.\n\n## Environment Variables Backend\n\nYou will need to set the following environment variables in a `.env` file:\n\n```ini\nPORT=`YOUR_REQUIRED_PORT`\nMONGO_URL=`YOUR_MONGO_ATLAS_URL`\n\n```\n\n\n## Endpoints Reference\n\nFor detailed information on how to use our API, please refer to the [API documentation](Backend/docs/ApiDocs.md).\n\n\n## Welcome Users Route\n\n| Route           | Endpoint | Description                            | Features          |\n| --------------- | -------- | -------------------------------------- | ----------------- |\n| Welcome Message | POST /    | Provides a welcome message to the API and Authenticate. | - Welcome message \u0026 user login  |\n\n\n\n![Screenshot (1962)](https://github.com/shikhu51197/Socket.io-ChatApp/assets/107506646/6cadc0e7-0065-4c6b-ba7e-c0ecf3a1e6c8)\n\n## Users Chat\n\n\n| Route           | Endpoint                       | Description                                                 | Features                               |\n| --------------- | ------------------------------ | ----------------------------------------------------------- | -------------------------------------- |\n| user chat page     |  /chat               |  chat with multiple users.                                          | - Chat with login user        |\n\n\n![Screenshot (1963)](https://github.com/shikhu51197/Socket.io-ChatApp/assets/107506646/b3cfe2d5-fbd2-4259-8349-29e1825c2184)\n\n\n\n\n--- \n\n\n# Package.json(Dependency)✨:-\n\n | Serial No  | Backend  |  Frontend     |\n| ----------- | ---------|-------------- |\n| 1 | nodemon  | socket.io-client|\n| 2 | socket.io  | react-bottom-scroll |\n| 3 | cors  | react |\n| 4 | express | react-router-dom |\n\n---\n    \nContributing\n\n     💻 Contributions are welcome! Please follow the standard guidelines for contributing.\n---\n\n\n\u003ch1 align=\"center\"\u003e✨Thank You✨\u003c/h1\u003e\n\n \n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshikhu51197%2Fsocket.io-chatapp","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fshikhu51197%2Fsocket.io-chatapp","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshikhu51197%2Fsocket.io-chatapp/lists"}