Cloudmark

中文文档

Introduction

Cloudmark is a universal cloud bookmark management tool that allows you to easily save and access your bookmarks from anywhere. No login or registration required — create a collection ID (mark) plus a secret write token, install the bookmarklet, and start saving pages.

Try it online: https://cloudmark.site/

Key Features

• 🔑 No Registration: Access your collection with a unique mark; writes require a write token
• 🔖 One-Click Save: Bookmarklet embeds mark + write token
• 🏷️ Category Management: Custom categories for organization
• ⌨️ Keyboard-first: / search, j/k navigate, n/e/d CRUD, ? help
• 📋 High density: Compact list with instant filter / sort
• 🎨 Custom icons: Emoji, letter marks, or upload SVG/ICO/PNG
• 🌐 Cross-Device Access: Read anywhere; copy the write token to another device to write
• 📝 Detailed Descriptions: Optional notes per bookmark
• 🌍 Multi-Language Support: English and Chinese
• 🗄️ Cloudflare D1: Relational storage on the edge

Security Model

Capability	Requirement
View collection	Know the mark (URL)
Add / edit / delete	Valid write token for that mark
Bookmarklet save	mark + token query params

• Write tokens are hashed (SHA-256) in D1; plaintext is only stored in the browser (localStorage) and in the bookmarklet.
• Rate limits and field length limits protect against abuse.

Quick Start

1. Visit https://cloudmark.site/doc
2. Generate a mark and write token (or customize the mark)
3. Drag the bookmarklet to your browser bookmarks bar
4. Click the bookmarklet while browsing to save pages
5. Open https://cloudmark.site/your-mark to manage bookmarks

Local Development

Prerequisites

• Node.js 20+ and pnpm
• Cloudflare account (for preview and deployment)

Install Dependencies

pnpm install

D1 setup

1. Create a D1 database:

pnpm exec wrangler d1 create cloudmark

2. Put the returned database_id into wrangler.jsonc → d1_databases[0].database_id.

3. Apply migrations:

# local (Miniflare)
pnpm db:migrate:local

# production
pnpm db:migrate:remote

Development Mode

pnpm dev

Visit http://localhost:3000.

Local Preview with Cloudflare

pnpm db:migrate:local
pnpm preview

Build and Deploy

One-click deploy (creates a Cloudflare Worker from this repo):

Or from your machine:

pnpm db:migrate:remote
pnpm run deploy

After the first deploy, set d1_databases[0].database_id in wrangler.jsonc (or via the dashboard) and run migrations.

Cloudflare Configuration

D1 Database

"d1_databases": [
  {
    "binding": "DB",
    "database_name": "cloudmark",
    "database_id": "your-d1-database-id",
    "migrations_dir": "migrations"
  }
]

Environment Variables

• BASE_URL — public site URL in Worker vars (optional; client uses current origin)

Technology Stack

• TypeScript 7 — language
• React + Vite — SPA frontend
• Hono — Worker API
• Cloudflare Workers — hosting (@cloudflare/vite-plugin)
• Cloudflare D1 — primary data store
• Tailwind CSS + shadcn/ui — styling

License

This project is open-sourced under the AGPL-3.0 license.

Contributing

Issues and Pull Requests are welcome!

1. Fork the project
2. Create your feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add some amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

Contact

If you have any questions, please contact us through GitHub Issues.