open-index/open-npm huggingface dataset:
npm package: @remix-run/architect
Description: Architect server request handler for Remix
Latest version: 2.17.4

# Welcome to Remix!

[Remix](https://remix.run) is a web framework that helps you build better websites with React.

To get started, open a new shell and run:

```sh
npx create-remix@latest
```

Then follow the prompts you see in your terminal.

For more information about Remix, [visit remix.run](https://remix.run)!
npm package: @remix-run/cloudflare-pages
Description: Cloudflare Pages request handler for Remix
Latest version: 2.17.4

# Welcome to Remix!

[Remix](https://remix.run) is a web framework that helps you build better websites with React.

To get started, open a new shell and run:

```sh
npx create-remix@latest
```

Then follow the prompts you see in your terminal.

For more information about Remix, [visit remix.run](https://remix.run)!
npm package: @remix-run/cloudflare-workers
Description: Cloudflare worker request handler for Remix
Latest version: 2.17.4

# Welcome to Remix!

[Remix](https://remix.run) is a web framework that helps you build better websites with React.

To get started, open a new shell and run:

```sh
npx create-remix@latest
```

Then follow the prompts you see in your terminal.

For more information about Remix, [visit remix.run](https://remix.run)!
npm package: @remix-run/css-bundle
Description: CSS bundle href when using CSS bundling features in Remix
Latest version: 2.17.4

# @remix-run/css-bundle

This package provides access to the `href` of the generated CSS file when using CSS bundling features in [Remix](https://remix.run).

```sh
npm install @remix-run/css-bundle
```

For more, see the [Remix docs](https://remix.run/docs).
npm package: @remix-run/data-table-mysql
Description: MySQL adapter for remix/data-table
Author: Michael Jackson
Latest version: 0.2.0

# data-table-mysql

MySQL adapter for [`remix/data-table`](https://github.com/remix-run/remix/tree/main/packages/data-table).
Use this package when you want `data-table` APIs backed by `mysql2`.

## Features

- **Native `mysql2` Integration**: Works with `mysql2/promise` `Pool` and `PoolConnection` instances
- **Full `data-table` API Support**: Queries, relations, writes, and transactions
- **Adapter-Owned Compiler**: SQL compilation lives in this adapter, with optional shared pure helpers from `data-table`
- **Migration DDL Support**: Compiles and executes `DataMigrationOperation` operations for `remix/data-table/migrations`
- **MySQL Capabilities Enabled By Default**:
  - `returning: false`
  - `savepoints: true`
  - `upsert: true`
  - `transactionalDdl: false`
  - `migrationLock: true`

## Installation

```sh
npm i remix mysql2
```

## Usage

```ts
import { createPool } from 'mysql2/promise'
import { createDatabase } from 'remix/data-table'
import { createMysqlDatabaseAdapter } from 'remix/data-table-mysql'

let pool = createPool(process.env.DATABASE_URL as string)
let db = createDatabase(createMysqlDatabaseAdapter(pool))
```

Use `db.query(...)`, relation loading, and transactions from `remix/data-table`.
Import any driver-specific types you need directly from `mysql2/promise`.

## Adapter Capabilities

`data-table-mysql` reports this capability set by default:

- `returning: false`
- `savepoints: true`
- `upsert: true`
- `transactionalDdl: false`
- `migrationLock: true`

## Advanced Usage

### Capability Overrides For Testing

Capability overrides are mainly for tests where you want to force or disable specific behavior
checks. In production, keep defaults so adapter behavior matches MySQL behavior.

```ts
import { createMysqlDatabaseAdapter } from 'remix/data-table-mysql'

let adapter = createMysqlDatabaseAdapter(pool, {
  capabilities: {
    upsert: false,
  },
})
```

### `returning` On MySQL

MySQL does not natively support SQL `RETURNING`. In this adapter, using `returning` on write
operations throws `DataTableQueryError`.

Use write metadata (`affectedRows`, `insertId`) on MySQL, or switch adapters when returned rows
are required.

```ts
import { DataTableQueryError } from 'remix/data-table'

try {
  await db
    .query(Accounts)
    .insert({ email: 'a@example.com', status: 'active' }, { returning: ['id'] })
} catch (error) {
  if (error instanceof DataTableQueryError) {
    // insert() returning is not supported by this adapter
  }
}
```

## Related Packages

- [`data-table`](https://github.com/remix-run/remix/tree/main/packages/data-table) - Core query/relations API
- [`data-schema`](https://github.com/remix-run/remix/tree/main/packages/data-schema) - Schema parsing and validation
- [`data-table-postgres`](https://github.com/remix-run/remix/tree/main/packages/data-table-postgres) - PostgreSQL adapter
- [`data-table-sqlite`](https://github.com/remix-run/remix/tree/main/packages/data-table-sqlite) - SQLite adapter

## License

See [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)
npm package: @remix-run/data-table-postgres
Description: PostgreSQL adapter for remix/data-table
Author: Michael Jackson
Latest version: 0.2.0

# data-table-postgres

PostgreSQL adapter for [`remix/data-table`](https://github.com/remix-run/remix/tree/main/packages/data-table).
Use this package when you want `data-table` APIs backed by `pg`.

## Features

- **Native `pg` Integration**: Works with `pg` `Pool` and `PoolClient` instances
- **Full `data-table` API Support**: Queries, relations, writes, and transactions
- **Adapter-Owned Compiler**: SQL compilation lives in this adapter, with optional shared pure helpers from `data-table`
- **Migration DDL Support**: Compiles and executes `DataMigrationOperation` operations for `remix/data-table/migrations`
- **Postgres Capabilities Enabled By Default**:
  - `returning: true`
  - `savepoints: true`
  - `upsert: true`
  - `transactionalDdl: true`
  - `migrationLock: true`

## Installation

```sh
npm i remix pg
```

## Usage

```ts
import { Pool } from 'pg'
import { createDatabase } from 'remix/data-table'
import { createPostgresDatabaseAdapter } from 'remix/data-table-postgres'

let pool = new Pool({
  connectionString: process.env.DATABASE_URL,
})

let db = createDatabase(createPostgresDatabaseAdapter(pool))
```

Use `db.query(...)`, relation loading, and transactions from `remix/data-table`.
Import any driver-specific types you need directly from `pg`.

## Adapter Capabilities

`data-table-postgres` reports this capability set by default:

- `returning: true`
- `savepoints: true`
- `upsert: true`
- `transactionalDdl: true`
- `migrationLock: true`

## Advanced Usage

### Transaction Options

Transaction options are passed through to the adapter as hints.

```ts
await db.transaction(async (txDb) => txDb.exec('select 1'), {
  isolationLevel: 'serializable',
  readOnly: false,
})
```

### Capability Overrides For Testing

You can override capabilities to verify fallback paths in tests.

```ts
import { createPostgresDatabaseAdapter } from 'remix/data-table-postgres'

let adapter = createPostgresDatabaseAdapter(pool, {
  capabilities: {
    returning: false,
  },
})
```

## Related Packages

- [`data-table`](https://github.com/remix-run/remix/tree/main/packages/data-table) - Core query/relations API
- [`data-schema`](https://github.com/remix-run/remix/tree/main/packages/data-schema) - Schema parsing and validation
- [`data-table-mysql`](https://github.com/remix-run/remix/tree/main/packages/data-table-mysql) - MySQL adapter
- [`data-table-sqlite`](https://github.com/remix-run/remix/tree/main/packages/data-table-sqlite) - SQLite adapter

## License

See [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)
npm package: @remix-run/data-table-sqlite
Description: SQLite adapter for remix/data-table
Author: Michael Jackson
Latest version: 0.2.0

# data-table-sqlite

SQLite adapter for [`remix/data-table`](https://github.com/remix-run/remix/tree/main/packages/data-table).
Use this package when you want `data-table` APIs backed by `better-sqlite3`.

## Features

- **Native `better-sqlite3` Integration**: Works well for local and embedded deployments
- **Full `data-table` API Support**: Queries, relations, writes, and transactions
- **Adapter-Owned Compiler**: SQL compilation lives in this adapter, with optional shared pure helpers from `data-table`
- **Migration DDL Support**: Compiles and executes `DataMigrationOperation` operations for `remix/data-table/migrations`
- **SQLite Capabilities Enabled By Default**:
  - `returning: true`
  - `savepoints: true`
  - `upsert: true`
  - `transactionalDdl: true`
  - `migrationLock: false`

## Installation

```sh
npm i remix better-sqlite3
```

## Usage

```ts
import Database from 'better-sqlite3'
import { createDatabase } from 'remix/data-table'
import { createSqliteDatabaseAdapter } from 'remix/data-table-sqlite'

let sqlite = new Database('app.db')
let db = createDatabase(createSqliteDatabaseAdapter(sqlite))
```

This is a good fit for local development, embedded deployments, and single-node services.
Import any driver-specific types you need directly from `better-sqlite3`.

## Adapter Capabilities

`data-table-sqlite` reports this capability set by default:

- `returning: true`
- `savepoints: true`
- `upsert: true`
- `transactionalDdl: true`
- `migrationLock: false`

## Advanced Usage

### In-Memory Database For Tests

```ts
import Database from 'better-sqlite3'
import { createDatabase } from 'remix/data-table'
import { createSqliteDatabaseAdapter } from 'remix/data-table-sqlite'

let sqlite = new Database(':memory:')
let db = createDatabase(createSqliteDatabaseAdapter(sqlite))
```

### Capability Overrides For Fallback Testing

```ts
import { createSqliteDatabaseAdapter } from 'remix/data-table-sqlite'

let adapter = createSqliteDatabaseAdapter(sqlite, {
  capabilities: {
    returning: false,
  },
})
```

## Related Packages

- [`data-table`](https://github.com/remix-run/remix/tree/main/packages/data-table) - Core query/relations API
- [`data-schema`](https://github.com/remix-run/remix/tree/main/packages/data-schema) - Schema parsing and validation
- [`data-table-postgres`](https://github.com/remix-run/remix/tree/main/packages/data-table-postgres) - PostgreSQL adapter
- [`data-table-mysql`](https://github.com/remix-run/remix/tree/main/packages/data-table-mysql) - MySQL adapter

## License

See [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)
npm package: @remix-run/deno
Description: Deno platform abstractions for Remix
Latest version: 2.17.4

# @remix-run/deno

This package contains a Deno module that provides abstractions for Remix.

For more, see the [Remix docs](https://remix.run/docs).

## Install

Installation is done via `npm`, but the code itself is Deno source code. Read
more about
[why we use `npm` to manage dependencies for Deno projects](https://github.com/remix-run/remix/blob/main/decisions/0001-use-npm-to-manage-npm-dependencies-for-deno-projects.md)
in Remix.

```sh
npm install @remix-run/deno
```
npm package: @remix-run/dev
Description: Dev tools and CLI for Remix
Latest version: 2.17.4

# Welcome to Remix!

[Remix](https://remix.run) is a web framework that helps you build better websites with React.

To get started, open a new shell and run:

```sh
npx create-remix@latest
```

Then follow the prompts you see in your terminal.

For more information about Remix, [visit remix.run](https://remix.run)!
npm package: @remix-run/eslint-config
Description: ESLint configuration for Remix projects
Latest version: 2.17.4

# `@remix-run/eslint-config`

> [!WARNING]
> The `@remix-run/eslint-config` package is deprecated and will not be included in React Router v7. We recommend moving towards a streamlined ESLint config such as the ones included in the Remix templates. See https://github.com/remix-run/remix/blob/main/templates/remix/.eslintrc.cjs.

This package includes a shareable ESLint config for Remix projects.

If you create your app with `create-remix` no additional configuration is necessary.

## Installation

First, install this package along with ESLint in your project. **This package requires at least version 8.1 of ESLint**

```sh
npm install -D eslint @remix-run/eslint-config
```

Then create a file named `.eslintrc.js` in the root of your project:

```js filename=.eslintrc.js
module.exports = {
  extends: "@remix-run/eslint-config",
};
```

### Jest + Testing Library

This packages also ships with optional configuration options for projects that use [Jest](https://jestjs.io/) with [Testing Library](https://testing-library.com). To enable these rules, add the following to your `.eslintrc`:

```js filename=.eslintrc.js
module.exports = {
  extends: [
    "@remix-run/eslint-config",
    "@remix-run/eslint-config/jest-testing-library",
  ],
};
```

Please note that because this ruleset is optional, we do not include the core libraries as peer dependencies for this package. If you use these rules, be sure that you have the following dependencies installed in your project:

```json filename=package.json
{
  "dependencies": {
    "@testing-library/jest-dom": ">=5.16.0",
    "@testing-library/react": ">=12.0.0",
    "jest": ">=28.0.0"
  }
}
```
npm package: @remix-run/express
Description: Express server request handler for Remix
Latest version: 2.17.4

# Welcome to Remix!

[Remix](https://remix.run) is a web framework that helps you build better websites with React.

To get started, open a new shell and run:

```sh
npx create-remix@latest
```

Then follow the prompts you see in your terminal.

For more information about Remix, [visit remix.run](https://remix.run)!
npm package: @remix-run/fetch-proxy
Description: An HTTP proxy for the web Fetch API
Author: Michael Jackson
Latest version: 0.7.1

# fetch-proxy

`fetch-proxy` is an HTTP proxy for the [JavaScript Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API).

HTTP proxies are essential for many web architectures: load balancing, API gateways, development servers that forward to backend services, and middleware that needs to intercept and modify traffic. Traditional proxy implementations often require platform-specific APIs or complex server setups.

In the context of servers, an HTTP proxy server is a server that forwards all requests it receives to another server and returns the responses it receives. When you think about it this way, a [`fetch` function](https://developer.mozilla.org/en-US/docs/Web/API/Window/fetch) is like a mini proxy server sitting right there in your code. You send it requests, it goes and talks to some other server, and it gives you back the response it received.

`fetch-proxy` allows you to easily create `fetch` functions that act as proxies to "target" servers using the familiar web-standard Fetch API.

## Features

- **Web Standards** - Built on the standard [JavaScript Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API)
- **Cookie Rewriting** - Supports rewriting `Set-Cookie` headers received from target server
- **Forwarding Headers** - Supports `X-Forwarded-Proto` and `X-Forwarded-Host` headers
- **Custom Fetch** - Supports custom `fetch` implementations

## Installation

Install from [npm](https://www.npmjs.com/):

```sh
npm i @remix-run/fetch-proxy
```

## Usage

```ts
import { createFetchProxy } from '@remix-run/fetch-proxy'

// Create a proxy that sends all requests through to remix.run
let proxy = createFetchProxy('https://remix.run')

// This fetch handler is probably running as part of your server somewhere...
function handleFetch(request: Request): Promise<Response> {
  return proxy(request)
}

// Test it out by manually throwing a Request at it
let response = await handleFetch(new Request('https://shopify.com'))

let text = await response.text()
let title = text.match(/<title>([^<]+)<\/title>/)[1]
assert(title.includes('Remix'))
```

## Related Packages

- [`node-fetch-server`](https://github.com/remix-run/remix/tree/main/packages/node-fetch-server) - Build HTTP servers for Node.js using the web fetch API

## License

See [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)
npm package: @remix-run/file-storage
Description: Key/value storage for JavaScript File objects
Author: Michael Jackson
Latest version: 0.13.3

# file-storage

Key/value storage interfaces for server-side [`File` objects](https://developer.mozilla.org/en-US/docs/Web/API/File). `file-storage` gives Remix apps one consistent API across local disk and memory backends.

## Features

- **Simple API** - Intuitive key/value API (like [Web Storage](https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API), but for `File`s instead of strings)
- **Multiple Backends** - Built-in filesystem and memory backends
- **Streaming Support** - Stream file content to and from storage
- **Metadata Preservation** - Preserves all `File` metadata including `file.name`, `file.type`, and `file.lastModified`

## Installation

```sh
npm i remix
```

## Usage

### File System

```ts
import { createFsFileStorage } from 'remix/file-storage/fs'

let storage = createFsFileStorage('./user/files')

let file = new File(['hello world'], 'hello.txt', { type: 'text/plain' })
let key = 'hello-key'

// Put the file in storage.
await storage.set(key, file)

// Then, sometime later...
let fileFromStorage = await storage.get(key)
// All of the original file's metadata is intact
fileFromStorage.name // 'hello.txt'
fileFromStorage.type // 'text/plain'

// To remove from storage
await storage.remove(key)
```

## Related Packages

- [`file-storage-s3`](https://github.com/remix-run/remix/tree/main/packages/file-storage-s3) - S3 backend for `file-storage`
- [`form-data-parser`](https://github.com/remix-run/remix/tree/main/packages/form-data-parser) - Pairs well with this library for storing `FileUpload` objects received in `multipart/form-data` requests
- [`lazy-file`](https://github.com/remix-run/remix/tree/main/packages/lazy-file) - The streaming `File` implementation used internally to stream files from storage

## License

See [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)
npm package: @remix-run/file-storage-s3
Description: S3 backend for @remix-run/file-storage
Author: Michael Jackson
Latest version: 0.1.0

# file-storage-s3

S3 backend for [`remix/file-storage`](https://github.com/remix-run/remix/tree/main/packages/file-storage).
Use this package when you want the `FileStorage` API backed by AWS S3 or an S3-compatible provider.

## Features

- **S3-Compatible API** - Works with AWS S3 and S3-compatible APIs (e.g. MinIO, LocalStack)
- **Metadata Preservation** - Preserves `File` metadata (`name`, `type`, `lastModified`)
- **Runtime-Agnostic Signing** - Uses [`aws4fetch`](https://github.com/mhart/aws4fetch) for SigV4 signing

## Installation

```sh
npm i remix
```

## Usage

```ts
import { createS3FileStorage } from 'remix/file-storage-s3'

let storage = createS3FileStorage({
  accessKeyId: process.env.AWS_ACCESS_KEY_ID!,
  secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY!,
  bucket: 'my-app-uploads',
  region: 'us-east-1',
})

await storage.set(
  'uploads/hello.txt',
  new File(['hello world'], 'hello.txt', { type: 'text/plain' }),
)
let file = await storage.get('uploads/hello.txt')
await storage.remove('uploads/hello.txt')
```

For S3-compatible providers such as MinIO and LocalStack, set `endpoint` and `forcePathStyle: true`.

## Related Packages

- [`file-storage`](https://github.com/remix-run/remix/tree/main/packages/file-storage) - Core `FileStorage` interface and filesystem/memory backends
- [`form-data-parser`](https://github.com/remix-run/remix/tree/main/packages/form-data-parser) - Parses `multipart/form-data` uploads into `FileUpload` objects

## License

See [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)
npm package: @remix-run/fs
Description: Filesystem utilities using the Web File API
Author: Michael Jackson
Latest version: 0.4.2

# fs

Lazy, streaming filesystem utilities for JavaScript. This package provides utilities for working with files on the local filesystem using the [`LazyFile`](https://github.com/remix-run/remix/tree/main/packages/lazy-file)/ native [`File`](https://developer.mozilla.org/en-US/docs/Web/API/File) API.

## Features

- **Web Standards** - Uses [`LazyFile`](https://github.com/remix-run/remix/tree/main/packages/lazy-file) which matches the native [`File`](https://developer.mozilla.org/en-US/docs/Web/API/File) API and provides `.stream()`, `.toFile()`, and `.toBlob()` for converting to native types.
- **Seamless Node.js Compat** - Works seamlessly with Node.js file descriptors and handles

## Installation

```sh
npm i remix
```

## Usage

### Opening Lazy Files

```ts
import { openLazyFile } from 'remix/fs'

// Open a file from the filesystem
let lazyFile = openLazyFile('./path/to/file.json')

// The file is lazy - no data is read until you call lazyFile.text(), lazyFile.bytes(), etc.
let json = JSON.parse(await lazyFile.text())

// You can override file metadata
let customLazyFile = openLazyFile('./image.jpg', {
  name: 'custom-name.jpg',
  type: 'image/jpeg',
  lastModified: Date.now(),
})
```

### Writing Files

```ts
import { openLazyFile, writeFile } from 'remix/fs'

// Read a file and write it elsewhere
let lazyFile = openLazyFile('./source.txt')
await writeFile('./destination.txt', lazyFile)

// Write to an open file handle
import * as fsp from 'node:fs/promises'
let handle = await fsp.open('./destination.txt', 'w')
await writeFile(handle, lazyFile)
await handle.close()
```

## Related Packages

- [`lazy-file`](https://github.com/remix-run/remix/tree/main/packages/lazy-file) - Lazy, streaming `Blob`/`File` implementation
- [`file-storage`](https://github.com/remix-run/remix/tree/main/packages/file-storage) - Storage abstraction for files

## License

See [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)
npm package: @remix-run/fs-routes
Description: Config-based file system routing conventions, for use within routes.ts
Latest version: 2.17.4

# Welcome to Remix!

[Remix](https://remix.run) is a web framework that helps you build better websites with React.

To get started, open a new shell and run:

```sh
npx create-remix@latest
```

Then follow the prompts you see in your terminal.

For more information about Remix, [visit remix.run](https://remix.run)!
npm package: @remix-run/html-template
Description: HTML template tag with auto-escaping for JavaScript
Author: Michael Jackson
Latest version: 0.3.0

# html-template

Safe HTML template tag with auto-escaping for JavaScript.

`html-template` provides a tagged template literal for safely constructing HTML strings with automatic escaping of interpolated values to prevent XSS vulnerabilities.

## Features

- **Automatic HTML escaping** - All interpolated values are escaped by default
- **Explicit raw HTML** - Use `html.raw` when you need unescaped HTML from trusted sources
- **Composable** - SafeHtml values can be nested without double-escaping
- **Type-safe** - Full TypeScript support with branded types
- **Zero dependencies** - Lightweight and self-contained
- **Runtime agnostic** - Works in Node.js, Bun, Deno, browsers, and edge runtimes

## Installation

Install from [npm](https://www.npmjs.com/):

```sh
npm install @remix-run/html-template
```

## Usage

```ts
import { html } from '@remix-run/html-template'

let userInput = '<script>alert("XSS")</script>'
let greeting = html`<h1>Hello ${userInput}!</h1>`

console.log(String(greeting))
// Output: <h1>Hello &lt;script&gt;alert("XSS")&lt;/script&gt;!</h1>
```

By default, all interpolated values are automatically escaped to prevent XSS attacks.

If you have trusted HTML that should not be escaped, use `html.raw`:

```ts
import { html } from '@remix-run/html-template'

let trustedIcon = '<svg>...</svg>'
let button = html.raw`<button>${trustedIcon} Click me</button>`

console.log(String(button))
// => <button><svg>...</svg> Click me</button>
```

**Warning**: Only use `html.raw` with content you trust. Never use it with user input.

### Composing HTML Fragments

SafeHtml values can be nested without double-escaping:

```ts
import { html } from '@remix-run/html-template'

let title = html`<h1>My Title</h1>`
let content = html`<p>Some content with ${userInput}</p>`

let page = html`
  <!doctype html>
  <html>
    <body>
      ${title} ${content}
    </body>
  </html>
`
```

### Working with Arrays

You can interpolate arrays of values, which will be flattened and joined:

```ts
import { html } from '@remix-run/html-template'

let items = ['Apple', 'Banana', 'Cherry']
let list = html`
  <ul>
    ${items.map((item) => html`<li>${item}</li>`)}
  </ul>
`
```

### Conditional Rendering

Use `null` or `undefined` to render nothing:

```ts
import { html } from '@remix-run/html-template'

let showError = false
let errorMessage = 'Something went wrong'
let page = html`<div>${showError ? html`<div class="error">${errorMessage}</div>` : null}</div>`
```

## Related Packages

- [`@remix-run/fetch-router`](https://github.com/remix-run/remix/tree/main/packages/fetch-router) - HTTP router that works great with html-template

## License

See [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)
npm package: @remix-run/logger-middleware
Description: Middleware for logging HTTP requests and responses
Author: Michael Jackson
Latest version: 0.1.4

# logger-middleware

HTTP request/response logging middleware for Remix. It logs request metadata and response details with configurable output formats.

## Features

- **Request/Response Logging** - Logs method, path, status, and response metadata
- **Token-Based Formatting** - Customize log output with built-in placeholders
- **Structured Timing Data** - Includes request duration and timestamps

## Installation

```sh
npm i remix
```

## Usage

```ts
import { createRouter } from 'remix/fetch-router'
import { logger } from 'remix/logger-middleware'

let router = createRouter({
  middleware: [logger()],
})

// Logs: [19/Nov/2025:14:32:10 -0800] GET /users/123 200 1234
```

### Custom Format

You can use the `format` option to customize the log format. The following tokens are available:

- `%date` - Date and time in Apache/nginx format (dd/Mon/yyyy:HH:mm:ss ±zzzz)
- `%dateISO` - Date and time in ISO format
- `%duration` - Request duration in milliseconds
- `%contentLength` - Response Content-Length header
- `%contentType` - Response Content-Type header
- `%host` - Request URL host
- `%hostname` - Request URL hostname
- `%method` - Request method
- `%path` - Request pathname + search
- `%pathname` - Request pathname
- `%port` - Request port
- `%query` - Request query string (search)
- `%referer` - Request Referer header
- `%search` - Request search string
- `%status` - Response status code
- `%statusText` - Response status text
- `%url` - Full request URL
- `%userAgent` - Request User-Agent header

```ts
let router = createRouter({
  middleware: [
    logger({
      format: '%method %path - %status (%duration ms)',
    }),
  ],
})
// Logs: GET /users/123 - 200 (42 ms)
```

For Apache-style combined log format, you can use the following format:

```ts
let router = createRouter({
  middleware: [
    logger({
      format: '%host - - [%date] "%method %path" %status %contentLength "%referer" "%userAgent"',
    }),
  ],
})
```

### Custom Logger

You can use a custom logger to write logs to a file or other stream.

```ts
import { createWriteStream } from 'node:fs'

let logStream = createWriteStream('access.log', { flags: 'a' })

let router = createRouter({
  middleware: [
    logger({
      log(message) {
        logStream.write(message + '\n')
      },
    }),
  ],
})
```

## Related Packages

- [`fetch-router`](https://github.com/remix-run/remix/tree/main/packages/fetch-router) - Router for the web Fetch API

## License

See [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)
npm package: @remix-run/method-override-middleware
Description: Middleware for overriding HTTP request methods from form data
Author: Michael Jackson
Latest version: 0.1.5

# method-override-middleware

Method override middleware for Remix. It allows HTML forms to simulate `PUT`, `PATCH`, and `DELETE` requests using a hidden form field.

## Features

- **Form Method Overrides** - Translate posted form fields into request methods
- **HTML Form Friendly** - Supports REST-style routes from standard browser forms
- **Configurable Field Name** - Choose a custom override field key

## Installation

```sh
npm i remix
```

## Usage

This middleware runs after [the `formData` middleware](https://github.com/remix-run/remix/tree/main/packages/form-data-middleware) and updates the request context's `context.method` with the value of the method override field. This is useful for simulating RESTful API request methods like PUT and DELETE using HTML forms.

```ts
import { createRouter } from 'remix/fetch-router'
import { formData } from 'remix/form-data-middleware'
import { methodOverride } from 'remix/method-override-middleware'

let router = createRouter({
  // methodOverride must come AFTER formData middleware
  middleware: [formData(), methodOverride()],
})

router.delete('/users/:id', async (context) => {
  let userId = context.params.id
  // Delete user logic...
  return new Response('User deleted')
})
```

In your HTML form:

```html
<form method="POST" action="/users/123">
  <input type="hidden" name="_method" value="DELETE" />
  <button type="submit">Delete User</button>
</form>
```

### Custom Field Name

You can customize the name of the method override field by passing a `fieldName` option to the `methodOverride()` middleware.

```ts
let router = createRouter({
  middleware: [formData(), methodOverride({ fieldName: '__method__' })],
})
```

```html
<form method="POST" action="/users/123">
  <input type="hidden" name="__method__" value="PUT" />
  <button type="submit">Update User</button>
</form>
```

## Related Packages

- [`fetch-router`](https://github.com/remix-run/remix/tree/main/packages/fetch-router) - Router for the web Fetch API
- [`form-data-middleware`](https://github.com/remix-run/remix/tree/main/packages/form-data-middleware) - Required for parsing form data

## License

See [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)
npm package: @remix-run/netlify
Description: Netlify server request handler for Remix
Latest version: 1.19.3

# Welcome to Remix!

[Remix](https://remix.run) is a web framework that helps you build better websites with React.

To get started, open a new shell and run:

```sh
npx create-remix@latest
```

Then follow the prompts you see in your terminal.

For more information about Remix, [visit remix.run](https://remix.run)!
npm package: @remix-run/node
Description: Node.js platform abstractions for Remix
Latest version: 2.17.4

# Welcome to Remix!

[Remix](https://remix.run) is a web framework that helps you build better websites with React.

To get started, open a new shell and run:

```sh
npx create-remix@latest
```

Then follow the prompts you see in your terminal.

For more information about Remix, [visit remix.run](https://remix.run)!
npm package: @remix-run/react
Description: React DOM bindings for Remix
Latest version: 2.17.4

# Welcome to Remix!

[Remix](https://remix.run) is a web framework that helps you build better websites with React.

To get started, open a new shell and run:

```sh
npx create-remix@latest
```

Then follow the prompts you see in your terminal.

For more information about Remix, [visit remix.run](https://remix.run)!
npm package: @remix-run/route-config
Description: Config-based routing utilities, for use within routes.ts
Latest version: 2.17.4

# Welcome to Remix!

[Remix](https://remix.run) is a web framework that helps you build better websites with React.

To get started, open a new shell and run:

```sh
npx create-remix@latest
```

Then follow the prompts you see in your terminal.

For more information about Remix, [visit remix.run](https://remix.run)!
npm package: @remix-run/routes-option-adapter
Description: Adapter for Remix's "routes" config option, for use within routes.ts
Latest version: 2.17.4

# Welcome to Remix!

[Remix](https://remix.run) is a web framework that helps you build better websites with React.

To get started, open a new shell and run:

```sh
npx create-remix@latest
```

Then follow the prompts you see in your terminal.

For more information about Remix, [visit remix.run](https://remix.run)!
npm package: @remix-run/serve
Description: Production application server for Remix
Latest version: 2.17.4

# Welcome to Remix!

[Remix](https://remix.run) is a web framework that helps you build better websites with React.

To get started, open a new shell and run:

```sh
npx create-remix@latest
```

Then follow the prompts you see in your terminal.

For more information about Remix, [visit remix.run](https://remix.run)!
npm package: @remix-run/server-runtime
Description: Server runtime for Remix
Latest version: 2.17.4

# @remix-run/server-runtime

[Remix](https://remix.run) supports multiple server runtimes:

- [Node](https://nodejs.org/en/)
- [Cloudflare](https://developers.cloudflare.com/workers/learning/how-workers-works/)
- [Deno](https://deno.land/) (Experimental 🧪)

Support for each runtime is provided by a corresponding Remix package:

- [`@remix-run/node`](https://github.com/remix-run/remix/tree/main/packages/remix-node)
- [`@remix-run/cloudflare`](https://github.com/remix-run/remix/tree/main/packages/remix-cloudflare)
- [`@remix-run/deno`](https://github.com/remix-run/remix/tree/main/packages/remix-deno)

This package defines a "Remix server runtime interface" that each runtime package must conform to.

Each Remix server runtime package MUST:

- Implement and export values for each type in [`interface.ts`](./interface.ts)
- Re-export types in [`reexport.ts`](./reexport.ts)

Each Remix server runtime package MAY:

- Re-export the [default implementations](./index.ts) as its implementations
- Export custom implementations adhering to the [interface types](./interface.ts)
- Provide additional exports relevant for that runtime
npm package: @remix-run/session-storage-memcache
Description: Memcache session storage for @remix-run/session
Author: Michael Jackson
Latest version: 0.1.0

# session-storage-memcache

Memcache session storage for [`@remix-run/session`](https://github.com/remix-run/remix/tree/main/packages/session).

## Installation

```sh
npm i remix
```

## Usage

```ts
import { createMemcacheSessionStorage } from 'remix/session-storage-memcache'

let sessionStorage = createMemcacheSessionStorage('127.0.0.1:11211', {
  keyPrefix: 'my-app:session:',
  ttlSeconds: 60 * 60 * 24 * 7,
})
```

Available options:

- `useUnknownIds` (default: `false`) - reuse unknown session IDs sent by the client
- `keyPrefix` (default: `'remix:session:'`) - prefix for all Memcache keys
- `ttlSeconds` (default: `0`) - session expiration in seconds (`0` means no expiration)

Note: Memcache storage uses TCP sockets and requires a Node.js runtime.

## Related Packages

- [`@remix-run/session`](https://github.com/remix-run/remix/tree/main/packages/session) - Core session primitives and storage interface
- [`@remix-run/session-middleware`](https://github.com/remix-run/remix/tree/main/packages/session-middleware) - Middleware for wiring session storage into request handling

## License

See [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)
npm package: @remix-run/session-storage-redis
Description: Redis session storage for @remix-run/session
Author: Michael Jackson
Latest version: 0.1.0

# session-storage-redis

Redis-backed session storage for [`@remix-run/session`](https://github.com/remix-run/remix/tree/main/packages/session).
Use this package when app servers need to share session state through Redis.

## Installation

```sh
npm i @remix-run/session @remix-run/session-storage-redis redis
```

## Usage

```ts
import { createClient } from 'redis'
import { createRedisSessionStorage } from '@remix-run/session-storage-redis'

let redis = createClient({ url: process.env.REDIS_URL })
await redis.connect()

let sessionStorage = createRedisSessionStorage(redis, {
  keyPrefix: 'session:',
  ttl: 60 * 60 * 24,
})
```

## Options

`createRedisSessionStorage(client, options)` supports:

- `keyPrefix` (`string`, default: `'session:'`)
- `ttl` (`number` seconds)
- `useUnknownIds` (`boolean`, default: `false`)

## License

See [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)
npm package: @remix-run/static-middleware
Description: Middleware for serving static files from the filesystem
Author: Michael Jackson
Latest version: 0.4.5

# static-middleware

Static file serving middleware for Remix. Serves static files from a directory with support for ETags, range requests, and conditional requests.

## Features

- [ETag](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/ETag) support (weak and strong)
- [Range requests](https://developer.mozilla.org/en-US/docs/Web/HTTP/Range_requests) support (HTTP 206 Partial Content)
- [Conditional request](https://developer.mozilla.org/en-US/docs/Web/HTTP/Conditional_requests) support (If-None-Match, If-Modified-Since)
- Path traversal protection
- Automatic fallback to next middleware/handler if file not found

## Installation

```sh
npm i remix
```

## Usage

Static middleware is useful for serving static files from a directory.

```ts
import { createRouter } from 'remix/fetch-router'
import { staticFiles } from 'remix/static-middleware'

let router = createRouter({
  middleware: [staticFiles('./public')],
})

router.get('/', () => new Response('Home'))
```

### With Cache Control

Internally, the `staticFiles()` middleware uses the [`createFileResponse()` helper from `@remix-run/response`](https://github.com/remix-run/remix/tree/main/packages/response/README.md#file-responses) to send files with full HTTP semantics. This means it also accepts the same options as the `createFileResponse()` helper.

```ts
let router = createRouter({
  middleware: [
    staticFiles('./public', {
      cacheControl: 'public, max-age=31536000, immutable', // 1 year
    }),
  ],
})
```

### Filter Files

```ts
let router = createRouter({
  middleware: [
    staticFiles('./public', {
      filter(path) {
        // Don't serve hidden files
        return !path.startsWith('.')
      },
    }),
  ],
})
```

### Multiple Directories

```ts
let router = createRouter({
  middleware: [
    staticFiles('./public'),
    staticFiles('./assets', {
      cacheControl: 'public, max-age=31536000',
    }),
  ],
})
```

## Security

- Prevents path traversal attacks (e.g., `../../../etc/passwd`)
- Only serves files with GET and HEAD requests
- Respects the configured root directory boundary

## Related Packages

- [`fetch-router`](https://github.com/remix-run/remix/tree/main/packages/fetch-router) - Router for the web Fetch API
- [`lazy-file`](https://github.com/remix-run/remix/tree/main/packages/lazy-file) - Used internally for streaming file contents

## License

See [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)
npm package: @remix-run/tar-parser
Description: A fast, efficient parser for tar streams in any JavaScript environment
Author: Michael Jackson
Latest version: 0.7.0

# tar-parser

`tar-parser` is a fast, efficient parser for [tar archives](<https://en.wikipedia.org/wiki/Tar_(computing)>).

Tar archives are ubiquitous in software development, used for distributing packages, backing up files, and transferring data. Most existing JavaScript tar parsers are either Node.js-specific or don't handle streaming efficiently, forcing you to buffer entire archives in memory. This makes them unsuitable for serverless environments or processing large archives.

`tar-parser` can be used in any JavaScript environment (not just Node.js) and processes archives as streams, making it ideal for modern web development across all runtimes.

## Features

- **Universal Runtime** - Runs anywhere JavaScript runs
- **Web Streams** - Built on the standard [web Streams API](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API), so it's composable with `fetch()` streams
- **Format Support** - Supports POSIX, GNU, and PAX tar formats
- **Memory Efficient** - Does not buffer anything in normal usage
- **Zero Dependencies** - No external dependencies

## Installation

Install from [npm](https://www.npmjs.com/):

```sh
npm install @remix-run/tar-parser
```

## Usage

The main parser interface is the `parseTar(archive, handler)` function:

```ts
import { parseTar } from '@remix-run/tar-parser'

let response = await fetch('https://github.com/remix-run/remix/archive/refs/heads/main.tar.gz')

await parseTar(response.body.pipeThrough(new DecompressionStream('gzip')), (entry) => {
  console.log(entry.name, entry.size)
})
```

If you're parsing an archive with filename encodings other than UTF-8, use the `filenameEncoding` option:

```ts
let response = await fetch(/* ... */)

await parseTar(response.body, { filenameEncoding: 'latin1' }, (entry) => {
  console.log(entry.name, entry.size)
})
```

## Benchmark

`tar-parser` performs on par with other popular tar parsing libraries on Node.js.

```
> @remix-run/tar-parser@0.0.0 bench /Users/michael/Projects/remix-the-web/packages/tar-parser
> node --disable-warning=ExperimentalWarning ./bench/runner.ts

Platform: Darwin (24.0.0)
CPU: Apple M1 Pro
Date: 12/6/2024, 11:00:55 AM
Node.js v22.8.0
┌────────────┬────────────────────┐
│ (index)    │ lodash npm package │
├────────────┼────────────────────┤
│ tar-parser │ '6.23 ms ± 0.58'   │
│ tar-stream │ '6.72 ms ± 2.24'   │
│ node-tar   │ '6.49 ms ± 0.44'   │
└────────────┴────────────────────┘
```

## Related Packages

- [`multipart-parser`](https://github.com/remix-run/remix/tree/main/packages/multipart-parser) - Fast, streaming multipart parser for JavaScript

## Credits

`tar-parser` is based on the excellent [tar-stream package](https://www.npmjs.com/package/tar-stream) (MIT license) and adopts the same core parsing algorithm, utility functions, and many test cases.

## License

See [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)
npm package: @remix-run/testing
Description: Testing utilities for Remix apps
Latest version: 2.17.4

# Welcome to Remix!

[Remix](https://remix.run) is a web framework that helps you build better websites with React.

To get started, open a new shell and run:

```sh
npx create-remix@latest
```

Then follow the prompts you see in your terminal.

For more information about Remix, [visit remix.run](https://remix.run)!
npm package: @remix-run/v1-meta
Description: Enables the [v1 route meta API](https://remix.run/docs/en/v1/route/meta) in Remix v2.
Latest version: 0.1.3

# V1 Meta

Enables the [v1 route meta API](https://remix.run/docs/en/v1/route/meta) in Remix v2.

```tsx
import { metaV1, getMatchesData } from "@remix-run/v1-meta";

export const meta = (args) => {
  // In the v1 API, `meta` received a `parentsData` argument, which is an
  // object keyed by each parent route ID containing the data returned by
  // that route's `loader` function. This argument is removed from the
  // v2 API. `getMatchesData` will construct an object with the same
  // signature, allowing you to easily refactor your code.
  let matchesData = getMatchesData(args);
  let rootData = matchesData["root"];

  // This function will construct an array of `V2_MetaDescriptor` objects.
  // It will use the same heuristics as Remix v1 to merge the parent
  // route's meta values with the data you provide.
  return metaV1(args, {
    title: "My App",
    description: "My App Description",
  });

  // output:
  return [
    // This is inherited from the parent route!
    { charSet: "utf-8" },
    // If your parent has a title it will be overridden!
    { title: "My App" },
    { name: "description", content: "My App Description" },
  ];
};
```
npm package: @remix-run/v1-route-convention
Description: Enables the [v1 route file convention](https://remix.run/docs/en/v1/file-conventions/routes-files) in Remix v2.
Latest version: 0.1.4

# V1 Route Convention

Enables the [v1 route file convention](https://remix.run/docs/en/v1/file-conventions/routes-files) in Remix v2.

```js
// remix.config.js
const { createRoutesFromFolders } = require("@remix-run/v1-route-convention");

/** @type {import('@remix-run/dev').AppConfig} */
module.exports = {
  // Tell Remix to ignore everything in the routes directory.
  // We'll let `createRoutesFromFolders` take care of that.
  ignoredRouteFiles: ["**/*"],
  routes: (defineRoutes) => {
    // `createRoutesFromFolders` will create routes for all files in the
    // routes directory using the same default conventions as Remix v1.
    return createRoutesFromFolders(defineRoutes, {
      // If you're already using `ignoredRouteFiles` in your Remix config,
      // you can move them to `ignoredFilePatterns` in the plugin's options.
      ignoredFilePatterns: ["**/.*", "**/*.css"],
    });
  },
};
```
npm package: @remix-run/vercel
Description: Vercel server request handler for Remix
Latest version: 1.19.3

# Welcome to Remix!

[Remix](https://remix.run) is a web framework that helps you build better websites with React.

To get started, open a new shell and run:

```sh
npx create-remix@latest
```

Then follow the prompts you see in your terminal.

For more information about Remix, [visit remix.run](https://remix.run)!
npm package: @remix-run/web-fetch
Description: Web API compatible fetch implementation
Author: David Frank
Latest version: 4.4.2

# @remix-run/web-fetch

[![ci][ci.icon]][ci.url]
[![package][version.icon] ![downloads][downloads.icon]][package.url]

Web API compatible [fetch API][] for nodejs.

## Comparison to Alternatives

#### [node-fetch][]

The reason this fork exists is because [node-fetch][] chooses to compromise
Web API compatibility and by using nodejs native [Readable][] stream. They way
they put it is:

>
> - Make conscious trade-off when following [WHATWG fetch spec][whatwg-fetch] and [stream spec](https://streams.spec.whatwg.org/) implementation details, document known differences.
> - Use native Node streams for body, on both request and response.
>

We found these incompatibility to be really problematic when sharing code
across nodejs and browser rutimes. This library uses [@remix-run/web-stream][] instead.



[ci.icon]: https://github.com/web-std/io/workflows/fetch/badge.svg
[ci.url]: https://github.com/web-std/io/actions/workflows/fetch.yml
[version.icon]: https://img.shields.io/npm/v/@remix-run/web-fetch.svg
[downloads.icon]: https://img.shields.io/npm/dm/@remix-run/web-fetch.svg
[package.url]: https://npmjs.org/package/@remix-run/web-fetch
[downloads.image]: https://img.shields.io/npm/dm/@remix-run/web-fetch.svg
[downloads.url]: https://npmjs.org/package/@remix-run/web-fetch
[prettier.icon]: https://img.shields.io/badge/styled_with-prettier-ff69b4.svg
[prettier.url]: https://github.com/prettier/prettier
[blob]: https://developer.mozilla.org/en-US/docs/Web/API/Blob/Blob
[fetch-blob]: https://github.com/node-fetch/fetch-blob
[readablestream]: https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream
[readable]: https://nodejs.org/api/stream.html#stream_readable_streams
[w3c blob.stream]: https://w3c.github.io/FileAPI/#dom-blob-stream
[@remix-run/web-stream]:https://github.com/web-std/io/tree/main/stream
[Uint8Array]:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array
[node-fetch]:https://github.com/node-fetch/
[fetch api]:https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API
[readable]: https://nodejs.org/api/stream.html#stream_readable_streams