skills.rest
memoirlabs
memoirlabsOFFICIAL
Explore all skills by this author →
WebsiteGitHub

bun-dev-server

Set up a Bun development server with hot reload and WebSocket HMR.

6|Updated Mar 26, 2026
Search Tags:#typescript#react#dev server#bun#hono#hot reload#hmr
One-click install
npx skills add https://github.com/memoirlabs/mog --skill bun-dev-server-memoirlabs
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: bun-dev-server
Source: https://github.com/memoirlabs/mog/tree/main/.agents/skills/bun-dev-server
Command: npx skills add https://github.com/memoirlabs/mog --skill bun-dev-server-memoirlabs

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

It removes slow, repetitive development loops by giving you a reliable Bun-based dev server setup with Hot Module Replacement (HMR) and React Fast Refresh-style reloads.

Core Features & Use Cases

  • Hot-reload capable dev server: Starts a Bun.serve server with a WebSocket endpoint for client-side reload signals.
  • SPA routing + static file serving: Serves public/index.html for frontend routes and serves other static assets directly.
  • Framework-oriented wiring (React/API/Full-stack): Guides setup for React frontends, Hono API servers, or combined full-stack projects.
  • Practical file watching: Watches source changes (e.g., TSX) and notifies connected clients to refresh.

Quick Start

Ask the skill to set up a Bun development server with HMR for your React app, then use it to create server.ts, public/index.html, and your src entry files so edits trigger browser reloads.

Frequently Asked Questions about bun-dev-server

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set up a Bun dev server with hot reload for a React app?▼

To set up a Bun dev server with hot reload, configure Bun.serve with a WebSocket endpoint and file watcher to notify browsers of source changes. This provides fast refresh-style reloads for React frontends and live updates for API backends.

Does Bun support Hot Module Replacement for Hono API backends?▼

Yes, Bun supports hot reload for Hono API backends by using file watching to detect source changes and pushing refresh notifications through a WebSocket endpoint, eliminating slow development loops.

Can I serve both static frontend assets and API routes from a single Bun development server?▼

You can serve both static assets and API routes from a single Bun development server. It serves public/index.html for SPA frontend routing while simultaneously handling live reload for full-stack web applications.

What is the best way to get fast refresh-style reloads when using Bun for web development?▼

The best way to achieve fast refresh-style reloads with Bun is implementing an HMR WebSocket endpoint paired with practical file watching. This setup triggers immediate browser refreshes upon detecting TSX or source file modifications.

Why do I need a WebSocket endpoint for HMR in a Bun dev server setup?▼

A WebSocket endpoint is required for HMR in a Bun dev server to maintain a persistent connection with the browser, allowing the server to push deterministic reload notifications instantly when file watchers detect source changes.

Are there limitations to using Bun.serve for SPA routing in development?▼

Using Bun.serve for SPA routing in development is scoped specifically to the dev workflow, serving public/index.html for frontend routes and static assets directly, but it does not handle production-level server configuration.

Related Skills

Explore More Software Engineering Skills→
zomeruzomeru

bun

Automates JavaScript/TypeScript builds, tests, and installs with Bun's native tools.

Community
Advanced
theultimateshyamtheultimateshyam
1

website-builder

Orchestrate an agent pipeline to build a Next.js static website from assets or specs.

Community
Advanced
vietlinhh02vietlinhh02

Next.js

Build full-stack React applications with Next.js App Router and Server Components.

Community
Intermediate
veryfrontveryfront
9

veryfront

Build full-stack TypeScript and React applications with real-time error handling and route previewing.

Official
Advanced