Case 11 / 17 · Full-stack website · 2026

Node & Thought

A full-featured platform for technical articles, notes and discussions, built with a modern stack and an author-driven content system.

https://news.xroyse.ru

  • Development time: 16 days
  • Features: 20+
  • Lines of code: 35,000+
  • Roles: 4 levels

Challenge

Technical writers lack a minimal, modern platform for publishing articles with a proper WYSIWYG editor, a role system, social features and a clean responsive UI without the clutter of legacy interfaces.

Solution

A full-featured platform with a rich-text editor, a role system (user → superadmin), voting, polls, achievements, a leaderboard, OG previews for social networks and a responsive design with three themes.

Highlights

Full content lifecycle · Social platform · Gamification · Production-deployed

What was built

  • WYSIWYG editor (TipTap): formatting, highlighted code, drag & drop images, covers, autosave
  • A 4-level role system: user, moderator, admin, superadmin with granular permissions
  • Comments: nesting, pinning, editing, likes/dislikes, @mentions with notifications
  • Voting and karma: article and comment ratings, an author karma system
  • Polls in articles: embedded votes with animated results
  • Achievements: bronze/silver/gold badges for activity, followers and karma
  • An author leaderboard: top 20 by karma, followers and articles, with a podium
  • Author analytics: a dashboard of views and karma, daily charts, top articles
  • Co-authoring: several authors per article, shown on the page
  • Reports: a button on articles and comments plus a moderation queue in the admin panel
  • Profile customisation: avatar, banner, bio, socials (GitHub/Telegram/Twitter)
  • Follows and feed: follow/unfollow, a personal feed of followed authors
  • Bookmarks, drafts, reading history, article series
  • Search across articles, tags and authors, with trends
  • Image uploads auto-converted to WebP (Sharp) with originals removed
  • Three themes: light / dark / system, with an animated toggle
  • OG meta for social networks: dynamic previews when sharing articles and profiles
  • Toast notifications: neat pop-ups instead of alert()
  • Responsive design: mobile-first with a bento grid and loading skeletons
  • reCAPTCHA v3 on sign-up, JWT auth, an admin panel

Stages

  1. Design (2 days) — Platform architecture, the karma and achievements model, DB structure, TipTap configuration
  2. Backend (4 days) — Express API, JWT auth, a 4-level role system, article CRUD, comments, voting
  3. Editor and content (3 days) — TipTap WYSIWYG, code highlighting, drag & drop images, covers, autosave, series
  4. Social features (4 days) — Karma, achievements, leaderboard, follows, polls, @mentions, notifications
  5. UI and deployment (3 days) — 3 themes, OG meta, responsiveness, skeletons, reCAPTCHA, admin panel, deployment

Next project: Rawly