<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Prashanth</title>
    <description>The latest articles on DEV Community by Prashanth (@prashanth123).</description>
    <link>https://dev.to/prashanth123</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F893766%2Fdeaf9583-0141-402b-bd8a-3aa89fbb078a.jpg</url>
      <title>DEV Community: Prashanth</title>
      <link>https://dev.to/prashanth123</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/prashanth123"/>
    <language>en</language>
    <item>
      <title>Building RestaurantOS AI: Observable Multi-Agent Restaurant Orchestration with OpenTelemetry and SigNoz</title>
      <dc:creator>Prashanth</dc:creator>
      <pubDate>Mon, 27 Jul 2026 03:37:40 +0000</pubDate>
      <link>https://dev.to/prashanth123/building-restaurantos-ai-observable-multi-agent-restaurant-orchestration-with-opentelemetry-and-5a23</link>
      <guid>https://dev.to/prashanth123/building-restaurantos-ai-observable-multi-agent-restaurant-orchestration-with-opentelemetry-and-5a23</guid>
      <description>&lt;p&gt;Learn how we built an observable AI-powered restaurant operating system using OpenTelemetry, SigNoz, Prisma, and multi-agent architecture.&lt;/p&gt;

&lt;h1&gt;
  
  
  Building RestaurantOS AI: Observable Multi-Agent Restaurant Orchestration with OpenTelemetry and SigNoz
&lt;/h1&gt;

&lt;p&gt;Modern restaurants generate enormous amounts of operational data every day. Forecasting demand, tracking inventory, minimizing food waste, and purchasing ingredients are all interconnected decisions that traditionally require significant manual effort.&lt;/p&gt;

&lt;p&gt;To automate these processes, we built &lt;strong&gt;RestaurantOS AI&lt;/strong&gt; an &lt;strong&gt;AI-powered Restaurant Operating System&lt;/strong&gt; driven by specialized autonomous agents.&lt;/p&gt;

&lt;p&gt;But there was one major challenge.&lt;/p&gt;

&lt;p&gt;Large Language Model (LLM) agents don't behave like traditional software.&lt;/p&gt;

&lt;p&gt;They are probabilistic.&lt;/p&gt;

&lt;p&gt;They make decisions.&lt;/p&gt;

&lt;p&gt;They call multiple services.&lt;/p&gt;

&lt;p&gt;They generate intermediate reasoning.&lt;/p&gt;

&lt;p&gt;Without observability, debugging becomes nearly impossible.&lt;/p&gt;

&lt;p&gt;That is why &lt;strong&gt;OpenTelemetry&lt;/strong&gt; and &lt;strong&gt;SigNoz&lt;/strong&gt; became core components of our architecture rather than optional monitoring tools.&lt;/p&gt;

&lt;p&gt;In this article, we'll walk through how we built an observable multi-agent system that makes every AI decision transparent.&lt;/p&gt;




&lt;h1&gt;
  
  
  Table of Contents
&lt;/h1&gt;

&lt;ul&gt;
&lt;li&gt;Why RestaurantOS AI?&lt;/li&gt;
&lt;li&gt;Multi-Agent Architecture&lt;/li&gt;
&lt;li&gt;Integrating OpenTelemetry&lt;/li&gt;
&lt;li&gt;Custom Agent Tracing&lt;/li&gt;
&lt;li&gt;LLM Observability&lt;/li&gt;
&lt;li&gt;SigNoz MCP Integration&lt;/li&gt;
&lt;li&gt;End-to-End Trace Flow&lt;/li&gt;
&lt;li&gt;Real-world Problems We Solved&lt;/li&gt;
&lt;li&gt;Key Learnings&lt;/li&gt;
&lt;/ul&gt;




&lt;h1&gt;
  
  
  Why RestaurantOS AI?
&lt;/h1&gt;

&lt;p&gt;Restaurant managers constantly answer questions like:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;How many customers should we expect today?&lt;/li&gt;
&lt;li&gt;Which ingredients will run out?&lt;/li&gt;
&lt;li&gt;Which food items are close to expiry?&lt;/li&gt;
&lt;li&gt;What should we purchase from suppliers?&lt;/li&gt;
&lt;li&gt;How can we reduce food waste?&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Instead of solving these manually, RestaurantOS AI coordinates multiple specialized AI agents that collaborate together.&lt;/p&gt;




&lt;h1&gt;
  
  
  Multi-Agent Architecture
&lt;/h1&gt;

