This repository contains a collection of useful links relating to Remix 3 — what it is, how it works, how it integrates with other libraries, and what the community is building.

Feel free to submit a PR if there's something interesting you'd like to share!

• Wake up, Remix! - Michael Jackson and Ryan Florence (May 28, 2025)

  "It's time to go wake up Remix! Here's what we're building and what it means for React Router."

Links with timestamps are provided for each Remix API, feature or demo introduced within the "Introducing Remix" talks.

• Introducing Remix - Part 1 (Components)
  • Demo disc reveal [08:21]
  • Intro to Remix component model [10:28]
  • @remix-run/events package [21:32]
  • createInteraction [26:27]
  • this.update to trigger re-renders [35:30]
  • Building the drum machine demo [39:54]
  • createEventType for type-safe custom events [48:17]
  • this.context.set/this.context.get [51:39]
  • this argument being added to an existing component [54:53]
  • this.signal for managing component cleanup [1:05:07]
  • connect event to access underlying DOM elements [1:05:07]
  • this.queueTask for executing code after the DOM has been updated [1:11:32]
  • @remix-run/events/key keyboard event helpers [1:15:55]
  • event.preventDefault for skipping subsequent event handlers of the same type [1:18:04]
  • Cleaning up event handlers from events [1:20:03]
  • Preventing race conditions in async event handlers via signal argument [1:26:31]
  • Preventing race conditions in side-effects from render functions via signal argument [1:30:57]
  • Remix component library [1:33:48]
  • Bubbling custom events [1:40:11]
  • Rendering a Remix component inside a web component [1:43:45]
• Introducing Remix - Part 2 (Server, routing, hydration and Frame)
  • Intro to Remix server model [00:30]
  • createRequestListener for using fetch handlers in Node servers [04:51]
  • html helper for creating HTML responses [06:28]
  • RoutePattern for matching URLs to routes with type-safe parameters [10:53]
  • href method for type-safe generation of URLs from route patterns [16:45]
  • route helper for defining a collection of route patterns [18:56]
  • createRouter and router.map to bind handlers to routes [21:02]
  • RouteHandlers type for ensuring that a handler is defined for every route [22:36]
  • router.fetch for routing requests to the correct handler and getting a response [23:42]
  • router.use for middleware [24:02]
  • renderToStream for rendering Remix components on the server [24:41]
  • Defining routes with different HTTP methods for handling formData, and wiring it up to a form [32:44]
  • Configuring the router's formData parser [36:24]
  • redirect helper for returning a redirect response, and why Response.redirect is not used [37:21]
  • css prop for dynamic CSS generation [39:16]
  • LocalFileStorage for handling file uploads [43:38]
  • resources helper for defining a RESTful set of routes [50:45]
  • Bookstore app demo [54:52]
  • formAction helper for defining a GET/POST pair of routes [55:37]
  • storage property on request context for type-safe request-level storage [59:41]
  • hydrated function for partial hydration of server-rendered Remix components [1:01:15]
  • createFrame for bootstrapping a Remix application on the client [1:04:24]
  • Frame component [1:05:19]
  • this.frame.reload method for reloading Frame elements on the client [1:17:59]
  • Inspecting the HTML server response and DOM updates when reloading Frame elements [1:19:38]

• Bookstore demo

  The Bookstore demo presented at Remix Jam 2025.

• Remix Jam Demo Disc

  Contents of the physical CD given to Remix Jam 2025 attendees, shamelessly bootlegged by Kent C. Dodds. Contains the drum machine demo presented at the conference, plus a few other basic game demos.

• Remix Jam Drum Machine - Mark II

  An improved version of the drum machine demo from Remix Jam 2025, expanded to include a full spectrum analyzer and the ability to edit the drum pattern.

• Storybook

• idb
• Jotai
• Legend State
• localForage
• Nano Stores
• Preact Signals
• Redux Toolkit
• RxJS
• TanStack Query
  • Using @tanstack/query-core directly
  • Using a custom Remix adapter
• Valtio
• XState
• XState Store
• Zustand

• TanStack Form
• TanStack Table
• TanStack Virtual

• Motion

• FormatJS
• i18next

• Tiptap - Rich text editor
• Fuse.js - Fuzzy search
• match-sorter - Best-match array sorting

• BroadcastChannel for inter-tab communication
• Drag and Drop API
• document.visibilityState and visibilitychange event for detecting when the page is visible or hidden
• EventTarget for custom state management
• fullscreenchange event handler for full screen mode detection
• IntersectionObserver for detecting when elements are in the viewport
• let for mutable component state
• localStorage
• navigator.share for triggering the device's native share interface
• Notification
• navigator.clipboard
• navigator.geolocation
• ResizeObserver
• screen.orientation and orientationchange event
• Web Animations API

• vite-plugin-remix

  Adds support for the "use client" directive to automatically pass components through Remix's hydrated() function, with added support for chunking.