r3f-gamedev

Poll for changes to any value and trigger React re-renders when it changes.

Day-to-day coding style and patterns for R3F game development with Miniplex ECS.

Verekia's preferred project setup with Next.js Pages Router, Tailwind 4, oxfmt, oxlint, and TypeScript.

Use Zustand as a simple state store for entity management (not a true ECS).

Attach meshes to bones of a skinned mesh, such as attaching a sword to a character's hand.

Shake the camera when the player takes damage or on impacts for visual feedback.

Display floating damage numbers that animate upward and fade out, with support for critical hits.

Display health bars above characters using CSS styling.

Use Koota for data-oriented Entity Component System architecture with React bindings.

Display a pulsing red vignette overlay when the player's health is low.

Use Miniplex for minimalistic Entity Component System with TypeScript support.

Make enemies flash white and rock back and forth when receiving damage.

Set up a React Three Fiber project with WebGPU support.

Animate values smoothly using exponential decay instead of linear interpolation.

Sync UI elements outside the Canvas with the render loop using R3F v10's external useFrame.

Create a ribbon trail effect that follows a weapon's movement.