&lt;p&gt;RestaurantOS AI uses five specialized agents orchestrated through a sequential pipeline.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;                           +--------------------------------------+
                                      |             User Request             |
                                      |   e.g. "Tomato supply shortages"     |
                                      +------------------+-------------------+
                                                         |
                                                         v
                                      +--------------------------------------+
                                      |          Supervisor Agent            |
                                      |   Routes, Orchestrates &amp;amp; Synthesizes |
                                      +------------------+-------------------+
                                                         |
                                                         v

     ┌────────────────┐      ┌─────────────────┐      ┌────────────────┐      ┌─────────────────┐      ┌────────────────┐
     │    Stage 1     │ ---&amp;gt; │     Stage 2     │ ---&amp;gt; │    Stage 3     │ ---&amp;gt; │     Stage 4     │ ---&amp;gt; │   Final Output │
     └────────────────┘      └─────────────────┘      └────────────────┘      └─────────────────┘      └────────────────┘
              |                         |                        |                         |                        |
              v                         v                        v                         v                        v
     ┌────────────────┐      ┌─────────────────┐      ┌────────────────┐      ┌─────────────────┐      ┌────────────────┐
     │ Demand Agent   │ ---&amp;gt; │ Inventory Agent │ ---&amp;gt; │ Waste Agent    │ ---&amp;gt; │ Purchase Agent  │ ---&amp;gt; │ Response        │
     │                │      │                 │      │                │      │                 │      │ Synthesis       │
     │ Forecast POS   │      │ Detect Stock    │      │ Reduce Waste   │      │ Generate POs    │      │ Final Decision  │
     │ Sales Demand   │      │ Deficits        │      │ &amp;amp; Promotions   │      │ Supplier Logic  │      │ Returned        │
     └────────────────┘      └─────────────────┘      └────────────────┘      └─────────────────┘      └────────────────┘
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Supervisor Agent
&lt;/h2&gt;

&lt;p&gt;Acts as the orchestrator.&lt;/p&gt;

&lt;p&gt;Responsibilities:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Understands user intent&lt;/li&gt;
&lt;li&gt;Selects workflow&lt;/li&gt;
&lt;li&gt;Coordinates agents&lt;/li&gt;
&lt;li&gt;Synthesizes final response&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Demand Forecast Agent
&lt;/h2&gt;

&lt;p&gt;Uses historical POS sales to estimate:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Customer traffic&lt;/li&gt;
&lt;li&gt;Menu demand&lt;/li&gt;
&lt;li&gt;Peak hours&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Inventory Intelligence Agent
&lt;/h2&gt;

&lt;p&gt;Compares projected demand against current inventory.&lt;/p&gt;

&lt;p&gt;Detects:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Ingredient shortages&lt;/li&gt;
&lt;li&gt;Overstock&lt;/li&gt;
&lt;li&gt;Critical stock levels&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Waste Reduction Agent
&lt;/h2&gt;

&lt;p&gt;Identifies ingredients approaching expiry.&lt;/p&gt;

&lt;p&gt;Suggests:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Chef specials&lt;/li&gt;
&lt;li&gt;Promotional meals&lt;/li&gt;
&lt;li&gt;Smart inventory utilization&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Purchase Decision Agent
&lt;/h2&gt;

&lt;p&gt;Creates supplier purchase recommendations by considering:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Stock deficits&lt;/li&gt;
&lt;li&gt;Vendor pricing&lt;/li&gt;
&lt;li&gt;Lead times&lt;/li&gt;
&lt;li&gt;Bulk purchasing&lt;/li&gt;
&lt;/ul&gt;




&lt;h1&gt;
  
  
  Integrating OpenTelemetry
&lt;/h1&gt;

&lt;p&gt;To trace every component of our backend, we initialized the OpenTelemetry Node SDK before the Express application starts.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;NodeSDK&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;@opentelemetry/sdk-node&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;OTLPTraceExporter&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;@opentelemetry/exporter-trace-otlp-http&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;sdk&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;NodeSDK&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;
  &lt;span class="nx"&gt;traceExporter&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="na"&gt;instrumentations&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;
    &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;HttpInstrumentation&lt;/span&gt;&lt;span class="p"&gt;(),&lt;/span&gt;
    &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;ExpressInstrumentation&lt;/span&gt;&lt;span class="p"&gt;(),&lt;/span&gt;
    &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;PrismaInstrumentation&lt;/span&gt;&lt;span class="p"&gt;(),&lt;/span&gt;
    &lt;span class="nf"&gt;getNodeAutoInstrumentations&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt;
  &lt;span class="p"&gt;]&lt;/span&gt;
&lt;span class="p"&gt;});&lt;/span&gt;

