Installation

This guide walks you through installing Remix V3 and setting up your development environment.

Prerequisites

Before installing Remix, you need Node.js version 24.3.0 or higher. Node.js is a program that lets you run JavaScript (and TypeScript) outside of a web browser -- it is the engine that powers your server.

Check your installed version by running:

node --version

If you do not have Node.js installed, download it from nodejs.org.

You also need a package manager to install Remix and its dependencies. Node.js ships with npm by default. Another popular option is pnpm, which is faster and uses less disk space. Either one works fine.

Installing Remix

Install Remix using npm:

npm install remix@next

Or using pnpm:

pnpm install remix@next

What does @next mean?

The @next tag installs the latest preview release of Remix V3. Since V3 is still in alpha, it has not been published under the default @latest tag yet. Once V3 reaches a stable release, you will be able to install it with just npm install remix.

Installing from Git (bleeding edge)

If you want the absolute latest code -- including changes that have not been published to npm yet -- you can install directly from the Git repository:

pnpm install "remix-run/remix#preview/main&path:packages/remix"

This pulls the remix package straight from the preview/main branch on GitHub. This is useful for testing unreleased fixes or features, but keep in mind that bleeding-edge builds may be less stable than published releases.

Installing Individual Packages

Remix V3 is modular. The main remix package includes everything you need to get started, but you can also install individual packages if you only need specific pieces:

npm install @remix-run/fetch-router

This is useful in advanced setups where you want to keep your dependency footprint small.

TypeScript Setup

Remix is written in TypeScript and is designed to be used with it. If you are coming from plain JavaScript, here is the short version: TypeScript is JavaScript with type annotations. Types let you describe what kind of data your variables, function parameters, and return values hold. This helps your editor catch mistakes before you run your code, and makes it much easier to navigate a codebase.

You do not need to be a TypeScript expert to use Remix. The type system works quietly in the background, giving you autocomplete and error checking in your editor.

Recommended tsconfig.json

Create a tsconfig.json file in the root of your project with these settings:

{
  "compilerOptions": {
    "strict": true,
    "lib": ["ES2024", "DOM", "DOM.Iterable"],
    "module": "ES2022",
    "moduleResolution": "Bundler",
    "target": "ESNext",
    "allowImportingTsExtensions": true,
    "verbatimModuleSyntax": true
  }
}

Here is what the key settings do:

• strict -- Enables all of TypeScript's strictness checks. This catches more bugs at the cost of requiring more precise type annotations.
• lib -- Tells TypeScript which built-in APIs are available. ES2024 gives you modern JavaScript features, and DOM / DOM.Iterable give you browser APIs like Request, Response, and Headers.
• module and moduleResolution -- Configure how import and export statements are resolved. The Bundler resolution strategy works with modern build tools.
• allowImportingTsExtensions -- Lets you write import './foo.ts' with the .ts extension, which is required by some runtimes.
• verbatimModuleSyntax -- Ensures that import type is used for type-only imports, keeping your runtime code clean.

Installing tsx

During development, you need a way to run TypeScript files directly without a separate compile step. tsx (TypeScript Execute) does exactly that -- it runs .ts files on the fly:

npm install -D tsx

The -D flag installs it as a dev dependency, meaning it is only needed during development, not in production. You will use tsx in the next guide to run your Remix server.