{"id":28032980,"url":"https://github.com/pavansingh888/devbond-webapp","last_synced_at":"2026-04-09T12:51:46.196Z","repository":{"id":269117574,"uuid":"906444682","full_name":"pavansingh888/DevBond-WebApp","owner":"pavansingh888","description":"Frontend service of DevBond application built using React, Tailwind, DaisyUI etc.","archived":false,"fork":false,"pushed_at":"2025-04-15T10:59:49.000Z","size":801,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-05-11T09:06:49.201Z","etag":null,"topics":["axios-react","daisyui","javascript","react-components","react-hooks","react-redux","react-router","react-router-dom","reactjs","redux","redux-toolkit","socket-io-client","tailwindcss","validatorjs","vite-react"],"latest_commit_sha":null,"homepage":"https://devbond.in/","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/pavansingh888.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":"2024-12-20T23:37:51.000Z","updated_at":"2025-04-15T11:02:44.000Z","dependencies_parsed_at":null,"dependency_job_id":"b89d5593-f9d0-4de3-9235-d6c3bd2b069f","html_url":"https://github.com/pavansingh888/DevBond-WebApp","commit_stats":null,"previous_names":["pavansingh888/devbond-webapp"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pavansingh888%2FDevBond-WebApp","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pavansingh888%2FDevBond-WebApp/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pavansingh888%2FDevBond-WebApp/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pavansingh888%2FDevBond-WebApp/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pavansingh888","download_url":"https://codeload.github.com/pavansingh888/DevBond-WebApp/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253540828,"owners_count":21924536,"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":["axios-react","daisyui","javascript","react-components","react-hooks","react-redux","react-router","react-router-dom","reactjs","redux","redux-toolkit","socket-io-client","tailwindcss","validatorjs","vite-react"],"created_at":"2025-05-11T09:07:03.782Z","updated_at":"2025-12-30T23:05:02.171Z","avatar_url":"https://github.com/pavansingh888.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🚀 DevBond — Frontend\n\nDevBond is a full-stack social networking platform built using the MERN stack. This repository contains the **frontend application** built with **Vite + React**, styled using **Tailwind CSS** and **Daisy UI**, featuring real-time chat, profile management, social connections, and more.\n\n---\n\n## 🛠️ Tech Stack\n\n- React (Vite)\n- Tailwind CSS + Daisy UI\n- React Router\n- Redux Toolkit\n- Axios\n- Socket.IO Client\n\n---\n\n## 📦 Project Setup\n\n### 1. Clone the Repository\n\n```bash\ngit clone https://github.com/pavansingh888/DevBond-WebApp.git\ncd devbond-web\n```\n\n### 2. Install Dependencies\n\n```bash\nnpm install\n```\n\n### 3. Run the App Locally\n\n```bash\nnpm run dev\n```\n\n---\n\n## ✨ Key Features\n\n- ✅ Hello World setup via Vite\n- 🎨 Styled with Tailwind CSS + Daisy UI\n- 🧭 Routing using React Router\n- 🔐 Login, Signup \u0026 Protected Routes\n- 📥 Axios API calls with `withCredentials: true`\n- 🔄 Redux Toolkit for state management\n- 🔔 Toast notifications on profile updates\n- 🤝 Social Connection Requests (Send, Accept, Reject)\n- 🧾 Feed with user cards\n- ✍️ Edit Profile\n- 🔄 Logout + Session Persistence\n- 🔗 View Connections \u0026 Requests\n- 💬 Real-time Chat via WebSockets\n- 💰 Razorpay Integration for Premium Users\n- 📧 Email Notifications using Amazon SES\n- 📆 Scheduled Cron Jobs via Node for daily email reports\n\n---\n\n## 🧭 Routes Overview\n\n```jsx\n\u003cBrowserRouter\u003e\n        \u003cRoutes\u003e\n          \u003cRoute path=\"/\" element={\u003cBody /\u003e}\u003e\n            \u003cRoute path=\"/\" element={\u003cFeed/\u003e}\u003e\u003c/Route\u003e\n            \u003cRoute path=\"/chat/:targetUserId\" element={\u003cChat/\u003e}\u003e\u003c/Route\u003e\n            \u003cRoute path=\"/premium\" element={\u003cPremium/\u003e}\u003e\u003c/Route\u003e\n            \u003cRoute path=\"/login\" element={\u003cLogin /\u003e}\u003e\u003c/Route\u003e\n            \u003cRoute path=\"/profile\" element={\u003cProfile /\u003e}\u003e\u003c/Route\u003e\n            \u003cRoute path=\"/connections\" element={\u003cConnections /\u003e}\u003e\u003c/Route\u003e\n            \u003cRoute path=\"/requests\" element={\u003cRequests/\u003e}\u003e\u003c/Route\u003e\n            \u003cRoute path=\"/error\" element={\u003cErrorPage/\u003e}\u003e\u003c/Route\u003e\n          \u003c/Route\u003e\n        \u003c/Routes\u003e\n      \u003c/BrowserRouter\u003e\n```\n\n---\n\n## 🔒 Authentication Guard\n\n- Unauthenticated users are redirected to `/login`.\n- Token is required for accessing protected routes.\n\n---\n\n## 🧪 E2E Testing\n\nFull end-to-end test cases are implemented to verify flows like:\n\n- Signup\n- Login\n- Edit Profile\n- Connection Requests\n- Payment Flow\n- Real-time Messaging\n\n---\n\n## 🚀 Deployment (Frontend on AWS EC2)\n\n1. Build the project:\n\n```bash\nnpm run build\n```\n\n2. Copy `dist` to EC2:\n\n```bash\nscp -r dist/* ubuntu@\u003cyour-ec2-ip\u003e:/var/www/html/\n```\n\n3. Configure Nginx:\n\n```nginx\nserver {\n  listen 80;\n  server_name DevBond.com;\n\n  root /var/www/html;\n  index index.html;\n\n  location /api/ {\n    proxy_pass http://localhost:7777/;\n    proxy_http_version 1.1;\n    proxy_set_header Upgrade $http_upgrade;\n    proxy_set_header Connection 'upgrade';\n    proxy_set_header Host $host;\n    proxy_cache_bypass $http_upgrade;\n  }\n}\n```\n\n4. Restart Nginx:\n\n```bash\nsudo systemctl restart nginx\n```\n\n---\n\n## 🌐 Domain Setup via Cloudflare\n\n- Purchase domain (e.g. from GoDaddy)\n- Point nameservers to Cloudflare\n\n## 📧 Amazon SES for Emails\n\n- Create IAM User with SES Access\n- Setup domain \u0026 email identity\n- Use AWS SDK (v3)\n- Store keys in `.env`:\n  ```\n  AWS_ACCESS_KEY=\n  AWS_SECRET_KEY=\n  ```\n- Setup `SesClient` \u0026 dynamic send email function\n\n---\n\n## ⏰ Cron Jobs\n\n- Use `node-cron` \n- Daily scheduled emails to users with pending requests\n\n---\n\n## 💸 Razorpay Integration\n\n- Razorpay Order creation from frontend\n- Webhook setup to capture payment success\n- Store transactions in DB\n- Use keys from `.env`\n\n---\n\n## 💬 Real-Time Chat (Socket.IO)\n\n- Route: `/chat/:targetUserId`\n- Green indicator for online users\n- \"Last seen\" status\n- Auth checks for socket connections\n\n---\n\n## 📁 .env Example\n\n```env\nVITE_API_BASE_URL=http://devbond.com/api\n```\n\nMake sure to **not commit** your `.env` file.\n---\n\n## 🙌 Contributors\n\n- [Pavan Singh](https://github.com/pavansingh888)\n\n---\n\n## 📄 License\n\nThis project is licensed under the [MIT License](LICENSE).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpavansingh888%2Fdevbond-webapp","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpavansingh888%2Fdevbond-webapp","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpavansingh888%2Fdevbond-webapp/lists"}