{"id":25403152,"url":"https://github.com/prathamesh-pichkate/quickconnect","last_synced_at":"2026-04-10T03:57:05.955Z","repository":{"id":273296276,"uuid":"919239876","full_name":"prathamesh-pichkate/QuickConnect","owner":"prathamesh-pichkate","description":"Real time chat application","archived":false,"fork":false,"pushed_at":"2025-03-20T08:32:46.000Z","size":194,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-20T09:28:19.675Z","etag":null,"topics":["cloudinary","express","mongodb","mongoose","nodejs","reactjs","restapi","socket-io","zustand"],"latest_commit_sha":null,"homepage":"https://quickconnect-p8nk.onrender.com","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/prathamesh-pichkate.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":"2025-01-20T02:52:38.000Z","updated_at":"2025-03-20T08:32:50.000Z","dependencies_parsed_at":"2025-01-20T04:18:50.450Z","dependency_job_id":"b3e06db9-4c32-40c1-a6ce-f57e922ba51d","html_url":"https://github.com/prathamesh-pichkate/QuickConnect","commit_stats":null,"previous_names":["prathamesh-pichkate/quickconnect"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prathamesh-pichkate%2FQuickConnect","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prathamesh-pichkate%2FQuickConnect/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prathamesh-pichkate%2FQuickConnect/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/prathamesh-pichkate%2FQuickConnect/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/prathamesh-pichkate","download_url":"https://codeload.github.com/prathamesh-pichkate/QuickConnect/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248574896,"owners_count":21127085,"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":["cloudinary","express","mongodb","mongoose","nodejs","reactjs","restapi","socket-io","zustand"],"created_at":"2025-02-16T02:28:03.327Z","updated_at":"2025-12-30T19:04:22.398Z","avatar_url":"https://github.com/prathamesh-pichkate.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Real-Time Chat Application Documentation\n\n## Project Overview\nThis real-time chat application is built to facilitate seamless communication among users, featuring functionalities like instant messaging, online status indicators, and user authentication. The application uses the MERN stack (MongoDB, Express.js, React.js, Node.js) along with Socket.io for real-time communication. TailwindCSS and Daisy UI enhance the styling, while Zustand is employed for global state management.\n\n## Features\n### Core Features\n- **Authentication \u0026 Authorization**: JWT-based user authentication and authorization.\n- **Real-Time Messaging**: Instant messaging powered by Socket.io.\n- **Online User Status**: Display the online/offline status of users.\n- **Error Handling**: Robust error handling on both the client and server sides.\n- **Photo Uploads**: Cloudinary integration for profile and message image storage.\n\n### Pages\n- **Signup \u0026 Login Pages**: User registration and authentication.\n- **Home Page**:\n  - Sidebar: Displays contacts and chat list.\n  - Chat Container: Shows messages and typing status.\n- **Profile Page**: User profile management.\n- **Settings Page**: Customizable user settings.\n\n## Tech Stack\n- **Frontend**: React.js, Zustand, TailwindCSS, Daisy UI\n- **Backend**: Node.js, Express.js, Socket.io\n- **Database**: MongoDB\n- **Authentication**: JWT (JSON Web Tokens)\n- **Image Storage**: Cloudinary\n- **Deployment**: Render\n\n## Project Setup\n### Prerequisites\nEnsure you have the following installed:\n- Node.js (v16 or higher)\n- MongoDB (local or cloud instance)\n- A Cloudinary account\n\n### Installation Steps\n1. **Clone the Repository**:\n   ```bash\n   https://github.com/prathamesh-pichkate/QuickConnect.git\n   ```\n\n2. **Install Dependencies**:\n   ```bash\n   cd frontend\n   npm install\n   cd backend\n   npm install\n   ```\n\n3. **Configure Environment Variables**:\n   - Create a `.env` file in the root directory.\n   - Add the following variables:\n     ```env\n     MONGO_URI=your_mongodb_connection_string\n     CLOUDINARY_CLOUD_NAME=your_cloudinary_cloud_name\n     CLOUDINARY_API_KEY=your_cloudinary_api_key\n     CLOUDINARY_API_SECRET=your_cloudinary_api_secret\n     JWT_SECRET=your_jwt_secret\n     PORT=your_server_port\n     ```\n\n4. **Run the Server**:\n   ```bash\n   npm run dev\n   ```\n\n5. **Run the Client**:\n   ```bash\n   cd frontend\n   npm run dev\n   ```\n\n6. **Access the Application**:\n   - Open your browser and navigate to `http://localhost:\u003cPORT\u003e`.\n\n\n### Frontend Pages\n- **Signup \u0026 Login Pages**: Collect user credentials and authenticate.\n- **Profile Page**: Display and edit user information.\n- **Settings Page**: Update user preferences.\n- **Home Page - Sidebar**: Show a list of contacts and chat rooms.\n- **Home Page - Chat Container**: Display message history and allow new messages to be sent.\n\n## Real-Time Messaging\n### Understanding \u0026 Implementing Socket.io\n1. **Backend Implementation**:\n   - Establish a Socket.io server on the defined port.\n   - Handle events like `connection`, `message`, and `disconnect`.\n2. **Frontend Integration**:\n   - Connect the React application to the Socket.io server.\n   - Listen for real-time updates and emit user actions.\n\n## Deployment to Render\n1. Deploy the backend as a web service.\n2. Deploy the frontend as a static site.\n3. Add environment variables to the Render dashboard.\n\n## Resources Used\n- React.js Documentation\n- TailwindCSS Documentation\n- Daisy UI Documentation\n- Socket.io Documentation\n- Cloudinary Documentation\n- MongoDB Documentation\n\n## Contribution\nFeel free to fork the repository and submit a pull request for any improvements or bug fixes.\n\n## License\nThis project is licensed under the [MIT License](LICENSE).\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fprathamesh-pichkate%2Fquickconnect","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fprathamesh-pichkate%2Fquickconnect","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fprathamesh-pichkate%2Fquickconnect/lists"}