DEVLOG.md

Day 1 — 2026-05-08

Hours worked: 5

What I did:

• Read the full Credex assignment carefully
• Chose Next.js + TypeScript + Supabase stack
• Set up the project structure and dependencies
• Designed the audit engine architecture
• Implemented audit engine core files:
  • analyzer.ts
  • rules.ts
  • scoring.ts
  • constants.ts
  • Zod validation schemas
• Added pricing metadata and recommendation logic

What I learned:

• The assignment is more focused on product thinking and execution quality than pure coding
• Building deterministic recommendation logic is more important than using AI for everything

Blockers / what I'm stuck on:

• Finalizing the best scoring logic for optimization recommendations
• Deciding how aggressive savings recommendations should be

Plan for tomorrow:

• Build the multi-step audit form UI
• Add localStorage persistence
• Start integrating the audit engine with the frontend

Day 2 — 2026-05-09

Hours worked: 6

What I did:

• Built the multi-step audit onboarding flow
• Added categorized AI tool selection UI
• Implemented spend and usage input forms
• Added React Hook Form + Zod validation
• Added localStorage draft persistence
• Connected frontend flow with deterministic audit engine
• Built temporary client-side report generation flow
• Added dynamic report route using localStorage
• Redesigned onboarding UI with a more premium SaaS visual system
• Improved spacing, typography, card hierarchy, and progress stepper

What I learned:

• Product polish dramatically changes how the app feels
• Smaller onboarding widths improved focus and readability
• Deterministic rule systems are easier to debug and test than AI-generated recommendation flows

Issues encountered:

• Initially forgot to implement the /api/audit route which caused report generation failures
• Needed multiple UI refinement passes to avoid the default shadcn appearance
• Dynamic form synchronization with selected tools required careful state handling

Plan for tomorrow:

• Build the final audit results experience
• Add recommendation cards and optimization insights
• Improve mobile responsiveness
• Add lead capture flow
• Start implementing shareable public reports

Day 3 — 2026-05-10

Hours worked: 5

What I did:

• Connected onboarding flow directly with the deterministic audit engine
• Added client-side audit generation and local report persistence
• Implemented dynamic report routes using /report/[id]
• Built the final audit report experience with optimization scoring
• Added recommendation cards with severity indicators and estimated savings
• Added tool utilization breakdown cards
• Redesigned the entire UI using a premium dark SaaS visual system
• Integrated Stitch MCP generated design direction into the frontend
• Improved onboarding hierarchy, spacing, and navigation flow
• Added glowing CTA buttons, dark surfaces, and refined typography styling
• Added report copy-link flow and reusable stat cards

What I learned:

• Design systems create much stronger visual consistency than isolated component styling
• Small visual details like spacing, muted borders, and typography hierarchy dramatically improve perceived product quality
• Recommendation presentation matters as much as recommendation accuracy
• Stitch MCP helped accelerate premium UI exploration much faster than manual iteration alone

Issues encountered:

• Report routing initially failed because the /api/audit endpoint was never implemented
• Needed several refinement passes to avoid overusing gradients and glow effects
• Balancing dark theme contrast while maintaining readability required multiple adjustments
• The default Next.js landing page still needs replacement with a proper marketing homepage

Plan for tomorrow:

• Build the landing page at /
• Add marketing sections and product positioning
• Improve mobile responsiveness across report screens
• Add lead capture backend integration
• Start Supabase persistence integration
• Prepare for deployment and Lighthouse optimization

Day 4 — 2026-05-11

Hours worked: 7

What I did:

• Built a deterministic AI spend optimization engine
• Added reusable audit rule architecture
• Implemented overlap detection logic for AI tools
• Added seat overprovisioning and low-usage analysis
• Built dynamic optimization scoring system
• Connected audit engine to report generation flow
• Replaced hardcoded report data with live calculated results
• Added structured recommendation cards with severity and savings estimates
• Added realistic demo datasets for multiple startup profiles
• Improved TypeScript architecture and modularized business logic

What I learned:

• Deterministic systems are easier to maintain and debug than fully AI-generated outputs
• Separating business logic from UI greatly improves scalability
• Scoring systems need balanced penalties to avoid unrealistic outputs
• Dynamic reporting creates a much stronger product experience than static mock data

Issues encountered:

• Needed careful deduplication logic to avoid repeated recommendations
• Balancing optimization scores required multiple scoring adjustments
• Dynamic report rendering required stricter typing across components
• LocalStorage persistence needed synchronization with generated report IDs

Plan for tomorrow:

• Add public shareable report pages
• Add lead capture and email collection flow
• Improve mobile responsiveness across all pages
• Add onboarding refinements and report export preparation
• Begin deployment preparation and production cleanup

Day 5 — 2026-05-12

Hours worked: 5

What I did:

• Added Supabase persistence layer for generated audit reports
• Implemented database-backed public shareable reports
• Added report fetching with localStorage fallback support
• Created reports and leads database schema
• Added production-ready lead capture flow after recommendations
• Added report metadata including timestamps and company context
• Added overlap insight cards with conflict percentages
• Added confidence scoring to recommendation cards
• Improved mobile responsiveness across onboarding and report pages
• Added copy-share-link functionality
• Improved loading states, error handling, and fallback logic

What I learned:

• Public persistence dramatically changes how “real” a SaaS product feels
• Fallback architecture improves reliability during local development
• Recommendation confidence scores improved perceived intelligence significantly
• Mobile spacing and layout refinement takes longer than expected in SaaS UIs

Issues encountered:

• Needed dual localStorage + database fallback logic to avoid broken reports during setup
• Report hydration required careful async handling
• Mobile report layouts needed multiple spacing adjustments
• Supabase environment configuration required additional validation handling

Plan for tomorrow:

• Final production cleanup
• Lighthouse optimization
• Accessibility improvements
• OG image generation
• Final deployment
• Submission document preparation
• Demo polishing

Day 6 - 2026-05-13

Hours worked: 6

What I did:

• Implemented the /api/summary endpoint to generate personalized executive summaries using the OpenAI API.
• Engineered a deterministic fallback mechanism that seamlessly replaces the AI summary with programmatic text if the OpenAI API fails.
• Created the /api/leads route integrating the Resend SDK for transactional email delivery upon lead capture.
• Configured a strict CI pipeline enforcing npm run lint, npx tsc --noEmit, and npm test checks.
• Cleaned the codebase for production by removing non-essential debug logs and development comments.
• Resolved all Radix UI accessibility warnings in the component library by injecting visually hidden fallback titles.

What I learned

• Graceful Degradation: Relying purely on third-party APIs for critical UI text is risky. Implementing a fallback to the deterministic engine ensures the application remains highly available even during vendor outages.
• Spam Mitigation: Implementing a visually hidden honeypot field is a highly effective, frictionless method for reducing automated form submissions compared to implementing heavy third-party CAPTCHA scripts.

Issues encountered

• OpenAI Rate Limiting: Hit 429 Too Many Requests errors during consecutive testing phases. This caused unhandled promise rejections that crashed the local development server.
• Supabase Integration: Initial REST API fetch calls returned 404 Not Found due to malformed pathing (/rest/v1/rest/v1/reports).

What I improved

• Replaced the manual Supabase fetch implementation with the official @supabase/supabase-js SDK, immediately resolving the routing errors and improving type safety.
• Updated the AI summary error handling to intercept 429 status codes specifically, logging a clean warning and successfully routing the user to the deterministic fallback without throwing terminal stack traces.