{"id":20676975,"url":"https://github.com/karamanburak/smart-stock","last_synced_at":"2025-09-13T22:11:26.782Z","repository":{"id":233280268,"uuid":"786432471","full_name":"karamanburak/smart-stock","owner":"karamanburak","description":"📦 This comprehensive reacts project aims to create a stock store application. The user can register to the store, log in, add the desired product to their inventory, buy or sell it, and keep track of the most current status of it instantly from the dashboard.","archived":false,"fork":false,"pushed_at":"2024-05-01T19:26:46.000Z","size":4285,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-10T18:54:26.393Z","etag":null,"topics":["axios-instance","formik-yup","mui","react-redux","redux-persist","toastify"],"latest_commit_sha":null,"homepage":"https://smartstock-management.vercel.app/","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/karamanburak.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}},"created_at":"2024-04-14T12:57:45.000Z","updated_at":"2024-08-09T16:33:49.000Z","dependencies_parsed_at":"2024-05-01T20:53:40.968Z","dependency_job_id":"5315494d-fd05-4ca7-b49c-6b3c4e493ebf","html_url":"https://github.com/karamanburak/smart-stock","commit_stats":null,"previous_names":["karamanburak/stock-app","karamanburak/smart-stock"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/karamanburak/smart-stock","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/karamanburak%2Fsmart-stock","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/karamanburak%2Fsmart-stock/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/karamanburak%2Fsmart-stock/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/karamanburak%2Fsmart-stock/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/karamanburak","download_url":"https://codeload.github.com/karamanburak/smart-stock/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/karamanburak%2Fsmart-stock/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":275033785,"owners_count":25393929,"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-09-13T02:00:10.085Z","response_time":70,"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-instance","formik-yup","mui","react-redux","redux-persist","toastify"],"created_at":"2024-11-16T21:14:09.482Z","updated_at":"2025-09-13T22:11:26.758Z","avatar_url":"https://github.com/karamanburak.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# stock-management-app\n\n [SmartStock Live](https://smartstock-management.vercel.app/)\n\n## Description\n📦 This comprehensive reacts project aims to create a stock store application. The user can register to the store, log in, add the desired product to their inventory, buy or sell it, and keep track of the most current status of it instantly from the dashboard. The user can choose to use the application in dark mode or light mode. \n\n\n## Project Skeleton\n\n```\n- SmartStock Management App (folder)\n|\n|\nSOLUTION\n├── public\n|    ├── assets\n├── src\n|    ├── apiCall\n|    │   └── apiCall.js\n|    ├── app\n|    │   └── store.jsx\n|    ├── assets\n|    ├── components\n|    ├── app\n|    │   └── store.jsx\n|    ├── assets\n|    │   └── [images]\n|    ├── components\n|    │   ├── Cards\n|    │   │   ├── BrandCard.jsx\n|    │   │   └── FirmCard.jsx\n|    │   ├── Commons\n|    │   │   ├── AuthHeader.jsx\n|    │   │   ├── AuthImage.jsx\n|    │   │   ├── DataTable.jsx\n|    │   │   ├── MyButton.jsx\n|    │   │   ├── MyTextfield.jsx\n|    │   │   ├── PageHeader.jsx\n|    │   │   ├── SelectControl.jsx\n|    │   │   └── StockModal.jsx\n|    │   ├── Dashboard\n|    │   │   ├── Charts.jsx\n|    │   │   └── KpiCards.jsx\n|    │   ├── Forms\n|    │   │   ├── BrandForm.jsx\n|    │   │   ├── FirmForm.jsx\n|    │   │   ├── LoginForm.jsx\n|    │   │   ├── ProductForm.jsx\n|    │   │   ├── PurchaseForm.jsx\n|    │   │   ├── RegisterForm.jsx\n|    │   │   └── SaleForm.jsx\n|    │   ├── Modals\n|    │   │   ├── BrandModal.jsx\n|    │   │   ├── FirmModal.jsx\n|    │   │   ├── ProductModal.jsx\n|    │   │   ├── PurchaseModal.jsx\n|    │   │   └── SaleModal.jsx\n|    │   ├── Navigatons\n|    │   │   ├── MenuListItems.jsx\n|    │   │   └── WeatherCard.jsx\n|    │   ├── Start\n|    │   │   ├── Footer.jsx\n|    │   │   └── StartNavbar.jsx\n|    │   ├── Tables\n|    │   │   ├── ProductTable.jsx\n|    │   │   ├── PurchaseTable.jsx\n|    │   │   └── SaleTable.jsx\n|    ├── features\n|    │   ├── authSlice.jsx\n|    │   └── stockSlice.jsx\n|    ├── helper\n|    │   ├── FormFields.js\n|    │   └── ToastNotify.jsj\n|    ├── hooks\n|    │   ├── useAuthCall.jsx\n|    │   ├── useAxios.jsx\n|    │   └── useStockCalls.jsx\n|    ├── pages\n|    │   ├── About.jsx\n|    │   ├── Brands.jsx\n|    │   ├── Dashboard.jsx\n|    │   ├── Firms.jsx\n|    │   ├── Home.jsx\n|    │   ├── Imprint.jsx\n|    │   ├── Login.jsx\n|    │   ├── Products.jsx\n|    │   ├── Purchases.jsx\n|    │   ├── Register.jsx\n|    │   ├── Sales.jsx\n|    │   └── StartPage.jsx\n|    ├── router\n|    |   ├── AppRouter.jsx\n|    |   └── PrivateRouter.jsx\n|    ├── styles\n|    │   ├── globalStyle.js\n|    |   └── theme.js\n|    ├── App.jsx\n|    ├── frontend.env\n|    ├── index.css\n|    └── main.jsx\n├── .gitignore\n├── index.html\n├── LICENSE\n├── package.json\n├── pnpm-lock-yaml\n├── postcss.config.js\n├── README.md\n├── tailwind.config.js\n├── vercel.json\n└── vite.config.js\n\n```\n\n## Outcome\n\n![SmartStock](https://github.com/karamanburak/stock-management-app/assets/150926922/d3e7ce1f-0638-423d-aca6-84c01f621ddd)\n\n### Installed Packages\n\n- MUI and MUI icons\n- axios\n- redux/redux toolkit\n- react-toastify\n- react-router-dom\n- mui x data grid\n\n\n# Redux Persist\n\n```\nimport { createStore } from 'redux';\nimport { persistReducer } from 'redux-persist';\nimport storage from 'redux-persist/lib/storage'; // defaults to localStorage \nfor web\n\nimport rootReducer from './reducers';\n\nconst persistConfig = {\n  key: 'root',\n  storage,\n};\n\nconst persistedReducer = persistReducer(persistConfig, rootReducer);\n\nconst store = createStore(persistedReducer);\n\n```\n\n1. Use the `persistStore` function to create `persistor`;\n\n```\nimport { persistStore } from 'redux-persist';\n\nconst persistor = persistStore(store);\n\n```\n\n```jsx\nimport { PersistGate } from \"redux-persist/integration/react\";\nimport store, { persistor } from \"./app/store\";\n// ... normal setup, create store and persistor, import components etc.\n\nconst App = () =\u003e {\n  return (\n    \u003cProvider store={store}\u003e\n      \u003cPersistGate loading={null} persistor={persistor}\u003e\n        \u003cRootComponent /\u003e\n      \u003c/PersistGate\u003e\n    \u003c/Provider\u003e\n  );\n};\n```\n## Router Structure \n\n```jsx\n\u003cRouter\u003e\n  \u003cRoutes\u003e\n    \u003cRoute path=\"/\" element={\u003cStartPage /\u003e} /\u003e\n    \u003cRoute path=\"/login\" element={\u003cLogin /\u003e} /\u003e\n    \u003cRoute path=\"/register\" element={\u003cRegister /\u003e} /\u003e\n    \u003cRoute path=\"/about\" element={\u003cAbout /\u003e} /\u003e\n    \u003cRoute path=\"/imprint\" element={\u003cImprint /\u003e} /\u003e\n    \u003cRoute path=\"/stock\" element={\u003cPrivateRouter /\u003e}\u003e\n      \u003cRoute path=\"\" element={\u003cDashboard /\u003e}\u003e\n        \u003cRoute index element={\u003cHome /\u003e} /\u003e\n        \u003cRoute path=\"/stock/purchases\" element={\u003cPurchases /\u003e} /\u003e\n        \u003cRoute path=\"/stock/sales\" element={\u003cSales /\u003e} /\u003e\n        \u003cRoute path=\"/stock/products\" element={\u003cProducts /\u003e} /\u003e\n        \u003cRoute path=\"/stock/firms\" element={\u003cFirms /\u003e} /\u003e\n        \u003cRoute path=\"/stock/brands\" element={\u003cBrands /\u003e} /\u003e\n      \u003c/Route\u003e\n    \u003c/Route\u003e\n  \u003c/Routes\u003e\n\u003c/Router\u003e\n```\n\n\n## Axios Instance ve Interceptors\n\n\n```\nimport axios from 'axios';\n\nconst instance = axios.create({\n  baseURL: '\u003chttps://example.com/api\u003e',\n  headers: {'Authorization': `Token ${token}`}\n});\n\n```\n\n## Postman Documentation\n\n[View Postman Documentation](https://documenter.getpostman.com/view/32987022/2sA3BuXVAD)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkaramanburak%2Fsmart-stock","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkaramanburak%2Fsmart-stock","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkaramanburak%2Fsmart-stock/lists"}