So I Built AdCampaignManager — A Full-Stack Advertising Campaign Management Platform That Combines Real-Time Data With Generative AI.

Here Is The Complete Breakdown Of How It Works.

━━━━━━━━━━━━━━━━━━

🛠️ The Tech Stack

• Frontend - React.Js Plus Vite Plus Tailwind CSS v4

• Backend - Node.Js Plus Express.Js

• Database - MongoDB Plus Mongoose

• Real-Time - Socket.IO

• AI Layer - Groq LLM openai/gpt-oss-120b

• Image Upload - Cloudinary Plus Multer

• Email - Nodemailer

• Scheduled Tasks - Node-Cron

• Authentication - JWT Plus Bcrypt Plus OTP

━━━━━━━━━━━━━━━━━━

🎯 The 10 Core Modules

1. Dashboard

Real-Time KPI Cards Showing Impressions Clicks Conversions Revenue CTR CPC ROI And CVR. All Data Fetched Live From MongoDB Aggregation Pipelines.

1. Authentication

Register Login Email OTP Verification 2FA Password Reset Session Management. JWT With Access Plus Refresh Tokens Stored In localStorage.

1. Campaign Management

Full CRUD With Status Lifecycle Draft To Scheduled To Running To Paused To Completed To Cancelled. Duplicate Compare Side-By-Side Creative Upload Via Cloudinary.

1. Audience Management

Age Range Gender 50 Countries 50 Cities 50 Interests 50 Languages And Device Targeting. Overlap Detection Between Segments.

1. Analytics And Insights

Real-Time KPIs Engagement Heatmap Hour By Day Traffic Sources Funnel Analysis Campaign Leaderboard.

1. Subscription Plans

12 Plus Premium Tiers Subscribe Auto-Renew Corporate Plans Usage Analytics.

1. Reviews And Moderation

5-Star Ratings Sentiment Badges Photo Uploads Admin Approval Workflow.

1. Team Collaboration

Real-Time Chat Via Socket.IO Kanban Boards Member Roles Activity Feed.

1. Support Tickets

Categories Priorities Reply Threads Internal Notes Knowledge Base.

1. AI Insights Dashboard

Platform-Wide KPIs Anomaly Alerts AI Narratives.

━━━━━━━━━━━━━━━━━━

🤖 The Generative AI Layer

Every Module Has Its Own Dedicated AI Service Powered By Groq LLM openai/gpt-oss-120b.

Here Are The 10 AI Services

Analytics AI

Narrate Insights Detect Anomalies Forecast Revenue For 30 60 90 Days Generate Report Advise KPI Explain Trend Reallocate Budget Analyze Creative.

Campaign AI

Write Copy Suggest Goal Optimize Budget Generate Name Quality Check Suggest Schedule.

Audience AI

Recommend Audience Suggest Interests Estimate Reach Optimize Demographics Build Lookalike Resolve Overlap.

Plan AI

Recommend Plan Write Benefits Advise Upgrade Detect Renewal Risk Suggest Pricing Build Corporate Plan.

Review AI

Sentiment Analysis Fake Review Detection Summarize Reviews Draft Admin Reply Moderate Photo Extract Highlights.

Insights AI

Narrate Platform Detect Anomalies Forecast Revenue Generate Report Advise KPI Explain Trend.

Support AI

Classify Ticket Draft Reply Detect Duplicate Suggest FAQ Predict Resolution Time Auto-Write FAQ.

Team AI

Summarize Chat Auto-Assign Tasks Find Meeting Time Productivity Insights Suggest File Tags Recommend Lead.

━━━━━━━━━━━━━━━━━━

💡 Key Engineering Decisions

1. JSON Mode

Every AI Prompt Forces The LLM To Return Valid JSON. This Prevents Parsing Errors And Broken UI. Without JSON Mode The AI Sometimes Returns Markdown Which Crashes The Frontend Parser.

1. cleanValue Helper

The AI Sometimes Returns Placeholder Values Like N/A Or A Hyphen Or Empty Strings. This Helper Sanitizes Them Before They Reach The Frontend.

1. Post-Processing

After Every AI Response Arrays Are Filtered To Remove Invalid Values. Generation Plus Cleanup Is The Reliable Pattern.

1. Real-Time Sync

Socket.IO Room-Based Subscriptions For Team Chat. Each Client Joins Only The Rooms It Needs Using team Colon teamId Format. This Keeps Bandwidth Low And Updates Instant.

1. Scheduled Automation

Node-Cron Runs Two Jobs. Every Minute It Simulates Running Campaigns To Generate Realistic Impressions Clicks Conversions Spend And Revenue. Daily At Midnight It Aggregates Previous Day Analytics Into A Single Snapshot Document For Fast 30 60 90 Day Queries.

━━━━━━━━━━━━━━━━━━

🔐 Security Architecture

• JWT Authentication With Access And Refresh Tokens

• Email OTP Verification 6 Digits 1 Min Expiry

• Optional 2FA Via Email

• Password Reset Via OTP And Short-Lived JWT

