Project Food Kiosk



Description
Food Kiosk is a complete application for restaurant and bar order management. It was my first project working with Next.js, exploring SSR rendering, Server Actions, and the combination of CSR + SSR across different sections of the system.
The app includes an admin dashboard to add, edit, delete, and manage products, as well as handle orders in real time. Each order can be marked as completed, and customers see it on a public screen that shows when their order is ready for pickup.
It features a product gallery with pagination, instant search, and a fully built interface using TailwindCSS. The entire codebase is in TypeScript with validations via Zod and a data model built with Prisma connected to PostgreSQL.
All sections of the project are designed as reusable components, with a clear structure and order. It was a key experience for understanding how to configure and deploy Next.js with real databases and strict end-to-end typing.
Learnings and technical features:
- First use of Next.js, understanding the flow of Server Components, SSR, and Server Actions.
- Integration of Prisma with PostgreSQL and full configuration (schemas, migrations, seeds).
- Strict form and data validation using Zod + TypeScript.
- Implementation of pagination and search in server-side queries.
- Building an admin dashboard with full control over products and order status management.
- Creation of a public screen updating orders in real time.
- Modular design and reusable components prioritizing scalability and maintainability.
- Deep understanding of how to combine SSR and CSR in the same rendering flow.
- Configuration, deployment, and best practices for Next.js in production environments.
Technologies
- Next.js
- TypeScript
- Tailwind CSS
- Zod
- React
- Prisma
- PostgreSQL