Кейс 11 / 17 · Full-stack сайт · 2026
Node & Thought
Полнофункциональная платформа для технических статей, заметок и дискуссий с современным стеком и авторской системой контента.
- Время разработки: 16 дней
- Фич: 20+
- Строк кода: 35 000+
- Ролей: 4 уровня
Задача
Техническим авторам не хватает минималистичной, современной платформы для публикации статей с полноценным WYSIWYG-редактором, системой ролей, социальными функциями и красивым адаптивным UI без перегруженности legacy-интерфейсов.
Решение
Полнофункциональная платформа с rich-text редактором, ролевой системой (user → superadmin), голосованиями, опросами, достижениями, лидербордом, OG-превью для соцсетей и адаптивным дизайном с тремя темами.
Ключевое
Полный цикл контента · Социальная платформа · Геймификация · Production-deployed
Что сделано
- WYSIWYG редактор (TipTap): форматирование, код с подсветкой, drag & drop изображений, обложки, автосохранение
- Ролевая система (4 уровня): user, moderator, admin, superadmin с гранулярными правами
- Комментарии: вложенность, закрепление, редактирование, лайки/дизлайки, @упоминания с уведомлениями
- Голосование и карма: рейтинг статей и комментариев, система кармы авторов
- Опросы в статьях: встроенные голосовалки с анимированными результатами
- Система достижений: бронза/серебро/золото бейджи за активность, подписчиков, карму
- Лидерборд авторов: топ-20 по карме, подписчикам, статьям с пьедесталом
- Авторская аналитика: дашборд просмотров, кармы, графики по дням, топ статей
- Соавторство: несколько авторов на статью с отображением на странице
- Жалобы/репорты: кнопка на статьях и комментариях + очередь модерации в админке
- Кастомизация профилей: аватар, баннер, bio, соцсети (GitHub/Telegram/Twitter)
- Подписки и лента: follow/unfollow, персональная лента подписок
- Закладки, черновики, история чтения, серии статей
- Поиск по статьям, тегам, авторам с трендами
- Загрузка изображений с автоконвертацией в WebP (Sharp) и удалением оригиналов
- Три темы: светлая / тёмная / системная с анимированным переключателем
- OG-мета для соцсетей: динамические превью при шаринге статей и профилей
- Toast-уведомления: красивые всплывашки вместо alert()
- Адаптивный дизайн: mobile-first с bento-grid, скелетонами при загрузке
- reCAPTCHA v3 на регистрации, JWT-авторизация, admin-панель
Этапы
- Проектирование (2 дня) — Архитектура платформы, модель кармы и достижений, структура БД, TipTap конфигурация
- Backend (4 дня) — Express API, JWT auth, ролевая система (4 уровня), CRUD статей, комментарии, голосования
- Редактор и контент (3 дня) — TipTap WYSIWYG, подсветка кода, drag & drop изображений, обложки, автосохранение, серии
- Социальные функции (4 дня) — Карма, достижения, лидерборд, подписки, опросы, @упоминания, уведомления
- UI и деплой (3 дня) — 3 темы, OG-мета, адаптив, скелетоны, reCAPTCHA, админ-панель, деплой
Следующий проект: Rawly