Создание SharePad: заметки по одной ссылке без регистрации

Почему я решил сделать SharePad

Когда мне нужно было поделиться заметками с коллегами, я столкнулся с проблемой: в Slack таблицы ломались, код терял отступы, а чек-листы превращались в символы. Ссылка на Notion требовала регистрации, Google Docs — доступ к аккаунту. Я хотел одну ссылку, несколько страниц, поддержку Markdown и возможность редактировать позже. Так родился SharePad — сервис для обмена заметками по одной ссылке без регистрации.

Как работает SharePad

SharePad — это минималистичный сервис, который позволяет создавать многостраничные заметки в Markdown и делиться ими по ссылке. Вместо аккаунтов используется токен владельца. Вы получаете две ссылки: ссылка для просмотра (например, /n/kitchen-reno) и ссылка для редактирования (/e/{секретный-токен}). Токен — это 32 случайных байта, хэшированные через SHA-256 и хранящиеся в базе. Он показывается один раз и служит вашей идентификацией.

Основные возможности

• Создание заметки за 10 секунд: переходите на /quick, вставляете Markdown, получаете ссылку.
• Многостраничные блокноты с навигацией по боковой панели.
• Выбор своего адреса: например, sharepad.in/n/kitchen-reno.
• Два уровня доступа: просмотр и редактирование.
• Защита паролем, срок действия, режим «сжечь после прочтения».
• Вставка скриншотов прямо в редактор.
• Экспорт в PDF с печатной версией.

Технологический стек

Вот основные компоненты, которые я использовал:

• Next.js 16 — серверные компоненты для загрузки, клиентские для редактора.
• Supabase Postgres — хранение данных, RLS включён, но записи только через сервер.
• Tailwind CSS 4 — стили, имитирующие бумагу.
• Cloudflare R2 — хранение изображений с нулевой стоимостью исходящего трафика.
• PostHog — аналитика с ограничениями.
• GitHub Actions — cron-задачи для пинга и очистки.

Модель владения без аккаунтов

Вместо таблицы пользователей — токены. При создании блокнота генерируется токен, хэшируется и сохраняется. Просмотр доступен по ссылке, редактирование — только по токену. Пароль для просмотра устанавливается через bcrypt и хранится в httpOnly cookie. Токен никогда не передаётся в URL при просмотре.

Редактор и его особенности

Редактор — это textarea и предпросмотр. Ключевые детали:

• Синхронизация прокрутки между панелями.
• Кнопки тулбара участвуют в undo/redo через document.execCommand('insertText').
• Tab вставляет отступы, Shift+Tab удаляет.
• Версии страниц: хранится последние 10 черновиков.
• Шаблоны страниц для заметок, планов и т.д.

Работа с изображениями

При вставке изображение сжимается в браузере (WebP, 1600px), загружается в R2, а ссылка вставляется в Markdown. Ограничения: 5 МБ после сжатия, 50 изображений на блокнот, 60 загрузок на IP за 10 минут. Была проблема с большими файлами — Node fetch использовал chunked transfer, а R2 требовал Content-Length. Решение — добавить заголовок.

headers: {
  'Content-Type': contentType,
  'Content-Length': String(body.byteLength),
  'Cache-Control': 'public, max-age=31536000, immutable'
}

Безопасность HTML в Markdown

SharePad рендерит HTML внутри Markdown, но обязательно санитизирует его. Это критично, потому что при открытом редактировании любой посетитель может вставить скрипт, который выполнится в браузере владельца, где хранится токен. Поэтому все скрипты и опасные теги удаляются.

Срок действия и очистка

Блокноты по умолчанию живут 10 дней. После истечения ссылки для просмотра возвращают 404, но владелец может продлить срок через ссылку редактирования. Через три дня запись удаляется из базы. Это даёт время на случай, если вы передумали.

Практический вывод

Если вы часто делитесь заметками и устали от регистраций, попробуйте SharePad — он бесплатный и без аккаунтов. А если хотите создать свой инструмент, берите идею токенов вместо аккаунтов и не забывайте о санитизации. Начните с малого: сделайте простую страницу, которая принимает Markdown и отдаёт ссылку. Удачи!