React + Tailwind CSS + RSBuild Boilerplate

YuMusic showcase and release webhook

The showcase uses fresh, unaltered PNG screenshots captured with Tauri MCP from the running YuMusic developer instance on 2026-11-02. The example is 1% Low Battery Girl by Sān-Z. Desktop captures are 1440 × 900; compact captures are the same desktop app resized to 430 × 900, not Android emulator screenshots. Files live in public/images/yumusic/ with -desktop and -mobile suffixes. The hero layers fresh home-desktop.png and home-mobile.png captures. The fullscreen player appears in the synced lyrics section; the transfer illustration uses the track's original cover art in low-battery-girl-cover.jpg.

/yumusic showcases YuMusic and loads download metadata through GET /api/yumusic/releases/latest. All seven download formats link directly to Forgejo release assets: EXE, MSI, AppImage, DEB, RPM, Flatpak, and APK. There are no bundled release links and no rebuild is needed for new releases.

Production uses the TypeScript Bun server: bun run build followed by bun run start (port 3000, or PORT). The existing Docker command uses this server too. Route /api/* and /webhooks/* through to this server alongside the website; static-only hosting cannot receive webhooks.

Configure the Forgejo webhook as follows:

• URL: https://yumeo.dev/webhooks/yumusic/release
• Method: POST; content type: application/json.
• Trigger after the successful publishing job, once all assets are attached.
• Set the webhook's Secret and the server's YUMUSIC_WEBHOOK_SECRET environment variable to the same value. Keep it server-side; do not use a frontend env prefix.
• Signatures use Forgejo's X-Forgejo-Signature HMAC-SHA256 header.

An authenticated POST triggers a fresh lookup of this repository's latest release. The payload is only a notification; it cannot supply download URLs. Success returns 200 with { "updated": true, "version": "…" }; an unavailable upstream returns 502 so delivery can be retried. Missing server configuration returns 503; missing or invalid signatures return 401.

Release metadata is cached in memory for five minutes, invalidated immediately by the webhook, and fetched on demand after restart or expiry. This also recovers from missed webhook deliveries. Failed refreshes clear the cache and show the page's retry state. The development server proxies the metadata endpoint directly to Forgejo; test webhook behavior with bun run start.

Run bun test server.test.ts for cache, authentication, refresh, and outage tests. Signature format: Forgejo webhook documentation.

A minimal, high-performance React boilerplate featuring TanStack Router, ShadCN, Tailwind CSS v4, Biome, and RSBuild.

This boilerplate is designed to be as lightweight and unopinionated as possible, allowing you to quickly start developing and deploying React applications with modern tooling.

🚀 Features

• ⚡ Blazing Fast – Optimized for performance with RSBuild.
• 🔄 Fast Refresh – Instant feedback during development.
• 🏗️ React 19 – The latest version of React.
• 📂 Routing & Lazy Loading – Efficiently load routes on demand.
• 🎨 Tailwind CSS v4 – Fully styled with utility-first CSS.
• 🛠 ShadCN/UI – Beautifully designed components.
• 🔒 TypeScript – Fully typed for safety and productivity.
• 🗺 Typesafe Navigation – Ensuring safe route handling.
• 🔀 Hybrid Routing – Mix file-based and code-based routing.
• 🧹 Biome for Formatting & Linting – Ensures clean and consistent code.

📦 Installation

Clone the repository and install dependencies:

$ git clone https://github.com/mohmmedraad/TanStacked.git && cd TanStacked && pnpm install

🔧 Development

Copy .env.example to .env or .env.local:

$ cp .env.example .env

Start the development server:

$ pnpm dev

🏗️ Build

Generate a production-ready build:

$ pnpm build

🚀 Deployment

Deploying to Vercel

1. Push your code to a Git repository (GitHub, GitLab, or Bitbucket).
2. Go to Vercel and create a new project.
3. Import your repository.
4. In the Build and Output Settings, set the Output Directory to dist.
5. Click Deploy and your project will be live!

🔗 Useful Links

• React
• TanStack Router
• RSBuild
• Tailwind CSS
• ShadCN/UI
• Biome
• Vercel

---

This boilerplate is your foundation for fast, modern, and scalable React applications. Happy coding! 🎉