22 days ago

Build a complete client-first PWA web app called "NeonScribe — The Viral Cast Creator". Requirements (must do all): - Client-only: NO backend required. Must work fully offline using localStorage/IndexedDB. - Framework: Next.js (App Router) + React + Tailwind CSS. - PWA ready: manifest.json, service worker (Workbox or equivalent), install prompt UI. - Pages: 1) /compose - 280-character composer with live char count - Voice-to-text using Web Speech API (with graceful fallback) - Emoji picker + basic formatting (bold, italic) - Image/GIF upload (drag & drop or file select) saved locally (IndexedDB preferred) - Live neon-styled preview card - "Download PNG" (high DPI) and "Download PDF" client-side export (html2canvas + jsPDF) - Ctrl/Cmd+Enter publishes/saves to local feed 2) /feed - Local timeline of saved casts (newest first) - Actions per cast: Edit, Duplicate, Delete, Download image, Copy text, Share via Web Share API - Search by text & hashtags 3) /profile - Edit local profile (name, avatar, bio) - Show stats: count of casts, downloads, local points (gamification: +1 cast, +2 downloads) - Export backup (zip JSON + images) client-side (jszip) - Offline behavior: Precache assets; offline fallback for feed/compose. - Accessibility: aria attributes, keyboard shortcuts (Publish, Search, Bold). - Themes: Neon Dark (default: #0ea5a1 primary, #ff4d6d accent) + Clean Light theme toggle. - Branding: small logo + onboarding modal explaining core features & shortcuts. - No API keys required; add optional commented instructions in README for adding serverless Farcaster posting in future. - Provide README with run & deploy steps, QA checklist, and "How to publish" instructions (both Windframe-host and export→Vercel flow). - Add simple unit tests for core local storage functions (Jest recommended). Output: - A complete Next.js app repo with app/, components/, public/, and a ready-to-deploy configuration. - A working preview URL (Windframe preview). - Option to export to GitHub repository and one-click deploy to Vercel. Make sure the generated app is fully functional without adding any API keys.

Fork

Windframe is an AI visual editor for rapidly building stunning web UIs & websites

Start building stunning web UIs & websites!

Build from scratch or select prebuilt tailwind templates