Website
https://the-tldr-app.vercel.app/
Inspiration
Our motivation for tldr came from a simple gap: one file in, many formats out—without juggling scripts or SaaS. Students, creators, and teams often need the same content as text, summary, audio, and visuals for accessibility and repurposing. Existing tools are either single-purpose or lock you into cloud pipelines and API keys. We set out to build a modular, local-friendly workflow that can run with real APIs or mock data during development, so you can demo and iterate fast while keeping control over your content.
What it does
PDF/Text Ingestion
- Upload a PDF or paste raw text.
- Extract clean text and metadata (title, page count, size).
Summarization & Structuring
- Generate a concise summary plus key points and sections (JSON).
- Return a cleaned, exportable text version for downstream use.
Multi-Output Distribution
- Produce multiple outputs from the same input:
- Summary JSON (for workflows)
- Readable PDF (formatted summary/notes)
- Plain text (copy/paste ready)
- (Optional, pluggable) Audio (MP3) via a TTS adapter when enabled
Dev/Mock Mode
- Run end-to-end with fake data (no API key) to test UI/UX, loading states, and pipelines before wiring real providers.
- All processing uses a modular pipeline, so you can enable/disable stages (e.g., TTS, image generation) without touching the rest of the system.
How we built it
- Frontend: Next.js + React, Tailwind CSS; polished UI with tabs for Upload File and Paste Text and a lightweight title animation.
- Backend: Next.js API Routes (Node) orchestrating the pipeline.
- Parsing: pdf-parse for text extraction.
- AI (summarization): Google Gemini (e.g., gemini-2.5-flash) or a MockSummarizer for keyless local development.
- Build/Tooling: TypeScript, ESLint, npm scripts for dev/build.
Key Implementation Details
- Local-First Dev Experience: Mock provider layer mirrors real responses, letting you test the full UI without secrets.
- Pipeline Orchestrator: Stages (ingest → extract → summarize → export) use stable interfaces so new outputs drop in cleanly.
- Error Handling & Logs: Structured error objects per stage; surfaced to the UI with human-readable messages and dev logs.
- Simple Setup: Clone→ npm install → npm run dev. Add a .env.local only when you’re ready to swap mock for real AI.
- Exporters: Helpers to render JSON, TXT, and a print-ready PDF of the summary.
Challenges we ran into
- Large Files & Memory Handling multi-MB PDFs required chunked reads and careful extraction to avoid timeouts.
- Provider Variability Token limits and prompts differ; we added guards and fallbacks to keep outputs consistent.
- UI Simplicity Exposing multiple outputs without clutter—tabs, progress states, and clear “what happened” logs were key.
- Mock Parity Making mock outputs realistic enough to catch layout/edge cases before turning on real APIs.
Accomplishments that we’re proud of
- One-Input, Many-Outputs UX A clean, predictable flow that turns a single upload into structured JSON, readable text, and a printable PDF.
- Mock-First Reliability Full demo capability with no API keys, including loading states, retries, and error paths.
- Modular Extensibility Drop-in adapters for TTS, image generation, or streaming without refactoring the core.
- Polished Frontend Fast, accessible UI with clear tabs, responsive layout, and a small title animation that doesn’t get in the way.
What we learned
- Prompt & Schema Co-Design A strict output schema (summary + bullets + sections) makes downstream renderers trivial.
- Developer Experience Matters A realistic mock layer accelerates iteration, onboarding, and demos—no blocked work due to missing keys.
- Separation of Concerns Keeping ingestion, extraction, summarization, and export isolated pays off when adding new outputs.
- Accessibility from Day One Multiple formats (PDF/text/audio) aren’t extras; they’re table stakes for real users.
What’s next for tldr
- Audio Pipeline (TTS) Generate MP3 summaries with pluggable providers; add voice presets and speaking-rate controls.
- Visual Summaries Auto-generate keyframe slides or infographic images from the structured JSON.
- Streaming & Queues Support long files with streaming progress, background jobs, and resumable uploads.
- Share & Integrations One-click share links, plus exports to Google Drive/Notion; simple webhook to drop JSON into other apps.
Built With
- googlegenai
- next.js
- tailwindcss
- typescript



Log in or sign up for Devpost to join the conversation.