Development

ludicord dev runs the Activity client, auth endpoints, API routes, WebSocket routes, and development diagnostics as one process. Its output names Ludicord—not the underlying compiler configuration—so developers work at the framework level.

#Start the server

1npm run dev

Useful direct options include:

1ludicord dev --port 3100 --host 0.0.0.0 --open
2ludicord dev --debug
3ludicord dev --no-hmr

Use --debug only when diagnosing framework-level behavior because it produces more runtime detail.

#Know what hot-updates

Configuration and environment changes restart because they can alter the port, host, secrets, route security, and transport limits. Ordinary feature code should never require a manual server restart.

#Read compile output

The terminal reports paths and timing with messages such as:

1compiling app/embeds/home/embed.tsx...
2compiled app/embeds/home/embed.tsx (42ms)

Warnings and errors point to the source file you own. The runtime avoids presenting Vite or an internal configuration file as the product interface.

#Use the browser error panel

During development, a blocking client error opens the Ludicord panel over the Activity. It contains:

• the error message and Ludicord code when available;
• the mapped project source file, line, and column;
• a readable source frame with the failing line emphasized;
• the component or runtime stack when useful;
• reload, dismiss, and copy controls;
• navigation between multiple current errors.

The JSON response { "error": "LUDICORD_DEV_ERROR" } is a fallback for a request that cannot render the panel. If you see only that response on the main Activity page, inspect the terminal for the first compile error and confirm the browser is loading the client route, not an API URL.

#Fix from the first signal

1. Read the first mapped project frame, not the longest stack.
2. Fix syntax and import errors before runtime symptoms.
3. Confirm the convention filename and directory.
4. Check the terminal for an API or WebSocket error that cannot render in React.
5. Save once and wait for the compile result before restarting anything.

#React Hook lint

The generated package.json keeps only dev, build, and start, but the framework CLI also provides an explicit hook check:

1npx ludicord lint

It validates the Rules of Hooks in Activity source. Keep it in CI or project documentation when your team needs the extra gate.

#Browser preview versus Discord

Browser preview is fastest for layout and ordinary React behavior. Launch inside Discord to test auth, commands, guild/channel context, participants, voice, Activity-instance rooms, safe areas, and proxy behavior.

#Next step

Open Build and deploy when development, Discord launch, API, and WebSocket behavior are all working together.