{"id":20415299,"url":"https://github.com/jeffascript/digital-product-mgt-interface-python-react","last_synced_at":"2026-04-11T09:34:51.884Z","repository":{"id":245805561,"uuid":"817147606","full_name":"jeffascript/digital-product-mgt-interface-python-react","owner":"jeffascript","description":"This repository contains the source code for the Digital Product Management Interface, a software application designed to help users organize and manage products electronically.","archived":false,"fork":false,"pushed_at":"2024-06-24T08:11:43.000Z","size":255,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-01-15T13:42:01.471Z","etag":null,"topics":["django","python","react"],"latest_commit_sha":null,"homepage":"","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/jeffascript.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-06-19T05:56:22.000Z","updated_at":"2024-07-29T02:45:42.000Z","dependencies_parsed_at":null,"dependency_job_id":"d43ab065-6ac7-473f-9595-11c4e2598eeb","html_url":"https://github.com/jeffascript/digital-product-mgt-interface-python-react","commit_stats":null,"previous_names":["jeffascript/aiio-solution","jeffascript/digital-product-mgt-interface-python-react"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jeffascript%2Fdigital-product-mgt-interface-python-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jeffascript%2Fdigital-product-mgt-interface-python-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jeffascript%2Fdigital-product-mgt-interface-python-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jeffascript%2Fdigital-product-mgt-interface-python-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jeffascript","download_url":"https://codeload.github.com/jeffascript/digital-product-mgt-interface-python-react/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241960637,"owners_count":20049340,"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":["django","python","react"],"created_at":"2024-11-15T06:15:04.988Z","updated_at":"2026-04-11T09:34:46.862Z","avatar_url":"https://github.com/jeffascript.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":" \n## 📋 Functional Requirement (acceptable criteria)\n\n\n- [x] Finishing the UI functionalities including adding new subProducts\n- [x] Neat project structure.\n- [x] Proper State management.  (**Context API ** for state management).\n- [x]  Data using **fetch** or axios instead of using the static data from json.\n- [x] Create API endpoints to fetch products, subcategories and sub products needed to show in the frontend part.\n- [x] Create an API endpoint to add a new sub product.(Not needed for products and subcategories)\n- [x] Create an endpoint to save the selected as shown in the save modal in the front end screen. This can be a separate table in the backend\n\n\n## 🎥  Demo\n\n\nhttps://www.loom.com/share/83988d64b9a14a80a83bd533a15990ca?sid=f03a79d5-cd04-446a-8ed9-7627e09af754\n\n## ✍️ Description\n\n- **Codebase Refactor**: The codebase was  organised under clear structures following modern standards. **Compound Component Pattern** was used for the React App.** Debouncing** \u0026 **Optmisitic UI updates** were also utilized for performance gains.\n\n- **Unit Test**:  `Jest`  and  `react-testing-library` was used to assert calls \u0026 values, as well as to mock the dependencies.   major functionalities  were unit-tested, but there was no time to include integration test 😀\n\n- **Docker**: The app was containerized with `Dockerfile` and [`Docker-Compose`](https://docs.docker.com/compose/install/). \n\n- **Migration/Seeding**: The vehicle table was seeded. And the appropriate endpoints to retrieve data was added\n\n- **Endpoints  **:  \n\n\n  \t\tGet all Products: {{apiUrlrl}}/api/v1/products\n  \n\t\tGet all Subcategories: {{apiUrlrl}}/api/v1/subcategories\n  \n\t\tGet all /POST subproducts: {{apiUrlrl}}/api/v1/subproducts\n  \n\t\tPOST save Done Data: {{apiUrlrl}}/api/v1/save`\n\n- **Styling**:  \n\tStyled with BEM methodology  and style scoped as css modules. No UI Library used whatsoever.\n\n\n## ⚙️ Config changes / Packages\n\n- Eslint\n- Prettier\n- Makefile \u0026 Bash for cmds\n\t*... mostly dev pkgs*\n- Node v.18xx (you can easily throttle node versions with nvm installed in your PC)\n\n## 🧐 How To Start the App (Docker)\n\n- [ ] `make docker-build` to build the api \u0026 db\n- [ ] ` make docker-seed` to seed the db with initial data\n- [ ] `make docker-start `\n- [ ] `make start-dev`\n\n## 🧐 How To Test the App (Docker)\n- [ ] `make test-client-docker` to test the React app in Docker\n- [ ] `make test-api-docker` to test the Django app in Docker \n\t\t\tor ssh into the container \u0026 run the local command below\n\n## 🧐 How To Test the App in Locally\n\n- [ ] `make test-client-local` to test react\n- [ ] `make test-api-local `to for django app\n- [ ] to stop: `make docker-stop`\n\n\nonce these steps are done: \n\n   - React app: http://localhost:3000\n   - Django BE endpoint: http://localhost:8000/api/v1/{{variant}}\n\n\n## 🛠️ Things to Improve with longer time allotment: \n- Document API spec with Postman collection / Swagger etc..\n- Metrics \u0026 Monitoring\n- Cover more test cases\n- \n\nWhat are your thoughts on the **Eager Loading** strategy utilized in this implementation against _Lazy Loading_ ?\n\nHappy Coding! 👋🏽\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjeffascript%2Fdigital-product-mgt-interface-python-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjeffascript%2Fdigital-product-mgt-interface-python-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjeffascript%2Fdigital-product-mgt-interface-python-react/lists"}