Funky Point of Sale is a dummy Point of Sale (POS) application built using Next.js 15+ and React 19, developed as part of my learning journey through Jonas Schmedtmann’s Ultimate React Course. This project is a work in progress and is intended to demonstrate practical application of modern frontend development concepts in a real-world scenario.
Project purpose and goals
The main goal of this project is to apply and reinforce the React and Next.js concepts covered in the course by building a practical, real-world-inspired application. I wanted to go beyond passive learning and actually build something functional, while experimenting with the latest React features like Server Components and the Next.js App Router. The long-term purpose is to create a clean, well-structured project that demonstrates my ability to build interactive UIs, manage application state, and follow modern frontend architecture practices.
Overview
Currently, the app allows users to browse a list of products, add them to a cart, proceed through a simple checkout flow, and view the list of created orders. The UI is minimal for now, but the core logic is already functioning.
The backend is powered by Supabase, which handles data storage and real-time updates, making it easy to manage orders and product information without setting up a custom backend.
Future development will include a more polished and responsive user interface, improved state management (possibly using Redux), authentication and role-based access, a product management dashboard, and an enhanced checkout process. I’m also planning to introduce automated tests to ensure the application scales well as it grows.
Ultimately, this project is intended to evolve into a full-featured POS simulation, while remaining clean and well-organized from a code perspective.
Problems and thought process
One of the challenges in the early stages was balancing the urge to add features with the need to keep the codebase manageable and well-structured. Since this is a learning project, I made a conscious effort to prioritize understanding over rushing to build out every functionality. For example, when choosing between global state libraries, I took time to experiment with built-in React state and context before deciding whether to bring in an external solution.
Styling was another area where I had to think strategically. I opted for Sass with CSS Modules because it gives me enough control over styles without adding unnecessary complexity. The thought process behind every choice—from routing structure to component organization—was guided by scalability and maintainability. I’m approaching the project iteratively, learning from each step and building in a way that allows me to easily extend and improve it over time.