Full-Stack Next.js Developer: Production Audit & Deployment for AI Voice-Heirloom Platform

⚠️ IMPORTANT: Please start your application proposal with the exact phrase "Live Audio Sync" so I know you have meticulously read this entire scope. Automated AI or bot applications that omit this will be immediately declined. 📋 Project Overview We have built a fully functional, highly intentional digital voice-heirloom platform designed to help adult children preserve their senior parents' life stories through automated text prompts, voice recordings, and real-time AI transcription. The application is currently operating as a clean, responsive Minimum Viable Product (MVP) built on Next.js (App Router) and Tailwind CSS, hosted within a Rocket.new cloud environment. The core engineering foundations are completely written and connected in sandbox/test mode (Version 51). We are looking for an experienced, senior full-stack developer to perform a comprehensive production audit, implement robust edge-case error handling, transition our sandbox integrations to live production environments, and deploy the application to a custom public domain. The platform helps families preserve memories, and our target project runway budget is capped at $2,000, which we intend to manage transparently via controlled weekly hour limits or structured milestone targets. 🛠️ The Tech Stack You Will Be Handling Frontend & Framework: Next.js (App Router), React, TypeScript, Tailwind CSS State & Syncing: WebSockets (for real-time dashboard updates) Database & Cloud Storage: Supabase (PostgreSQL database + Cloud Storage Buckets) Third-Party API Gates: Stripe Checkout (Subscriptions), OpenAI API (Whisper-1 Audio Model), and Twilio API (SMS dispatch) 🎯 Scope of Work & Milestone Deliverables You will be handed a fully compiled codebase. Your responsibility is to audit, polish, and launch the application based on the following explicit structural modules: 🔒 Core Quality & Security Standards (Applies Across All Milestones) Data Privacy & Encryption: Ensure all user information, metadata, and uploaded voice recording blobs are securely handled, private, and fully encrypted both in transit and at rest within our Supabase storage buckets. End-to-End Functionality: Perform rigorous testing to guarantee that every single client-side button, form submission, and interactive state triggers its intended backend response without sluggishness or silent failures. Flawless Communication Gates: Verify that transactional SMS dispatches (via Twilio) and fallback account communication flows arrive instantly, render beautifully on mobile devices, and log success states accurately in the database. API Stability: Ensure external integrations with Stripe, OpenAI, and Twilio perform reliably under various user scenarios with zero fatal application crashes. Milestone 1: Payment Gateway & Onboarding Audit Audit the existing Stripe Checkout redirect routing (/pricing). Ensure the transaction flow handles successful payments securely and routes users cleanly to the account setup panel (/buyer-auth) with the proper transaction payloads (session_id). Verify our fallback environmental guardrails: if server keys are ever missing, the application must catch the error gracefully and display our custom UI warning banner instead of throwing a fatal 500 crash. Milestone 2: Audio Recording & Time-Cap Logic (/record/[session-id]) Audit the passwordless magic link entry logic that allows senior parents to access their recording canvas natively via mobile browsers. Verify the browser microphone hardware handshakes and ensure that permission denials trigger user-friendly instructional text. Enforce and test our 15-minute (900-second) hard recording cap via MediaRecorder. When the countdown timer reaches 00:00, the microphone stream must automatically halt and trigger the asynchronous upload pipeline so no data is lost. Verify the UI states during recording: ensure the font color dynamically transitions to our branding accent token (Baked Terracotta #A84627) when fewer than 60 seconds remain. Milestone 3: Real-Time AI Processing & WebSocket Sync Engine Audit the multi-part FormData server route (/api/transcribe/route.ts) sending raw audio data to the OpenAI gateway using the whisper-1 model parameter. Ensure the transcribed text string smoothly overwrites database placeholders in Supabase. Test and bulletproof the WebSocket communication channels: when a parent saves a recording on mobile, the open adult child /dashboard on another device must instantly trigger a toast notification and render the fresh transcript without requiring a browser page refresh. Verify sequential progression logic: once a chapter is completed, the system must unlock or advance the parent's mobile view to the next chronological prompt in our 40-milestone queue. Milestone 4: Frontend Theme Compliance & Data Portability Audit the global UI styling to ensure 100% adherence to our brand identity design tokens: Soft Cream backgrounds, Espresso headers/text, and Baked Terracotta action elements. Ensure all remaining code fragments or layouts referencing an old physical gift box or its old pricing text have been completely muscle-scrubbed from src/app/page.tsx. Confirm our updated "Live Family Dashboard" digital card (with the 📱 Digital Portal badge) renders flawlessly across responsive breakpoints. Test the client-side archive exporter on the dashboard sidebar: verify it successfully compiles and downloads a portable, local .ZIP folder containing both the raw high-fidelity audio files and clean text transcript copies. Milestone 5: Production Environmental Sync, Webhooks & Launch Migrate all configuration variables from sandbox/test mode to our live production keys securely (Stripe, OpenAI, Twilio, and Supabase). Set up and test Stripe Webhooks to listen for backend subscription events (e.g., failed renewals, cancellations) to automatically sync account status changes in the database. Deploy the production-grade application to our live custom domain, optimizing mobile page speeds and confirming SSL certification stability. 🧳 Ideal Candidate Profile Next.js Expert: Deep understanding of server-side vs. client-side rendering, App Router design patterns, API route optimization, and environment variable management. AI Integration Experience: Proven experience interfacing with OpenAI APIs (specifically Whisper or audio streams) and handling binary/blob data uploads. Stripe Guru: Experience handling Stripe Checkout subscription lifecycles, webhook routing, and multi-tier access permissions. Clean UI/UX Detail: Detail-oriented with Tailwind tokens. You care deeply about responsive layout structures and matching pixel-perfect brand identities. 🚀 How to Apply Please provide a brief, direct summary of your experience with Next.js, OpenAI audio integrations, and Stripe webhooks. Let us know if you have any questions regarding the architectural modules outlined above. We are looking to kickoff this milestone-based contract immediately!