Skip to content


Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?


Failed to load latest commit information.


Bleeding-edge React framework powered by Vite

Build Status npm type definitions MIT license React Vite Tweet about Rakkas

Read the guide | Try on CodeSandbox | Try on StackBlitz

Rakkas is a bleeding-edge full-stack React framework powered by Vite. You can consider it an up-and-coming alternative to Next.js, Remix, or Gatsby.

Important features are:

  • ⚡  Lightning fast development server
  • 🖥️  Streaming SSR with Suspense
  • 🔀  Dynamic rendering (full static pages for bots, streaming for browsers)
  • ⬇️  API-less data fetching system
  • 🚀  Support for serverless and worker environments
  • 📄  Static site generation
  • 📁  Flexible file system router
  • ⚙️  API routes with middleware support

Is Rakkas right for you?

  • Although many features have been implemented, Rakkas is still under heavy development. It uses experimental and/or beta features of React and Vite. Minor releases will introduce breaking changes until we hit 1.0. As such, it's not yet ready for production use. If you need a stable React framework try Next.js, Remix, or Gatsby.
  • Rakkas is fairly opinionated. If you need more flexibility try vite-ssr-plugin.

Getting started

🚀 See Rakkas in action in your browser:

To generate a Rakkas application boilerplate use one of the following commands:

npx create-rakkas-app@latest my-rakkas-app
# or
pnpm create rakkas-app my-rakkas-app
# or
yarn create rakkas-app my-rakkas-app

create-rakkas-app project initializer comes with many features, all of which are optional but we strongly recommend enabling TypeScript and the generation of a demo project on your first try because self-documenting type definitions allow for a smoother learning curve and the demo project source code comes with plenty of comments.

👷 If you prefer a manual setup, you can install the following packages:

npm install --save react react-dom
npm install --save-dev vite rakkasjs

Then create a src/routes/ file like this:

export default function HomePage() {
	return <h1>Hello world!</h1>;

Now you can:

  • Start a development server with npx rakkas
  • Build with npx rakkas build
  • Launch with node dist/server


Version history

0.7.0 (install with rakkasjs@next)

  • Replace react-helmet-async with a custom component (reduces bundle size by 17KB)


  • React 18
    • Concurrent mode
    • Streaming SSR
    • Suspense for data fetching
  • Vite 3
    • ESM SSR build ("type": "module")
    • Improved cold start
  • Brand new data fetching system
    • react-query-inspired useQuery and useMutation
    • Remix-inspired action handlers
    • API-less data fetching with useServerSideQuery
    • Waterfall-free preload functions
    • Remix-inspired form action handlers
  • HatTip
    • HTTP handling based on web standards
    • Adapters for Vercel Edge, Netlify Edge, and Deno/Deno Deploy
    • Express integration
  • Routing improvements
    • Route guards
    • Catch-all routes
    • Simpler 404 handling
  • Miscellaneous
    • Response headers customization
    • Shared ESLint configuration


  • Serverless support (Vercel, Netlify, Cloudflare Workers)
  • Improved client-side navigation
  • Improved SSRRomuald Brillout
  • Partial pre-rendering
  • Client-only pages
  • Localizable URLs
  • Cache-control header setting


  • Static site generation
  • Switch to React automatic JSX runtime
  • Integration examples (Apollo GraphQL, Styled Components, MDX, Tailwind CSS)
  • More options in the project generator
  • Lots of minor features and fixes
  • Much-expanded documentation