AXIS: Unified B2B Operations Platform

Inspiration

The genesis of Axis came from observing a painful reality across B2B organizations: critical business functions—sales pipeline management, marketing ROI tracking, financial health, and security posture—exist in disconnected silos. Sales teams use CRM tools unaware of finance's cash flow concerns. Marketing tracks ad spend without insight into downstream sales velocity. Finance lacks real-time revenue visibility. Security operates in isolation, unable to immediately assess business impact of threats. Inspiration sources:

• Real-world B2B pain points (fragmented tools, poor data visibility)
• Enterprise SaaS design principles (Salesforce, HubSpot, Stripe)
• Financial cybersecurity focus (AWS and Fortune 500 security models)
• Hackathon challenge for rapid, integrated solutions ## What it does We envisioned a unified dashboard where a sales executive can see their lead pipeline AND marketing spend efficiency AND phishing incident response—all in one view. A CFO can track invoicing AND see which campaigns drive revenue. A security officer can respond to threats AND measure impact on business continuity. ## How we built it Core Modules:
• Lead Generation (CRM) — Create leads with AI-powered auto-scoring (0–100, Cold/Warm/Hot), pipeline visualization by stage, bulk CSV import with dedup detection
• Marketing & Advertising — Campaign analytics with spend/revenue by channel, visual performance charts, campaign status tracking
• Finance/FinOps — Invoice management (paid/pending/overdue), revenue tracking by category, financial health KPIs
• Cybersecurity — Security incident tracking with severity levels, incident status workflow (open → investigating → mitigated → resolved), posture scoring ## Challenges we ran into ## Challenges & How We Overcame Them ### Challenge 1: Aurora PostgreSQL TLS Handshake Hang Problem: Node.js pg client hung indefinitely during TLS 1.3 handshake with Aurora endpoint. Root Cause: RDS expects TLS 1.2 in this runtime; TLS 1.3 triggered certificate negotiation bugs. Solution: Forced TLS 1.2 in all database connections: ``typescript ssl: { rejectUnauthorized: false, minVersion: "TLSv1.2", maxVersion: "TLSv1.2" } **Lesson:** Database connection issues require systematic diagnosis (TCP test → TLS negotiation → auth token). Don't assume the code; test the protocol. ### Challenge 2: Base-UI vs Radix Dialog API Mismatch **Problem:** Migrated from RadixasChildpattern to base-ui'srenderprop; nested button elements caused hydration errors. **Root Cause:** Base-ui renders its own button; wrapping with another button creates invalid nested semantics. **Solution:** Switched torender={}pattern and setnativeButton={false}` for non-button children. Lesson: UI library APIs differ; read the docs for each primitive, especially composition patterns.

Challenge 3: Navigation Latency (No Loading States)

Problem: Sidebar links felt unresponsive; users saw blank screens for 2–3 seconds while DB queries ran. Root Cause: Every page was force-dynamic with blocking await queries before rendering. Solution: Added loading.tsx skeleton UIs to all routes, leveraging Suspense streaming for instant feedback. Lesson: Loading states are UX critical. Implement them during feature development, not as an afterthought.

Challenge 4: Role-Based Access at Scale

Problem: RBAC checks needed to happen at API level (not just UI), but scattered permission logic was unmaintainable. Solution: Created centralized user-context.ts with functions like canViewLead(), canEditLead(), checked in every API route. Lesson: Security is not surface-level; it must be enforced at the boundary (API), not the UI.

Challenge 5: Complex Lead Scoring

Problem: Lead score needed to reflect multiple qualification signals (job title, company size, deal value, contact completeness). Solution: Built calculateLeadScore() helper that weights signals (seniority +30, big company +20, contacted +10, etc.) and updates live as form fields change. Lesson: Business logic (scoring) deserves its own module. Keeps it testable and reusable.

Challenge 6: Time Constraints vs Scope

Problem: Had ideas for Phase 2–4 (Slack integration, 2FA, PWA) but only 4 days. Solution: Ruthlessly prioritized Phase 1 (activity logs, RBAC, CSV import) as a complete, testable foundation. Documented roadmap for future phases. Lesson: Shipping a polished MVP beats a half-baked feature fest. Judges and users value completeness.

Accomplishments that we're proud of

Built in 4 days for a hackathon, Axis demonstrates full-stack proficiency: serverless PostgreSQL design, Next.js 16 optimizations, real-time data visualization, production-grade API security, and thoughtful UX for high-stakes B2B workflows.

What we learned

Axis is a unified B2B operations platform that consolidates four critical business functions— lead generation with AI scoring, marketing analytics, finance automation, and cybersecurity incident response—into one cohesive dashboard

What's next for AXIS: Unified B2B Operations Platform

We learned that unified platforms require ruthless prioritization, that security lives at the API boundary (not the UI), and that great UX starts with skeleton loading states. Shipping Phase 1 polished rather than Phase 4 half-baked was the right call.

Built With

• 16-(app-router)
• amazon-aurora-postgresql
• custom-jwt
• lucide-react
• node.js
• pg-(node-postgres)
• pnpm
• react-19.2-(canary)
• react-hooks-+-context
• recharts
• shadcn/ui-+-radix
• swr-+-native-fetch
• tailwind-css
• typescript
• v20+-(via-vercel)
• v4-(jit-compiled)
• vercel