&lt;span class="nx"&gt;sdk&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;start&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This automatically traces:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;HTTP requests&lt;/li&gt;
&lt;li&gt;Express middleware&lt;/li&gt;
&lt;li&gt;Prisma queries&lt;/li&gt;
&lt;li&gt;External network calls&lt;/li&gt;
&lt;/ul&gt;




&lt;h1&gt;
  
  
  Custom Agent Instrumentation
&lt;/h1&gt;

&lt;p&gt;Auto instrumentation isn't enough for AI systems.&lt;/p&gt;

&lt;p&gt;We created custom spans around every agent execution.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;tracer&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;startActiveSpan&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s2"&gt;`Agent &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;agent&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;name&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="k"&gt;async &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;span&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;

    &lt;span class="nx"&gt;span&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;setAttribute&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;agent.name&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;agent&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;name&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;result&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;agent&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;execute&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;input&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

    &lt;span class="nx"&gt;span&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;setStatus&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;
        &lt;span class="na"&gt;code&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;SpanStatusCode&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;OK&lt;/span&gt;
    &lt;span class="p"&gt;});&lt;/span&gt;

    &lt;span class="nx"&gt;span&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;end&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;

&lt;span class="p"&gt;});&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Each span records:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Agent name&lt;/li&gt;
&lt;li&gt;Execution duration&lt;/li&gt;
&lt;li&gt;Success/failure&lt;/li&gt;
&lt;li&gt;Events&lt;/li&gt;
&lt;li&gt;Exceptions&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;This lets us visualize every agent independently inside SigNoz.&lt;/p&gt;




&lt;h1&gt;
  
  
  LLM Observability
&lt;/h1&gt;

&lt;p&gt;LLM requests deserve their own telemetry.&lt;/p&gt;

&lt;p&gt;We adopted OpenTelemetry GenAI Semantic Conventions.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nx"&gt;span&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;setAttribute&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;gen_ai.request.model&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;model&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="nx"&gt;span&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;setAttribute&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
    &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;gen_ai.usage.total_tokens&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="nx"&gt;response&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;usage&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;total_tokens&lt;/span&gt;
&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="nx"&gt;span&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;setAttribute&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
    &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;gen_ai.latency_ms&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="nx"&gt;durationMs&lt;/span&gt;
&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now every LLM request captures:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Prompt tokens&lt;/li&gt;
&lt;li&gt;Completion tokens&lt;/li&gt;
&lt;li&gt;Total tokens&lt;/li&gt;
&lt;li&gt;Model&lt;/li&gt;
&lt;li&gt;Latency&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Exactly what production AI applications need.&lt;/p&gt;




&lt;h1&gt;
  
  
  Leveraging SigNoz MCP
&lt;/h1&gt;

&lt;p&gt;During development we also used the official &lt;strong&gt;SigNoz MCP Server&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;It enabled:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Dashboard generation through natural language&lt;/li&gt;
&lt;li&gt;Trace exploration&lt;/li&gt;
&lt;li&gt;Log investigations&lt;/li&gt;
&lt;li&gt;Alert creation&lt;/li&gt;
&lt;li&gt;Querying ClickHouse metrics directly&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Instead of manually configuring dashboards, the AI assistant generated many of them automatically.&lt;/p&gt;




&lt;h1&gt;
  
  
  End-to-End Trace Flow
&lt;/h1&gt;

&lt;p&gt;When a user submits a request:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;POST /ai/query
│
├── Demand Agent
│     └── LLM Request
│
├── Inventory Agent
│     ├── Prisma Query
│     └── LLM Request
│
├── Waste Agent
│     └── LLM Request
│
└── Purchase Agent
      ├── Prisma Query
      └── LLM Request
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Inside SigNoz we can immediately identify:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Slow database queries&lt;/li&gt;
&lt;li&gt;Slow LLM calls&lt;/li&gt;
&lt;li&gt;Token-heavy prompts&lt;/li&gt;
&lt;li&gt;Failed agents&lt;/li&gt;
&lt;li&gt;Error propagation&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;This transformed debugging from hours into minutes.&lt;/p&gt;




&lt;h1&gt;
  
  
  Real-world Problems We Solved
&lt;/h1&gt;

&lt;h2&gt;
  
  
  1. OpenTelemetry Loaded Before dotenv
&lt;/h2&gt;

&lt;p&gt;Since OpenTelemetry was initialized using Node's &lt;code&gt;--import&lt;/code&gt;, it executed before our application loaded environment variables.&lt;/p&gt;

&lt;p&gt;As a result, the OTLP exporter ignored our cloud configuration.&lt;/p&gt;

&lt;h3&gt;
  
  
  Solution
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="nx"&gt;dotenv&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;dotenv&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="nx"&gt;dotenv&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;config&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Load environment variables before initializing OpenTelemetry.&lt;/p&gt;




