How romanbr87/shoppinglist works
ShoppingList is a browser-based shopping-list website. Users can start from the home page and open the list manager to add items individually or in bulk, edit and reorder them, and import, export, or merge JSON lists. The manager owns list state and coordinates the table, modal, and list utilities. The shared app shell supplies navigation and the About modal. The README is minimal; additional capabilities are documented in the home and About components. No persistent storage implementation is established by the excerpts.
Main entry points: ShoppingListPage.jsx List manager · ShoppingListTable.jsx Shopping list table · _app.js App shell · index.jsx Home page
Components 13
Entry and shell
- Home page
src/pages/index.jsx - App shell
src/pages/_app.js - Navigation header
src/components/Header.jsx - About modal
src/components/AboutModal.jsx - Footer
src/components/Footer.jsx
List management
- List manager
src/pages/ShoppingListPage.jsx - Bulk add modal
src/components/ManualEditModal.jsx
Item interaction
- Shopping list table
src/components/ShoppingListTable.jsx - Add item form
src/components/AddItemForm.jsx - Item rows
src/components/TableBody.jsx
List logic
- List utilities
src/utils/listUtils.js
Other components
- Website user
- Local JSON files
Connections 13
- Website user → Home page: opens
src/pages/index.jsx - Home page → List manager: links to
src/pages/index.jsx - App shell → Navigation header: renders
src/pages/_app.js - App shell → Footer: renders
src/pages/_app.js - Navigation header → About modal: renders
src/components/Header.jsx - Website user → List manager: uses
src/pages/ShoppingListPage.jsx - List manager → Shopping list table: renders
src/pages/ShoppingListPage.jsx - List manager → Bulk add modal: renders
src/pages/ShoppingListPage.jsx - List manager → List utilities: calls
src/pages/ShoppingListPage.jsx - Shopping list table → Add item form: renders
src/components/ShoppingListTable.jsx - Shopping list table → Item rows: renders
src/components/ShoppingListTable.jsx - List manager → Local JSON files: imports and exports
src/pages/ShoppingListPage.jsx - List manager → List utilities: merges lists
src/pages/ShoppingListPage.jsx