{"id":24141700,"url":"https://github.com/jipconan/jippyhome-3d-e-commerce","last_synced_at":"2026-04-10T06:37:57.145Z","repository":{"id":253481732,"uuid":"842447180","full_name":"jipconan/jippyhome-3d-e-commerce","owner":"jipconan","description":"JippyHome is a 3D furniture e-commerce site where users can explore and preview furniture products in detail before buying.","archived":false,"fork":false,"pushed_at":"2024-09-25T04:32:33.000Z","size":79836,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-12T04:48:47.392Z","etag":null,"topics":["api","chakra-ui","chakraui","cloudinary","cloudinary-api","e-commerce-website","mongodb","mongodb-atlas","mongoose","react","react-router","react-three-fiber","reactjs","tailwindcss","typescript","vite"],"latest_commit_sha":null,"homepage":"https://jippyhome-3d-e-commerce.onrender.com/","language":"TypeScript","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/jipconan.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-08-14T11:20:55.000Z","updated_at":"2025-01-01T09:49:54.000Z","dependencies_parsed_at":"2024-08-26T11:35:33.788Z","dependency_job_id":"cc6a4c27-3208-46f8-ba49-93dbc5464d68","html_url":"https://github.com/jipconan/jippyhome-3d-e-commerce","commit_stats":null,"previous_names":["jipconan/jippyhome-3d-e-commerce"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jipconan%2Fjippyhome-3d-e-commerce","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jipconan%2Fjippyhome-3d-e-commerce/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jipconan%2Fjippyhome-3d-e-commerce/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jipconan%2Fjippyhome-3d-e-commerce/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jipconan","download_url":"https://codeload.github.com/jipconan/jippyhome-3d-e-commerce/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241367933,"owners_count":19951448,"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":["api","chakra-ui","chakraui","cloudinary","cloudinary-api","e-commerce-website","mongodb","mongodb-atlas","mongoose","react","react-router","react-three-fiber","reactjs","tailwindcss","typescript","vite"],"created_at":"2025-01-12T04:48:52.598Z","updated_at":"2025-12-30T20:13:14.555Z","avatar_url":"https://github.com/jipconan.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# JippyHome 3D E-Commerce\n\n## Summary\n\nThis e-commerce website allows users to browse and purchase furniture with excellent catalogs. The app provides a seamless shopping experience with a responsive 3D model previewer to allow shoppers to see the furniture in a 3 dimensions.\n\n## Key Features\n\n- **3D model previewer:**\n  \u003c/br\u003e\n  Preview the model in 3D with different lighting modes.\n- **Product Catalog:**\n  \u003c/br\u003e\n  Display a wide range of products with detailed descriptions, images, and pricing.\n- **Shopping Cart:**\n  \u003c/br\u003e\n  Offer a smooth checkout process with various payment and shipping options.\n- **Checkout Process:**\n  \u003c/br\u003e\n  Provide a streamlined checkout process with options for payment and shipping.\n- **Admin Dashboard:**\n  \u003c/br\u003e\n Provide an admin dashboard for managing products, orders, inventory, and user accounts.\n- **Responsive Design:**\n  \u003c/br\u003e\n  Ensure the website adapts to different devices and screen sizes for an optimal user experience.\n- **Performance Optimization:**\n  \u003c/br\u003e\n  Enhance website performance for quick load times and easy navigation.\n\n## Deployed URL\n\nYou can access the deployed URL at [JippyHome 3D E-Commerce](https://jippyhome-3d-e-commerce.onrender.com/).\n\n## Trello Board\n\nYou can access the trello board URL at [JippyHomeTrello Board](https://trello.com/b/W6SJDniH/project-4-jippyhome).\nIn my board, I have included links to ERD diagrams, wireframes.\n\n## Website Screenshots\n\n|                             **Landing Page**                              |                           **Signup Page**                            |\n| :-----------------------------------------------------------------------: | :------------------------------------------------------------------: | \n|            ![Landing Page](./public/media/github/landingpage.JPG)             |            ![Signup Page](./public/media/github/signuppage.JPG)             |\n|                              **Login Page**                               |                           **Account Page**                           |                  \n|            ![Login Page](./public/media/github/loginpage.JPG)              |          ![Account Page](./public/media/github/accountpage.JPG)            |\n|                              **Store Page**                               |                           **Category Page**                          |                  \n|            ![Store Page](./public/media/github/storepage.JPG)              |         ![Category Page](./public/media/github/categorypage.JPG)           |\n|                         **Product Page**                                  |                    **3D Preview Modal (Default)**                    |                  \n|            ![Product Page](./public/media/github/productpage.JPG)          |      ![3D Preview Modal Default](./public/media/github/3dpreviewmodal-default.JPG)      |\n|                      **3D Preview Modal (Warm)**                          |                      **3D Preview Modal (Cool)**                     |                  \n| ![3D Preview Modal Warm](./public/media/github/3dpreviewmodal-warm.JPG)    |     ![3D Preview Modal Cool](./public/media/github/3dpreviewmodal-cool.JPG) |\n|                              **Category Bar**                             |                          **Checkout Page**                           |                  \n|            ![Category Bar](./public/media/github/categorybar.JPG)          |         ![Checkout Page](./public/media/github/checkoutpage.JPG)          |\n|                              **Contact Page**                             |                          **Merchant Page**                           |                  \n|            ![Contact Page](./public/media/github/contactpage.JPG)          |         ![Merchant Page](./public/media/github/merchantpage.JPG)          |\n\n\n## Technologies Used\n\n### Front-End\n\n- **Project Setup**\n  - **Vite**\n  - **React**\n  - **Typescript**\n- **3D Tools**\n  - **Three.js**\n  - **React Three Fiber**\n  - **React Three Drei**\n- **React Tools**\n  - **React Router**\n  - **React Icons**\n  - **React Intersection Observer**\n- **Chakra UI**\n- **Tailwind CSS**\n- **Snipcart API**\n\n### Back-End\n- **Node.js**\n- **Express.js**\n- **MongoDB + Mongoose:**\n  \u003c/br\u003e\n  For database management\n- **Cloudinary API:**\n  \u003c/br\u003e\n  For image cloud \u0026 3d model management\n\n### Tools and Dependencies\n\n- **Ngrok**\n- **Crypto.js**\n- **dotenv**\n\n## Challenges Faced\n\n### Cloudinary problems\n\n- **Implementing uploading 3D model:**\n  \u003c/br\u003e\n  I couldn't upload 3D model at first so I have to check with the snipcart team what went wrong.\n- **Implementing snipcart with backend to record order id:**\n  \u003c/br\u003e\n  I had a hard time trying to respond back to snipcart.\n\n### Snipcart problems\n\n- **Implementing Snipcart webhooks:**\n  \u003c/br\u003e\n  I had a hard time to understand how to use webhook for the first time, but I managed to pull through after reading the document properly.\n- **Implementing snipcart with backend to record order id :**\n  \u003c/br\u003e\n  I had a hard time trying to response back to snipcart.\n\n## Next Steps\n\n### Planned Future Enhancements\n\n- **Website Responsiveness \u0026 Compatibility:**\n  \u003c/br\u003e\n  Implement responsive design and ensure compatibility across all device sizes.\n- *More product suggestions:**\n  \u003c/br\u003e\n  Implement related products, new products, on-sale products.\n- **Product Reviews:**\n  \u003c/br\u003e\n  Enable users to leave reviews and ratings for products.\n- **Wishlist:**\n  \u003c/br\u003e\n  Add a wishlist feature for users to save products they are interested in.\n- **Social Media Sharing:**\n  \u003c/br\u003e\n  Integrate with social media platform sharing like Whatsapp, Facebook, etc.\n- **User account management:**\n  \u003c/br\u003e\n  Manage user accounts so that I can control who has access to certain features.\n- **Discount system:**\n  \u003c/br\u003e\n  I want user to able to apply discount code to their cart.\n- **Newsletter system:**\n  \u003c/br\u003e\n  I want user to sign up for newsletter so that can stay updated on new products \u0026 promotions.\n\nFor more details and updates, stay tuned to the repository and the project board.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjipconan%2Fjippyhome-3d-e-commerce","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjipconan%2Fjippyhome-3d-e-commerce","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjipconan%2Fjippyhome-3d-e-commerce/lists"}