Featured image of post Farmbyte OMS - Modern Order Management System

Farmbyte OMS - Modern Order Management System

Building Farmbyte's Order Management System !

Context and Project Overview

When I joined the team, the OMS (Order Management System) is my first ever project to contribute and the only web project we have and it was… let’s just say it had potential emoji

It was functional, sure, but looking at it.. I could see SO much room for improvement.

So Farmbyte Order Management System (OMS) represents a significant leap forward in agricultural supply chain management technology. Where basically it’s built from the ground up with modern web technologies, this comprehensive platform streamlines the entire order lifecycle from procurement to delivery, serving as a critical backbone for Farmbyte’s operations.

The Challenge

Agricultural supply chains are inherently complex, involving multiple stakeholders, perishable goods, and time-sensitive operations. The challenge was to create a system that could handle:

  • Real-time inventory management across multiple hubs and locations
  • Complex pricing models for upstream suppliers with dynamic rates
  • Multi-role user management with granular permissions across different business units
  • Financial tracking and reporting for comprehensive business insights
  • Logistics coordination from procurement to final delivery
  • Quality grading workflows for agricultural products

Thus I believe they started this.

Looking at the side with my POV, there are tons of challenges of course. I looked at the existing codebase foundation, here are some needed addressing:

  • Next.js 14.2.4 but everything was written in plain JavaScript (not even JSX properly implemented)
  • NextUI components everywhere (nothing wrong with NextUI, but we needed something more customizable for our design system)
  • Basic auth setup that did the job but wasn’t scalable for our growing user base
  • Initially there is zero testing infrastructure
  • No component documentation system
  • Git commit’s that were… well, you know how its super vague and messy

Project Evolution & Leadership Impact

When I joined the team and took the challenge as a leadership role (I am scared but I just do it scared lol), the Farmbyte OMS was a basic Next.js application with minimal tooling and infrastructure. Once I got comfortable and my tech lead started trusting my judgment, I knew we could do better.

Before: The Foundation (Before I Joined)

The initial codebase was built with essential technologies but lacked the sophistication needed for a production-grade system:

Basic Tech Stack:

  • Next.js 14.2.4 with React 18
  • NextUI for pre-built components
  • Tailwind CSS 3.4.1 for styling
  • Basic authentication with NextAuth
  • Minimal development tooling (only basic linting)
  • No testing infrastructure
  • No component documentation system
  • No automated code quality enforcement
  • JSX wasn’t being implemented just pure JS

Limited Development Workflow:

1
2
3
4
5
6
7
8
{
  "scripts": {
    "dev": "next dev",
    "build": "next build", 
    "start": "next start",
    "lint": "next lint"
  }
}

After: The Transformation

Under my care, we implemented a comprehensive modernization strategy:

Modernized Core Technologies:

  • Upgraded to Next.js 15: Okay, this one has a story. So I’m doom scrolling Twitter (idc still call birdie not X) during Raya holidays when I see a tweet about a critical security vulnerability in Next.js middleware. Realizing our production app with user auth might have a security hole. What do you do? You don’t wait until after holidays, that’s for sure, quick text to my tech lead and discussed how to tackle it
  • Turbopack integration: I slided in the upgrade while fixed critical security AND got massive performance boost for 10x faster development builds haha
  • Migrated from NextUI to Radix UI: This was probably the fastest architectural decision I pushed for. NextUI is great for rapid prototyping, but we needed something more flexible for a production system that would scale. The migration took months, but seeing our design system become actually consistent across the entire app? Worth it! Packages slightly lesser too
  • Enhanced Tailwind CSS setup with utilities, v4 cuz why not?

Building A Proper Development Ecosystem

  • Comprehensive Testing Suite: Introduced Vitest and React Testing Library because honestly, I had too and we had ample time and I think it’s good practice for me to learn write test personally too
  • Storybook Implementation: This was my favorite addition tbh. Having isolated component development and living documentation? It completely changed how we approach UI development.
  • Automated Code Quality: ESLint, Prettier, Husky, and lint-staged for consistent code standards.

Key Improvements Implemented

1. Testing Culture Establishment

1
2
3
4
# New testing capabilities
npm run test           # Unit tests with Vitest
npm run test:ui        # Interactive test UI
npm run coverage       # Comprehensive coverage reports

2. Component Development Workflow

1
2
3
# Storybook for component development
npm run storybook      # Local component development
npm run build-storybook # Production component docs

3. Automated Quality Assurance

1
2
3
4
# Comprehensive code quality pipeline  
npm run lint:fix       # Automated code fixing
npm run format         # Consistent formatting
npm run fix-and-format # Combined workflow

4. Professional Git Workflow

  • Pre-commit hooks preventing bad code from entering the repository
  • Conventional commit messages for better project history
  • Automated formatting and linting on every commit

What We Actually Built

The application is structured around business domains, each with it’s own:

  • Components: Reusable UI elements specific to the domain
  • Hooks: Custom hooks for state management and side effects
  • Services: API client functions and business logic
  • Utils: Domain-specific utility functions

Key modules include:

  • Admin Management: User roles and permissions
  • Finance: Financial tracking and reporting
  • Logistics: Shipping and delivery coordination
  • Inbound: Inventory receiving workflows
  • Product Masterlist: Catalog management
  • Supplier Management: Vendor relationship management
  • Grading: Quality assessment workflows
  • Quotation: Pricing and proposal management

Results & Impact

The Farmbyte OMS has successfully:

  • Streamlined order processing workflows
  • Reduced manual data entry through automated systems
  • Improved inventory visibility across multiple locations
  • Enhanced supplier relationship management
  • Provided real-time financial insights
  • Scaled to support growing business operations

Impact of the Technical Modern Transformation

The modernization resulted in:

  • 10x faster development builds through Turbopack
  • Zero runtime errors through comprehensive testing
  • Consistent code quality across all team members
  • Scalable component architecture supporting rapid feature development
  • Professional deployment pipeline ensuring reliable releases
  • Enhanced security through proper secrets management

This evolution demonstrates how strategic technical leadership can transform a functional application into a production-ready, enterprise-grade system that serves as a foundation for sustained growth.

The Real Takeaway

This project taught me that being “average” doesn’t mean you can’t drive significant change. You just need to:

  • Think things through properly and COMMUNICATE especially if the team or yourself working remotely I cannot stress this enough haha
  • Back up suggestions with data and proven results
  • Find a team that trusts your process
  • Be willing to learn as you go

From someone who started by just wanting cleaner git commit’s to ending up modernizing an entire production system, sometimes you don’t know where your path will lead, but if you care about building quality stuff, opportunities will find you.

Anyway, this is probably one of my biggest project achievement so far. Still have SO much to learn, but seeing a system you helped architect actually serving real business needs? That hit’s different.

Before I wrap this up, I really want to thank my tech lead who trusted me with these big decisions, trusted me this role despite my experience, my seniors (across various engineering teams) who guided me through the learning process, and of course my entire team who embraced all these changes.

Also shoutout to everyone along the way who answered my probably-annoying questions about architecture, best practices, and

“is this the right way to do this?”

these peeps made this journey way less scary and way more fun.

Building production systems is definitely a team sport, and I’m grateful to be surrounded by people who care about building quality stuff together :)

Built with Hugo
Theme Stack designed by Jimmy