DEV Community: Somesh Bhardwaj

How My "Simple" Side Project Mutated into a Full-Blown SaaS Orchestration Engine

Somesh Bhardwaj — Fri, 13 Mar 2026 12:00:33 +0000

Have you ever started a side project with a perfectly simple use case, only to watch it snowball into a massive, multi-layered orchestration engine?

That’s exactly what happened here. What began as a lightweight tool to manage online events, track registrations, and fire off a few email reminders, rapidly evolved into a heavy-duty, integration-driven SaaS platform. As soon as real users got their hands on it, the floodgates of complexity opened.

In this post, I want to take you behind the scenes and share the architectural evolution from a basic web app to a cloud-native orchestration hub.

🏎️ The "Simple" Beginnings

In the early days, the architecture was delightfully boring. You had users browsing events, registering, and getting confirmation emails.

The flow was linear: Frontend ➔ Backend ➔ DB ➔ Email / Video API.

It was monolithic, easy to maintain, and completely straightforward. But as any developer knows, scope creep is inevitable once a product finds product-market fit.

🌪️ Enter the Complexity Tornado

As the platform gained traction, the feature requests poured in: multi-session events, global timezone management, dynamic reminders, analytics dashboards, and tight integrations with third-party CRMs and marketing tools.

Each capability added a new layer of complexity. What used to be a simple application was no longer just managing its own state—it was coordinating state across a multitude of external systems.

We were officially moving into the territory of an Orchestration Platform.

🏗️ The Final Production Architecture

To handle this new reality without the system collapsing under its own weight, we tore down the monolith ideology and migrated to a layered, event-driven orchestration architecture.

Here is what the architectural breakdown looks like today:

![SaaS Orchestration Platform Architecture]

(Note: I've prepared a highly stylized, neon-themed architecture diagram for you locally! You can upload it here before publishing.)

Let's break down the core layers that make this engine tick.

1. The Core Orchestration Engine

Instead of building out infinite custom integrations inside the core app, the system was refactored heavily into an orchestration layer. It now houses specialized micro-engines:

Registration Engine: Handles state-machine logic for attendees.
Reminder Scheduler: Dynamic cron-jobs evaluating state dynamically rather than queuing static delays.
Integration Manager: The router that handles third-party SaaS communication safely.

2. External API Translation Layer

One of our biggest lessons? Never let external APIs dictate your internal data models.

When integrating with external video platforms, marketing tools, or CRMs, we built strict Translation Layers. The core engine strictly speaks its own internal language. The translation layer morphs our internal payload into whatever the third-party endpoint expects. If an external service deprecates an API version, only the translation layer needs an update.

3. Polling Schedulers > Delayed Job Queues

Instead of relying on rigid, delayed job queues that are a nightmare to debug when they fail, we moved to Polling Schedulers. Our system periodically wakes up, evaluates the current state of the database, and processes whatever actions are due.

Precision: Slightly lower.
Reliability and Debuggability: Infinitely higher.

4. Frictionless Identity Architecture

We completely stripped out forced user accounts for attendees. Users wanted to attend web events without managing yet another password. By linking registrations to secure underlying identifiers, we dramatically decreased onboarding friction. The tradeoff? Identity mapping routing on the backend became wildly more complex, but the UX win was worth it.

💡 The Main Takeaway?

Building a sophisticated SaaS in today's tech climate isn't about writing massive amounts of raw internal features. It's almost entirely about integrations and orchestration.

It's about making peace with the fact that your app is just one node in a massive network of services, and your real job is to ensure the data flows seamlessly, idempotently, and securely between all of them.

Good systems aren't defined by having zero complexity; they are defined by their ability to keep that complexity encapsulated, comprehensible, and resilient.

Building an AI-Powered Portfolio with React 19, Vite, and Gemini 2.5 Flash

Somesh Bhardwaj — Fri, 13 Mar 2026 11:38:12 +0000

As developers, our portfolio is often the first impression we make. Instead of just listing my skills and projects, I wanted visitors to experience what I can build. That's why I decided to rebuild my portfolio as an AI-powered interactive web experience.

In this post, I'll walk you through how I built my new high-performance portfolio using React 19, Vite, Tailwind CSS 4, and the incredible Google Gemini 2.5 Flash model.

The Vision: More Than Just a Website

My goal was to create a site that was not only fast and accessible but also highly interactive. I wanted an AI assistant that could:

Answer questions about my experience and skills.
Control the UI (e.g., scroll to specific sections, filter projects, or toggle themes).
Act as an intelligent lead-capture tool.

The Tech Stack

I chose a stack optimized for speed and developer experience:

Frontend Framework: React 19 & Vite
Styling: Tailwind CSS 4 with custom CSS and glassmorphism design.
AI Integration: Google Gemini 2.5 Flash (via API) & react-markdown for formatting.
Visualizations: Recharts & custom SVGs for interactive skill radars.
Deployment: Netlify (Functions + CDN) to securely handle API keys.

Integrating Google Gemini for Function Calling

The standout feature of this portfolio is the AI Chatbot. Instead of just returning text, the chatbot utilizes Function Calling.

When a user asks, "Show me your web development projects", or "Switch to dark mode", Gemini processes the intent. Using predefined tools, it returns a structured JSON response to call a specific frontend function.

Here is a simplified look at how I implemented this:

// Defining the tool schema for Gemini
const tools = [
  {
    name: "filterProjects",
    description: "Filters the project gallery based on the user's request.",
    parameters: {
      type: "object",
      properties: {
        category: { type: "string" }
      }
    }
  },
  {
    name: "scrollToSection",
    description: "Scrolls the page to a specific section like 'Experience' or 'Contact'."
  }
];

When the frontend receives this tool invocation, it triggers the necessary React state changes to filter the project gallery smoothly.

Dynamic UI and Animations

A chatbot is cool, but the aesthetics matter. I incorporated:

Time-based ambient backgrounds that subtly shift colors.
Glassmorphism design featuring backdrop blurs to keep text readable over dynamic elements.
Scroll Spy Navigation and staggered animations using intersection observers.

All of this was achieved while maintaining WCAG 2.1 AA compliance. Accessibility shouldn't be an afterthought, even heavily customized UIs need screen-reader optimizations and keyboard navigation support.

Content Management Architecture

One of the best developer decisions I made was centralizing all the content into a single constants.ts file:

export const PROJECTS = [...];
export const EXPERIENCE = [...];
export const SKILL_CATEGORIES = [...];

Instead of hunting down specific components to update my resume or add a new project, I simply modify the data object. The entire UI trickles down from these constants, making the portfolio incredibly maintainable.

What's Next?

The portfolio is live, but software is never really "finished." My roadmap includes:

Migrating the server-side chatbot logic to n8n for more complex workflow automation.
Enhancing lead capture directly into Google Sheets using Apps Script (already underway!).
Expanding end-to-end testing with Playwright.

Building this was a fantastic journey merging modern frontend performance with cutting-edge AI integrations. If you're looking to stand out, I highly recommend finding creative ways to weave LLMs into your personal projects.

Feel free to explore the code on my GitHub or chat with the AI on my live portfolio at someshbhardwaj.me!

This article was originally published on my blog at someshbhardwaj.me.