🥬

Grocio

Smart Grocery List — Create · Calculate · Export · Share

---

The Dopest Grocery List App. Period.

Grocio is a stupidly fast, all-local grocery list app built with Next.js 16.
No sign-up. No cloud. No BS. Just you, your list, and instant auto-calculations.

Tap, type, buy. That's it.

---

What Makes It Sexy

🧮 Auto-Calculator	Qty × Price = Total — updates as you type. No buttons.
🛒 Shopping Mode	Category-grouped, tap-to-buy, with a live budget bar.
📄 PDF Export	Professional A4 with jspdf-autotable. One tap.
📊 Excel Export	.xlsx via SheetJS. Spreadsheet-ready.
🔗 Share Link	Encoded URL — send your list via WhatsApp in one click.
🌙 Dark Mode	Silky smooth glassmorphism, both light & dark.
✅ Buy Tracking	Check an item → vibration + sound + browser notification.
📌 Pin & Favorites	Pin lists, favourite frequently-bought items.
📥 Import by Text	Paste 1kg rice, 2L milk → parsed instantly.
🔍 Search	Across lists and within items.

---

One-Minute Workflow

1. Tap "+ Create New List"
2. Tap "+ Add Item"
3. Type name, qty, unit, price
4. Watch totals magically calculate
5. Check items as you shop
6. Export PDF/Excel/Text or share link

That's it. No login. No loading. No bullshit.

---

Tech Stack

Frontend   →  Next.js 16 (App Router) + React 19
Styling    →  Tailwind CSS 4.3 + frosted glass aesthetics
PDF        →  jsPDF + jspdf-autotable
Excel      →  SheetJS (xlsx)
Storage    →  localStorage (all data stays on YOUR device)
Dark Mode  →  Toggle persists across sessions

What We DON'T Use

• ❌ No authentication
• ❌ No database
• ❌ No backend
• ❌ No external APIs
• ❌ No TypeScript
• ❌ No AI hype
• ❌ No tracking

---

Get Started in 10 Seconds

git clone https://github.com/ayushnandi718-dev/Grocio.git
cd grocio
npm install
npm run dev

Open http://localhost:3000 and you're live.

Production

npm run build
npm start

---

Project in a Nutshell

grocio/
├── app/
│   ├── globals.css           # Glassmorphism + gradients
│   ├── layout.js             # Root layout
│   ├── page.js               # Home — lists, templates, cross-list view
│   └── list/[id]/page.js     # Editor — items, shop mode, export
├── components/
│   ├── Toast.js              # Toast notifications
│   ├── ConfirmModal.js       # Confirm dialogs
│   └── ShareModal.js         # Share link modal
├── utils/
│   ├── storage.js            # localStorage CRUD + URL encoding
│   ├── export.js             # PDF, Excel, text
│   ├── categories.js         # 500+ keyword category engine
│   └── notification.js       # Sound + vibration + push
├── package.json
├── next.config.mjs
└── README.md

---

Design Vibes

• Animated Liquid Gradient — subtle shifting pastel backgrounds
• Frosted Glass — backdrop-filter: blur() on every card
• Mobile-First — built for one-handed use on Android
• Dark Mode — persists in localStorage, rich dark palette
• Responsive — phones (max-w-lg) to desktops (max-w-3xl)

---

Privacy

100% local. Zero compromise.
Your data stays in localStorage. No servers, no cookies, no tracking, no analytics.
Your grocery list is yours — period.

The only time data leaves your device is when you explicitly share a link.

---

Browser Support

Browser	Works?
Chrome	✅ Full support
Firefox	✅ Full support
Safari	✅ Full support
Edge	✅ Full support
Samsung Internet	✅ Full support
Android WebView	✅ Full support

Vibration needs a physical device. Sound uses Web Audio API. Notifications need your permission.

---

Contribute

Fork. Branch. Commit. PR. Simple.

git checkout -b feature/your-idea
git commit -m "feat: add your idea"
git push origin feature/your-idea

---

License

MIT — go nuts. Use it, fork it, ship it.

---

Made with ❤️ and zero cloud dependencies.

No AI. No backend. Just groceries.