&lt;h2&gt;
  
  
  2. PostgreSQL Port Conflict
&lt;/h2&gt;

&lt;p&gt;Native PostgreSQL on Windows occupied port &lt;strong&gt;5432&lt;/strong&gt;, causing Prisma to connect to the wrong instance.&lt;/p&gt;

&lt;h3&gt;
  
  
  Solution
&lt;/h3&gt;

&lt;p&gt;Expose Docker PostgreSQL on &lt;strong&gt;5435&lt;/strong&gt; instead.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight yaml"&gt;&lt;code&gt;&lt;span class="na"&gt;ports&lt;/span&gt;&lt;span class="pi"&gt;:&lt;/span&gt;
  &lt;span class="pi"&gt;-&lt;/span&gt; &lt;span class="s2"&gt;"&lt;/span&gt;&lt;span class="s"&gt;5435:5432"&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;h2&gt;
  
  
  3. Docker Volume Credential Caching
&lt;/h2&gt;

&lt;p&gt;Changing &lt;code&gt;POSTGRES_PASSWORD&lt;/code&gt; had no effect because PostgreSQL initializes credentials only once.&lt;/p&gt;

&lt;h3&gt;
  
  
  Solution
&lt;/h3&gt;

&lt;p&gt;Delete the existing volume.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;docker &lt;span class="nb"&gt;rm&lt;/span&gt; &lt;span class="nt"&gt;-f&lt;/span&gt; restaurantos-postgres

docker volume &lt;span class="nb"&gt;rm &lt;/span&gt;restaurantos_ai_postgres_data

docker compose up &lt;span class="nt"&gt;-d&lt;/span&gt; postgres
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;h1&gt;
  
  
  Key Learnings
&lt;/h1&gt;

&lt;p&gt;Building RestaurantOS AI taught us several important lessons.&lt;/p&gt;

&lt;p&gt;✅ AI systems require domain-specific observability.&lt;/p&gt;

&lt;p&gt;✅ OpenTelemetry makes every agent execution traceable.&lt;/p&gt;

&lt;p&gt;✅ SigNoz provides a complete end-to-end visualization.&lt;/p&gt;

&lt;p&gt;✅ Token usage should be monitored just like CPU or memory.&lt;/p&gt;

&lt;p&gt;✅ Database spans reveal bottlenecks that AI latency often hides.&lt;/p&gt;

&lt;p&gt;Most importantly:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;strong&gt;Observability turns AI from a black box into production software.&lt;/strong&gt;&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h1&gt;
  
  
  Conclusion
&lt;/h1&gt;

&lt;p&gt;RestaurantOS AI combines specialized AI agents with production-grade observability.&lt;/p&gt;

&lt;p&gt;By integrating &lt;strong&gt;OpenTelemetry&lt;/strong&gt; and &lt;strong&gt;SigNoz&lt;/strong&gt;, every HTTP request, database query, LLM call, and autonomous decision becomes traceable.&lt;/p&gt;

&lt;p&gt;Instead of wondering &lt;em&gt;why&lt;/em&gt; an agent behaved a certain way, we can inspect the complete execution path in seconds.&lt;/p&gt;

&lt;p&gt;As AI systems continue becoming more autonomous, observability will become just as important as the models themselves.&lt;/p&gt;

&lt;p&gt;If you're building AI applications for production, start instrumenting early you'll thank yourself later.&lt;/p&gt;

&lt;p&gt;Happy Building! 🚀&lt;/p&gt;

</description>
      <category>agents</category>
      <category>ai</category>
      <category>llm</category>
      <category>monitoring</category>
    </item>
    <item>
      <title>Winter Solstice Celebrations - Interactive Educational Experience</title>
      <dc:creator>Prashanth</dc:creator>
      <pubDate>Fri, 27 Dec 2024 17:39:50 +0000</pubDate>
      <link>https://dev.to/prashanth123/winter-solstice-celebrations-interactive-educational-experience-4dba</link>
      <guid>https://dev.to/prashanth123/winter-solstice-celebrations-interactive-educational-experience-4dba</guid>
      <description>&lt;p&gt;&lt;em&gt;This is a submission for &lt;a href="https://dev.to/challenges/frontend-2024-12-04"&gt;Frontend Challenge - December Edition, Glam Up My Markup: Winter Solstice&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;What I Built&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I created an interactive, educational single-page application that explores the Winter Solstice's scientific and cultural significance worldwide. The project transforms basic HTML content into a modern, engaging web experience using React, TypeScript, and Tailwind CSS.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Key features:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Responsive navigation with smooth scrolling&lt;/li&gt;
