fastify-dx-react

• Introduction
• Quick Start
• Package Scripts
• Basic Setup
• Project Structure
• Rendering Modes
• Routing Configuration
• Data Prefetching
• Route Layouts
• Route Context
• Route Enter Event
• Virtual Modules

Introduction

Fastify DX for React is a renderer adapter for fastify-vite.

It is a fast, lightweight alternative to Next.js and Remix packed with Developer Experience features.

It has an extremely small core (~1k LOC total) and is built on top of Fastify, Vite, React Router and Valtio.

See the release notes for the 0.0.1 alpha release.

At this stage this project is mostly a one-man show, who's devoting all his free time to its completion. Contributions are extremely welcome, as well as bug reports for any issues you may find.

In this first alpha release it's still missing a test suite. The same is true for fastify-vite.

It'll move into beta status when test suites are added to both packages.

Quick Start

Ensure you have Node v16+.

Make a copy of starters/react. If you have degit, run the following from a new directory:

degit fastify/fastify-dx/starters/react

If you're starting a project from scratch, you'll need these packages installed.

npm i fastify fastify-vite fastify-dx-react -P
npm i @vitejs/plugin-react -D

Run npm install.

Run npm run dev.

Visit http://localhost:3000/.

What's Included

That will get you a starter template with:

• A minimal Fastify server.
• Some dummy API routes.
• A pages/ folder with some demo routes.
• All configuration files.

It also includes some opinionated essentials:

• PostCSS Preset Env by Jonathan Neal, which enables several modern CSS features, such as CSS Nesting.

• UnoCSS by Anthony Fu, which supports all Tailwind utilities and many other goodies through its default preset.

• Valtio by Daishi Kato, with a global and SSR-ready store which you can use anywhere.

Package Scripts

npm run dev boots the development server.

npm run build creates the production bundle.

npm run serve serves the production bundle.

Meta

Created by Jonas Galvez, Engineering Manager and Open Sourcerer at NearForm.

Sponsors

Also Duc-Thien Bui and Tom Preston-Werner via GitHub Sponsors. Thank you!