Shoppingify App

Shopping list management with purchase stats.

TODO

• Add E2E testing
• Upgrade to Next.js v13
• Upgrade to Prisma v4
• handle token expiry
• handle tab synchronisation
• show confirm access for sensitive info change
• add product home page
• make app more interactive
• provide functionality to pick/fork from existing lists

Tech stack

• cookie
• jsonwebtoken
• jest for testing
• material-ui
• Next.js (batteries(bundling, router, image optimizations etc) included)
• Prisma ORM
• planetscale(mysql) free iter
• recharts
• styled-jsx (for css)
• Typescript
• ts-node (run ts files)
• zustand (state management , first time user)

Setup

1. Node.js v16.15.0 or higher for Next.js v13. (Prisma need Node.js v14.17.0 or higher)

2. For styled-jsx: Install VScode extension

3. Add relevant .env variables using .env.example template

4. Database: This project uses mysql db(see prisma schema). Follow mysql docs to install. If you want to switch database, check Prisma Provider switch docs.

5. Run prisma migrations: run npx prisma migrate dev. For more info check Prisma migrate.

Credits

1. open source
2. Thanks to @thunghiemdinh for design and checkout devchallenges.