Universal File Explorer

Browser-native file inspection. Drop any file and instantly explore contents, metadata, structure, and bytes — 100% local, no server, no uploads.

---

Features

Category	Details
Formats	ZIP, EXE/DLL (PE), SQLite, JSON, PNG/JPEG/GIF, PDF, TXT/source code, Unknown binary
Detection	Magic byte signatures, extension cross-check, mismatch warning
Hex Viewer	Virtual scrolling, text/hex search, jump to offset, byte selection
Hashes	MD5, SHA-1, SHA-256, SHA-512 — copy buttons, computed in background
ZIP	Browse entries, preview text files, download individual files
PE (EXE/DLL)	Headers, sections + entropy, imports/exports tree, security flags, strings
SQLite	Table browser with search and pagination, schema viewer
JSON	Collapsible tree, Monaco raw view, structure stats
Images	Full preview, EXIF data, GPS coordinates, camera info
PDF	Version, page count, metadata, encryption status

---

Quick Start

git clone https://github.com/your-org/universal-file-explorer
cd universal-file-explorer
npm install
npm run dev
# Open http://localhost:3000

Production

npm run build && npm start

---

Architecture — Plugin System

Every file format is a self-contained plugin in src/plugins/<type>/index.ts.

// Each plugin implements this interface:
interface FilePlugin {
  id: string;
  name: string;
  extensions: string[];
  detect(buffer: ArrayBuffer, filename: string): boolean;
  parse(buffer: ArrayBuffer, filename: string, id: string): Promise<ParsedFile>;
  getSidebar(parsed: ParsedFile): SidebarItem[];
  renderView(itemId: string, parsed: ParsedFile): ReactNode;
}

Adding a new format

1. src/plugins/myformat/index.ts — implement FilePlugin
2. src/plugins/registry.ts — register it before unknownPlugin
3. src/components/viewers/MyView.tsx — build the viewer
4. src/components/layout/MainViewer.tsx — add a route

---

Project Structure

src/
├── app/               # Next.js App Router entry
├── components/
│   ├── layout/        # TopNav, Sidebar, FileExplorer, MainViewer, SettingsPanel
│   ├── viewers/       # HexViewer, HashPanel, TextViewer, ZipBrowserView, SqliteView, PEView, ImageView, JsonView, PdfView, MetadataPanel, OverviewView
│   ├── dropzone/      # DropZone
│   └── common/        # VirtualList, CopyButton
├── plugins/           # zip, pe, sqlite, image, pdf, json, txt, unknown, registry, types
├── lib/               # detection, hashing, hex-utils, utils
└── store/             # fileStore (Zustand)

---

Tech Stack

Next.js 16 · React 19 · TypeScript 5 · Tailwind CSS 4 · Framer Motion · Monaco Editor · Zustand · JSZip · sql.js · exifr · SparkMD5

---

Privacy

All processing is local. Files are read as ArrayBuffer in-browser and never transmitted anywhere.

---

License

MIT