Read and display your WhatsApp chat exports locally. Drop a
.zipor.txtfile to view conversations in a familiar chat layout. Nothing uploads. Everything runs in your browser.
Live Demo — wasapx.vercel.app
- 100% Client-Side — All parsing and rendering happens in your browser. No data leaves your device.
- ZIP & TXT Support — Drop a
.zip(with media) or plain.txtfile exported from WhatsApp. - Media Preview — Images, videos, audio, and PDFs from ZIP exports are displayed inline.
- Date Range Filter — Filter conversations by date or date range with a calendar picker.
- Dark Mode — Supports light, dark, and system themes.
- Large File Support — Handles exports up to 5 GB (with zip-bomb protection).
- Responsive — Works on desktop, tablet, and mobile browsers.
- iOS & Android — Supports both WhatsApp export formats.
- Export a chat from WhatsApp (Settings → Chats → Export Chat).
- Open WasapX in your browser.
- Drag and drop (or browse) the
.zipor.txtfile. - View your conversation in a familiar chat layout.
- No data is uploaded to any server.
- No cookies, no accounts, no sign-in.
- All parsing and rendering happens locally in your browser.
- Media files from ZIP exports are loaded as in-memory blob URLs.
| Category | Technology |
|---|---|
| Framework | Next.js 16 (App Router) |
| UI | React 19, Tailwind CSS 4, shadcn/ui |
| Icons | Lucide |
| ZIP Extraction | JSZip |
| Date Utilities | date-fns, react-day-picker |
| Theming | next-themes |
| Analytics | Vercel Analytics |
# Clone the repository
git clone https://github.com/shahrulestar/wasapx.git
cd wasapx
# Install dependencies
pnpm install
# Start the development server
pnpm devOpen http://localhost:3000 to see the app.
pnpm build
pnpm startwasapx/
├── app/
│ ├── layout.tsx # Root layout, metadata, fonts
│ ├── page.tsx # Home page (upload + chat viewer)
│ ├── globals.css # Global styles
│ ├── robots.ts # robots.txt generation
│ └── sitemap.ts # Sitemap generation
├── components/
│ ├── chat-bubble.tsx # Individual message bubble
│ ├── chat-header.tsx # Chat view header
│ ├── chat-viewer.tsx # Main chat display
│ ├── date-range-filter.tsx # Date filtering UI
│ ├── file-upload.tsx # Drag-and-drop file upload
│ ├── theme-provider.tsx # Theme context provider
│ ├── theme-toggle.tsx # Light/dark/system toggle
│ └── ui/ # shadcn/ui primitives
├── lib/
│ ├── parse-chat.ts # Chat parsing & ZIP extraction
│ └── utils.ts # Utility helpers
└── public/
├── llms.txt # LLM-friendly project description
└── og.png # Open Graph image
| Platform | .txt |
.zip (with media) |
|---|---|---|
| WhatsApp iOS | Yes | Yes |
| WhatsApp Android | Yes | Yes |
The easiest way to deploy WasapX is with Vercel:
This project is open source. See the LICENSE file for details.