<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[VishalBuilds]]></title><description><![CDATA[VishalBuilds]]></description><link>https://vishalbuild.hashnode.dev</link><image><url>https://cdn.hashnode.com/res/hashnode/image/upload/v1593680282896/kNC7E8IR4.png</url><title>VishalBuilds</title><link>https://vishalbuild.hashnode.dev</link></image><generator>RSS for Node</generator><lastBuildDate>Wed, 09 Sep 2026 02:15:25 GMT</lastBuildDate><atom:link href="https://vishalbuild.hashnode.dev/rss.xml" rel="self" type="application/rss+xml"/><language><![CDATA[en]]></language><ttl>60</ttl><item><title><![CDATA[How I Built a Full-Stack FMCG Management App with TypeScript and Prisma]]></title><description><![CDATA[Introduction
My father owns an FMCG (Fast Moving Consumer Goods) distribution unit. From childhood, I have seen the hardships he faces in managing his business. Since 8th grade, I have been actively t]]></description><link>https://vishalbuild.hashnode.dev/how-i-built-a-full-stack-fmcg-management-app-with-typescript-and-prisma</link><guid isPermaLink="true">https://vishalbuild.hashnode.dev/how-i-built-a-full-stack-fmcg-management-app-with-typescript-and-prisma</guid><category><![CDATA[Flutter]]></category><category><![CDATA[TypeScript]]></category><category><![CDATA[prisma]]></category><category><![CDATA[webdev]]></category><category><![CDATA[Beginner Developers]]></category><category><![CDATA[Programming Blogs]]></category><category><![CDATA[software development]]></category><dc:creator><![CDATA[S.Vishal]]></dc:creator><pubDate>Wed, 24 Jun 2026 07:08:08 GMT</pubDate><enclosure url="https://cdn.hashnode.com/uploads/covers/6a3ac67db650842195d8c3f9/950424d6-a822-4d89-a52f-525b601c3462.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p><strong>Introduction</strong></p>
<p>My father owns an FMCG (Fast Moving Consumer Goods) distribution unit. From childhood, I have seen the hardships he faces in managing his business. Since 8th grade, I have been actively travelling along with the business, which gave me real field knowledge about how a distribution unit actually operates, the chaos, the paperwork, the lack of visibility.</p>
<p>So when my college course "Design Thinking and Innovation" challenged us to come up with innovative solutions to real-life problems, I didn't have to think twice. I built a platform to solve my father's problems.</p>
<p>FMCG Distribution Unit Management System is a full-stack web and mobile application built for small to medium level business owners to manage their business end-to-end. It helps owners manage their product data, employee records, and customer information all in one place. Think of it as a lightweight CRM built specifically for distribution businesses.</p>
<p><strong>From Problem to Solution: The Design Thinking Journey</strong></p>
<p>Most developers jump straight into code. Design Thinking forced me to slow down and actually understand the problem before touching a single line of code. Here's how that process shaped this project.</p>
<p><strong>Empathize</strong><br />I didn't have to go far for this step, the problem was right at home. I spent time observing my father's daily routine, watching how he tracked orders on paper, managed employee schedules manually, and had no real visibility into how the business was performing. I asked questions I had never thought to ask despite travelling with the business since 8th grade.</p>
<p><strong>Define</strong><br />After gathering observations, the core problem became clear, there was no single place to see everything. Products, customers, employees and orders all lived in different places, mostly paper and memory.</p>
<p><strong>Ideate</strong><br />I explored multiple solutions, a simple spreadsheet system, a WhatsApp-based tracker, before settling on a proper web and mobile platform. The deciding factor was scalability and ease of use for non-technical users like my father.</p>
<p><strong>Prototype</strong><br />Before writing any code, I built wireframes in Figma. This saved hours of development time by catching design issues early.</p>
<p><strong>Test and Loop</strong><br />The app went through multiple iterations based on real feedback from the business context it was built for.</p>
<p><strong>Tech Stack: Why I Chose What I Chose</strong></p>
<p>Every project starts with a set of decisions that shape everything that follows. Here's why I picked this particular stack.</p>
<p><strong>TypeScript</strong> was suggested to me for the web layer, and honestly it turned out to be a great choice. The strict typing caught a lot of bugs early during development that would have been painful to debug later. Coming from a Java background, the structure felt natural.</p>
<p><strong>Flutter</strong> was my choice for the mobile app. Building a native-feeling mobile app from scratch would have taken significantly longer with other approaches. Flutter let me move fast and still deliver a polished UI, which mattered since the end user was going to be my father, not a developer.</p>
<p><strong>Prisma ORM</strong> was the standout decision. Given the volume of data a distribution unit handles, including products, orders, customers and employees, I needed something that could handle relationships cleanly without writing raw SQL for every query. Prisma made database operations faster to write and easier to maintain.</p>
<p>All three connected through a shared backend, keeping the architecture clean and consistent across web and mobile.</p>
<p><strong>Architecture</strong></p>
<p>The application follows a classic layered architecture with three distinct layers working together seamlessly.</p>
<p><strong>Presentation Layer</strong><br />This is what the user sees and interacts with. The platform has two frontends, a TypeScript web app for desktop access and a Flutter mobile app for on-the-go management. Both connect to the same backend, ensuring data consistency across devices.</p>
<p><strong>Business Logic Layer</strong><br />This is the brain of the application. Every operation, creating an order, assigning an employee, updating product stock, passes through this layer. It handles all validations, role-based access control, and business rules before anything touches the database.</p>
<p><strong>Database Layer</strong><br />MySQL serves as the database, accessed entirely through Prisma ORM. Rather than writing raw SQL for every operation, Prisma allowed me to define clean data models and handle complex relationships between products, orders, customers and employees in a maintainable way.</p>
<p><strong>How They Talk To Each Other</strong><br />The Flutter and TypeScript frontends communicate with the business logic layer through REST APIs. The business logic layer then talks to the database through Prisma. Clean, simple, and easy to scale.</p>
<p><strong>Challenges I Faced</strong></p>
<p>No project goes smoothly. Here are the three biggest walls I hit and how I broke through them.</p>
<p><strong>Real-Time Order Tracking</strong><br />Real-time visibility was one of the core features of the platform. I implemented this through constant API calls to the database, ensuring the data stays updated without the user needing to refresh manually. The hardest part wasn't the concept, it was configuring the API calls correctly so they were frequent enough to feel real-time but not so aggressive that they hammered the database unnecessarily. Getting that balance right took several iterations.</p>
<p><strong>Vercel Deployment</strong><br />After pushing commits, the app simply wasn't moving to production. New changes weren't being reflected in the live environment despite successful pushes to the repository. After spending time trying to debug the deployment pipeline, I made the decision to start fresh and that solved it. Sometimes the cleanest fix is just starting over rather than chasing a ghost.</p>
<p><strong>The Dynamic Collection Entry Bug</strong><br />This was the most complex bug I faced. The platform has a smart collection system. If a customer has two bills, say ₹1,000 and ₹2,000, and an employee enters a payment of ₹3,000, the system automatically clears the lowest bill first and subtracts the remaining amount from the next one. The bug was that bills cleared automatically by the system weren't being removed from the list, they just stayed there, confusing the data. Took significant debugging and outside help to trace the root cause and fix it properly.</p>
<p><strong>What I Learned</strong></p>
<p>Building this project was more than just writing code. It fundamentally changed how I think about software development.</p>
<p><strong>Design Thinking is not just a framework, it is a mindset.</strong> Going through the empathize, define, ideate, prototype and test cycle taught me that understanding the problem deeply is more valuable than jumping to solutions quickly. I carry this thinking into every project now.</p>
<p><strong>Building for a real user is completely different from building for a grade.</strong> My father was going to actually use this. That pressure made me think about usability, clarity and reliability in ways a typical college project never would have.</p>
<p><strong>Software construction has structure.</strong> This project introduced me to real software engineering metrics and techniques that go beyond what textbooks teach. Layered architecture, API design, ORM patterns, these became real concepts rather than theoretical ones.</p>
<p><strong>User feedback is not optional.</strong> Every iteration of the product came from observing real usage and making improvements based on that. That loop of build, observe and improve is something I now consider a core part of development.</p>
<p>This project started as a college assignment. It ended as something my father actually uses to run his business. That is the best outcome I could have asked for.</p>
<img src="https://cdn.hashnode.com/uploads/covers/6a3ac67db650842195d8c3f9/452ab36e-3d9f-4ae7-bd3f-8a70af83608f.png" alt="" style="display:block;margin:0 auto" />]]></content:encoded></item></channel></rss>