cloudflare/r2-explorer-template-9

cloudflare/r2-explorer-template-9

Language: TypeScript

Stars: 1

Forks: 1

Open issues: 1

Created: 2025-09-30T17:44:42Z

Pushed: 2026-04-23T20:56:48Z

Default branch: main

Fork: no

Archived: no

README:

R2-Explorer App


!R2 Explorer Template Preview

R2-Explorer brings a familiar Google Drive-like interface to your Cloudflare R2 storage buckets, making file management simple and intuitive.

Key Features

• 🔒 Security
• Basic Authentication support
• Cloudflare Access integration
• Self-hosted on your Cloudflare account

• 📁 File Management
• Drag-and-drop file upload
• Folder creation and organization
• Multi-part upload for large files
• Right-click context menu for advanced options
• HTTP/Custom metadata editing

• 👀 File Handling
• In-browser file preview
• PDF documents
• Images
• Text files
• Markdown
• CSV
• Logpush files
• In-browser file editing
• Folder upload support

• 📧 Email Integration
• Receive and process emails via Cloudflare Email Routing
• View email attachments directly in the interface

• 🔎 Observability
• View real-time logs associated with any deployed Worker using wrangler tail

> [!IMPORTANT] > When using C3 to create this project, select "no" when it asks if you want to deploy. You need to follow this project's setup steps before deploying.

Getting Started

Outside of this repo, you can start a new project with this template using C3 (the create-cloudflare CLI):

npm create cloudflare@latest -- --template=cloudflare/templates/r2-explorer-template

A live public deployment of this template is available at https://demo.r2explorer.com

Setup Steps

1. Install the project dependencies with a package manager of your choice:

npm install

2. Create a R2 Bucket with the name "r2-explorer-bucket":

npx wrangler r2 bucket create r2-explorer-bucket

3. Deploy the project!

npx wrangler deploy

4. Monitor your worker

npx wrangler tail

Next steps

By default this template is readonly.

in order for you to enable editing, just update the readonly flag in your src/index.ts file.

Its highly recommended that you setup security first, learn more here.