&lt;li&gt;Interactive UI elements with hover effects&lt;/li&gt;
&lt;li&gt;Beautiful gradients and animations&lt;/li&gt;
&lt;li&gt;Optimized performance with React components&lt;/li&gt;
&lt;li&gt;Accessibility-focused design&lt;/li&gt;
&lt;li&gt;Dynamic icons using Lucide React&lt;/li&gt;
&lt;li&gt;Stunning imagery from Unsplash&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Demo&lt;/strong&gt;&lt;br&gt;
The live site showcases:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;A hero section with animated sun/moon icons&lt;/li&gt;
&lt;li&gt;Sticky navigation that appears on scroll&lt;/li&gt;
&lt;li&gt;Beautifully styled content sections&lt;/li&gt;
&lt;li&gt;Card-based layouts for celebrations and traditions&lt;/li&gt;
&lt;li&gt;Smooth transitions and hover effects&lt;/li&gt;
&lt;li&gt;Mobile-responsive design&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F9mow2rpuw9yllx532l7q.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F9mow2rpuw9yllx532l7q.png" alt="Image description" width="800" height="377"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Journey&lt;/strong&gt;&lt;br&gt;
&lt;strong&gt;Technical Implementation&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Used React for component-based architecture&lt;/li&gt;
&lt;li&gt;Implemented TypeScript for type safety&lt;/li&gt;
&lt;li&gt;Utilized Tailwind CSS for responsive styling&lt;/li&gt;
&lt;li&gt;Created reusable components for maintainability&lt;/li&gt;
&lt;li&gt;Added smooth scrolling navigation&lt;/li&gt;
&lt;li&gt;Integrated Lucide React icons for consistent visuals&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Component Structure&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Navigation:&lt;/strong&gt; Smart navbar with scroll detection&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Content Sections:&lt;/strong&gt; Modular components for each topic&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Card Components:&lt;/strong&gt; Reusable cards for celebrations and traditions&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Footer:&lt;/strong&gt; Responsive footer with navigation links&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;Key Learnings&lt;/strong&gt;&lt;br&gt;
&lt;strong&gt;1. Performance Optimization&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Implemented lazy loading for images&lt;/li&gt;
&lt;li&gt;Used CSS animations for smooth transitions&lt;/li&gt;
&lt;li&gt;Optimized component rendering&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;2. Accessibility&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Semantic HTML structure&lt;/li&gt;
&lt;li&gt;ARIA labels for interactive elements&lt;/li&gt;
&lt;li&gt;Keyboard navigation support&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;3. Responsive Design&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Mobile-first approach&lt;/li&gt;
&lt;li&gt;Flexible layouts using Tailwind CSS&lt;/li&gt;
&lt;li&gt;Dynamic content adaptation&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Proud Achievements&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Clean, maintainable code structure&lt;/li&gt;
&lt;li&gt;Smooth, intuitive user experience&lt;/li&gt;
&lt;li&gt;Beautiful visual design with attention to detail&lt;/li&gt;
&lt;li&gt;Responsive layout that works across devices&lt;/li&gt;
&lt;li&gt;Accessibility considerations throughout&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;Future Improvements&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Adding interactive animations for solstice explanation&lt;/li&gt;
&lt;li&gt;Implementing dark/light mode toggle&lt;/li&gt;
&lt;li&gt;Adding more cultural celebrations&lt;/li&gt;
&lt;li&gt;Creating interactive timeline of solstice history&lt;/li&gt;
&lt;li&gt;Adding multi-language support&lt;/li&gt;
&lt;/ol&gt;

</description>
      <category>devchallenge</category>
      <category>frontendchallenge</category>
      <category>css</category>
      <category>javascript</category>
    </item>
    <item>
      <title>Important things to learn in React</title>
      <dc:creator>Prashanth</dc:creator>
      <pubDate>Fri, 22 Sep 2023 06:46:32 +0000</pubDate>
      <link>https://dev.to/prashanth123/important-things-to-learn-in-react-3f67</link>
      <guid>https://dev.to/prashanth123/important-things-to-learn-in-react-3f67</guid>
      <description>&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fgh7xr73ovhalxmqy3ulk.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fgh7xr73ovhalxmqy3ulk.png" alt="Image description" width="800" height="1000"&gt;&lt;/a&gt;&lt;br&gt;
&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0gu385s5uw7t2lkds7fz.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0gu385s5uw7t2lkds7fz.png" alt="Image description" width="800" height="1000"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>react</category>
      <category>javascript</category>
      <category>beginners</category>
    </item>
  </channel>
</rss>
