{"id":21672131,"url":"https://github.com/espinbrandon49/swap-meet-react","last_synced_at":"2026-04-10T07:11:05.354Z","repository":{"id":189766905,"uuid":"681230879","full_name":"espinbrandon49/Swap-Meet-React","owner":"espinbrandon49","description":"Full Stack Ecommerce - Swap Meet React","archived":false,"fork":false,"pushed_at":"2025-09-24T00:10:22.000Z","size":5576,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-09-24T02:23:14.462Z","etag":null,"topics":["axios-rest","bcrypt-nodejs","bootstrap","expressjs","formik","formik-yup","heroku","jwt-authentication","multer","mysql","nodejs","react","react-bootstrap","react-dom","react-router","react-router-dom","react-toastify","sequelize-orm"],"latest_commit_sha":null,"homepage":"https://jovial-belekoy-f030f6.netlify.app/login","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/espinbrandon49.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"license","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,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2023-08-21T14:55:49.000Z","updated_at":"2025-09-24T00:10:25.000Z","dependencies_parsed_at":"2025-01-25T09:23:37.805Z","dependency_job_id":"8f792d0d-12c4-42dc-9689-c72b23337fa0","html_url":"https://github.com/espinbrandon49/Swap-Meet-React","commit_stats":null,"previous_names":["espinbrandon49/swap-meet-react"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/espinbrandon49/Swap-Meet-React","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/espinbrandon49%2FSwap-Meet-React","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/espinbrandon49%2FSwap-Meet-React/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/espinbrandon49%2FSwap-Meet-React/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/espinbrandon49%2FSwap-Meet-React/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/espinbrandon49","download_url":"https://codeload.github.com/espinbrandon49/Swap-Meet-React/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/espinbrandon49%2FSwap-Meet-React/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278411261,"owners_count":25982368,"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","status":"online","status_checked_at":"2025-10-05T02:00:06.059Z","response_time":54,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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-rest","bcrypt-nodejs","bootstrap","expressjs","formik","formik-yup","heroku","jwt-authentication","multer","mysql","nodejs","react","react-bootstrap","react-dom","react-router","react-router-dom","react-toastify","sequelize-orm"],"created_at":"2024-11-25T13:18:16.278Z","updated_at":"2026-04-10T07:11:05.348Z","avatar_url":"https://github.com/espinbrandon49.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# SwapMeetReact\n\nSwapMeetReact is a full-stack marketplace system built to demonstrate clear user flow, structured UI architecture, and real data relationships across categories, products, and users.\n\nRather than relying on surface-level styling alone, the app emphasizes consistency and maintainability through a defined design system and reusable components such as shared cards, headers, form shells, and loading and empty states. The frontend was intentionally refactored to reduce duplication and keep pages focused on data flow, while the backend supports scoped data access and predictable API behavior.\n\nThe result is a clean, understandable application that demonstrates how a marketplace works under the hood, not just how it looks on the surface.\n\n---\n\n## Live Demo\n\nhttps://swapmeetreact-ad48473e0ba5.herokuapp.com/\n\n---\n\n## Tech Stack\n\n**Frontend**\n- React\n- React Router\n- Axios\n- Bootstrap (selectively used)\n\n**Backend**\n- Node.js\n- Express\n\n**Database**\n- MySQL (JawsDB on Heroku)\n- Sequelize ORM\n\n**Deployment**\n- Heroku (monolith architecture — frontend + backend served together)\n\n---\n\n## Core Features\n\n- Category-based product browsing across all sellers\n- Product detail view with seller context\n- User-specific cart spanning multiple shops\n- Shop/profile page displaying seller-specific inventory\n- Owner dashboard for managing products and categories (CRUD)\n- Centralized API structure with predictable responses\n- Shared UI components for consistency across pages\n\n---\n\n## Architecture Notes\n\n- Deployed as a **single Heroku monolith** (Express serves React build)\n- API and frontend operate from the same origin (no separate client deploy)\n- Backend routes organized for consistent data access patterns\n- Frontend structured around reusable components instead of duplicated markup\n- Environment-based configuration for local vs production behavior\n\n---\n\n## User Flow Overview\n\n1. Browse categories or recent products from the homepage  \n2. View products within a category  \n3. Inspect product details and seller information  \n4. Add items to a cart (across multiple sellers)  \n5. Manage cart and simulate checkout  \n6. Sellers manage their own inventory via dashboard  \n\n---\n\n## Local Setup\n\n```bash\ngit clone https://github.com/espinbrandon49/Swap-Meet-React.git\ncd swapmeetreact\nnpm install\n```\n\n### Environment Variables\n\nCreate a `.env` file in the server:\n\n```\nDB_NAME=your_db\nDB_USER=your_user\nDB_PW=your_password\nDB_HOST=localhost\nDB_PORT=3306\n```\n\n### Run locally\n\n```bash\nnpm start\n```\n\n---\n\n## Seeding the Database\n\nTo populate initial data:\n\n```bash\nnode seeds/index.js\n```\n\n---\n\n## Notes\n\n- This project was intentionally refactored beyond its original bootcamp scope to improve structure, consistency, and deployment strategy.\n- Focus was placed on **clarity of data flow**, not just UI appearance.\n- Designed as a **portfolio-ready demonstration of full-stack fundamentals**.\n\n---\n\n## Demo Video\n\nhttps://youtu.be/gm3SuokmNJE\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fespinbrandon49%2Fswap-meet-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fespinbrandon49%2Fswap-meet-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fespinbrandon49%2Fswap-meet-react/lists"}