• Rate Limiting 500 Requests Per 15 Min Global 50 Requests Per 15 Min Auth

• Helmet.Js Security Headers

• CORS With Credentials

• Cloudinary File Type Validation

• Bcrypt Password Hashing 10 Salt Rounds

• Environment Variables For All Secrets

━━━━━━━━━━━━━━━━━━

🎨 UI Design Philosophy

• Glassmorphism On Every Card Using backdrop-blur-xl border-2 border-white/10 rounded-3xl

• Green Gradient Theme from-black via-[#021d0f] to-black Across All Pages

• Uppercase Bold Typography With tracking-[0.2em]

• Custom Dropdowns With Animated Chevrons

• Modal Portals With Backdrop Blur

• Toast Notifications With Color-Coded Types

• Corner Brackets On Every Card

• Floating Icon Animations

• Staggered Fade-In For Table Rows

• Fully Responsive Design

━━━━━━━━━━━━━━━━━━

💡 Key Challenges And Learnings

Challenge 1 — AI Output Reliability

The LLM Sometimes Returns Invalid JSON Or Placeholder Values. This Was Fixed With A Three-Layer Approach. First Force JSON Mode At The API Level. Second Sanitize Every Value With The cleanValue Helper. Third Filter Arrays During Post-Processing.

Challenge 2 — Real-Time Team Chat

The Team Members Needed Live Chat Without Refresh. This Was Solved With Socket.IO Room-Based Subscriptions. Each Client Joins Only The Rooms It Needs.

Challenge 3 — Fast Analytics Queries

The Analytics Collection Grew Huge. This Was Solved With Daily Snapshot Cron Job That Aggregates Data Into A Lightweight Collection For Fast Queries.

Challenge 4 — Multi-Role Permission

Admin And User Roles Need Different Access Levels. This Was Solved With owner Field Check Plus isAdmin Boolean Plus Backend authorize Middleware.

Challenge 5 — Campaign Lifecycle

Campaigns Need To Move Through Multiple States. This Was Solved With Auto Transitions From Draft To Scheduled To Running To Paused To Completed To Cancelled.

Challenge 6 — Image Uploads In Serverless

Local Disk Storage Breaks In Serverless Deployments. This Was Solved With Cloudinary Streaming API. The File Buffer Goes Directly To CDN.

━━━━━━━━━━━━━━━━━━

🎯 What Comes Next

I Am Currently Working On Adding Voice-Based AI Assistant To AdCampaignManager. The Plan Is To Let Users Speak Commands Like Create A New Campaign For Sneakers With 5000 Rupees Daily Budget And The AI Will Auto-Fill Everything.

Other Planned Features Include

• Real-Time Collaboration With Cursor Tracking

• Mobile App Using React Native

• Public API For Third-Party Developers

• Advanced Predictive Analytics Dashboard

━━━━━━━━━━━━━━━━━━

📌 Final Thoughts

Building AdCampaignManager Taught Me That Production AI Is Not Just About Calling An LLM. It Is About Prompt Engineering Error Handling Post-Processing And Delivering Clean Data To Users.

The Biggest Lesson Was That Reliability Matters More Than Cleverness. A Simple JSON Mode Plus Cleanup Logic Beats An Elaborate Prompt That Sometimes Fails.

The Second Lesson Was That Real-Time Features Need Careful Architecture. Broadcasting To All Clients Kills Performance. Room-Based Subscriptions Are The Way.

━━━━━━━━━━━━━━━━━━

Interested In The Full Source Code Or Getting This Project For Your Portfolio?

🌐 https://www.theprojectstack.com/

Happy To Answer Any Questions About The Architecture Or AI Integration. Drop A Comment Below!

So I Built AirSense A Full-Stack Air Quality Monitoring Ecosystem That Combines Real-Time Data With Generative AI.

Here Is The Complete Breakdown Of How It Works.

🛠️ The Tech Stack

• Frontend - React.Js + Tailwind CSS

• Backend - Node.Js + Express.Js

• Database - MongoDB + Mongoose

• Real-Time - Socket.IO

• AI Layer - Groq LLM

• Cloud - Cloudinary + WAQI API

• Authentication - JWT With 2FA And OTP Verification

🌬️ Core Features

Real-Time Monitoring

A Multi-Station AQI Dashboard With Live Updates Via Socket.IO. Color-Coded Heatmaps Across All Monitoring Stations. A 24-Hour Timeline Scrubber And Trend History. Every New Reading Pushes Instantly To Connected Clients Without A Page Refresh.

Generative AI Layer Powered By Groq LLM

• AI Insight Narrator - Plain-English AQI Explanations With Exact Numbers

• Anomaly Explainer - Detects Unusual Pollution Patterns And Suggests Causes

• Health Advisory Writer - Real-Time Precautions For Sensitive Zones Like Schools And Hospitals

• Pollution Source Narrator - Explains Why A Specific Pollutant Dominates At A Station

• Compliance Summarizer - Regulatory Insights For WHO US EPA CPCB And EU Standards

• Report Writer - AI-Generated Executive Reports For Any Time Period

• KPI Advisor - Recommends Which Metrics To Focus On Based On Live Data

• Trend Explainer - Breaks Down Why A Metric Moved Up Down Or Stayed Stable

Forecasting Engine

Statistical Time-Series Forecasting Using Linear Regression. Predictions For 12-Hour 7-Day And 30-Day Horizons. Every Forecast Is Enhanced With AI-Generated Explanations And Confidence Scoring. Also Supports Side-By-Side Forecast Comparison Across Multiple Stations.

Multi-Standard Compliance

Instantly Check Pollutant Levels Against WHO US EPA CPCB And EU Standards. Each Reading Is Graded As Pass Or Fail With Exceedance Percentage Calculated Automatically.

Pollution Source Attribution

AI Analyzes And Attributes Pollution To Sources Like Traffic Industrial Construction Crop Burning Natural And Other. Each Source Comes With Impact Metrics For Population Health Economy And Carbon Footprint.

🤖 The AI Layer In Detail

Every AI Feature Runs On Groq LLM Using Two Models. The Primary Model Is openai/gpt-oss-120b For Complex Reasoning And The Secondary Model Is llama-3.1-8b-instant For Faster Simpler Tasks.

Key Engineering Decisions

1. JSON Mode - Every Prompt Forces The LLM To Return Valid JSON. This Prevents Parsing Errors And Broken UI.

2. cleanValue Helper - The AI Sometimes Returns Placeholder Values Like A Hyphen Or N/A Or Empty Strings. This Helper Sanitizes Them Before They Reach The Frontend.

3. sessionSeed - A Random 6-Character String Is Injected Into Every Prompt. This Prevents The AI From Repeating The Same Answer On Every Call.

4. Post-Processing - After Every AI Response Arrays Are Filtered To Remove Invalid Values. Generation Plus Cleanup Is The Reliable Pattern.

5. Temperature Tuning - Different AI Services Use Different Temperature Settings. Creative Tasks Use Higher Temperature Around 0.85 While Deterministic Tasks Use Lower Temperature Around 0.3.

📊 Forecasting Is Not AI But Enhanced By It

The Prediction Itself Uses Linear Regression Which Is A Statistical Method. Not A Neural Network. Not A Transformer. Just Classic Maths.

But Every Forecast Is Enhanced With -

• AI-Generated Explanations Of The Trend

• Confidence Scoring That Decreases With Horizon

• Health Advisory Recommendations Based On Predicted AQI

• Weather Impact Analysis

This Hybrid Approach Is What Modern Production Apps Actually Use.

🔐 Security Architecture

• JWT Authentication With 2FA

• OTP Verification Via Email For Registration And Password Reset

• Role-Based Access Control For Admin And User Roles

• Session Management With Full Audit Trail

• Password Hashing With Bcrypt

• Rate Limiting On Sensitive Endpoints

• Environment Variables For All Secrets

💡 Key Challenges And Learnings

Challenge 1 - AI Output Reliability

Sometimes The AI Returned Placeholder Values Empty Arrays Or Even Broke JSON Format. This Was Fixed With A Three-Layer Approach. First Force JSON Mode At The API Level. Second Sanitize Every Value With The cleanValue Helper. Third Filter Arrays During Post-Processing.

Challenge 2 - Real-Time Sync

The Dashboard Needed Live Updates Without Refreshing. This Was Solved With Socket.IO Room-Based Subscriptions Using station-id Format. Each Client Joins Only The Rooms It Needs.

Challenge 3 - Stateless Uploads

Storing Images On The Server Would Break In Serverless Deployments. This Was Solved By Using Cloudinary Streaming API Instead Of Local Disk Storage.

Challenge 4 - Multi-Standard Compliance Logic

Each Regulatory Body Has Different Limits For Each Pollutant. This Was Solved With A Central LIMITS Object That Maps Every Standard-Pollutant Combination To Its Threshold Value.

🎯 What Comes Next

I Am Currently Working On Adding LSTM Neural Networks For Forecasting To Push Accuracy Higher Than Linear Regression. The Plan Is To Use TensorFlow.Js For Direct Node.Js Integration Without Needing A Separate Python Service.

Other Planned Features Include -

• Real Payment Gateway Integration

• Mobile App Using React Native

• Public API For Third-Party Developers

• Advanced Historical Analytics Dashboard

📌 Final Thoughts

Building AirSense Taught Me That Production AI Is Not Just About Calling An LLM. It Is About Prompt Engineering Error Handling Post-Processing And Delivering Clean Data To Users.

The Biggest Lesson Was That Reliability Matters More Than Cleverness. A Simple JSON Mode Plus Cleanup Logic Beats An Elaborate Prompt That Sometimes Fails.

Interested In The Full Source Code Or Getting This For Your Portfolio?

🌐 https://www.theprojectstack.com/

Happy To Answer Any Questions About The Architecture Or AI Integration. Drop A Comment Below!