---
title: Migration guide
---

## 0.6 to 0.7

- `react-helmet-async` is gone:
  - `Head` can now only be used for `<title>` and `<meta>` tags with a Remix-like API.
  - `head` property of `preload`'s return value should now be an object, not `ReactNode`.
  - You can still use `emitToDocumentHead` to inject arbitrary HTML into the document head.

## 0.5 to 0.6

> This is the largest update so far with a lot of breaking changes. The whole data fetching system has been redesigned to use React Suspense and streaming SSR. We apologize for the inconvenience but we feel the changes are justified because they take the developer experience to a whole new level.

- Upgrade to `rakkasjs@0.6.0`.
- `@rakkasjs/cli` package is not needed anymore, remove it from your `package.json`.
- `rakkasjs` package is now a development dependency, move it from `dependencies` to `devDependencies` in your `package.json`.
- `vite` is not bundled with Rakkas anymore, install it into your project as a development dependency (`npm install -D vite`).
- Upgrade `react` and `react-dom` to version 18.
- If you have any references to `rakkasjs/vite-types` in your code or `tsconfig.json`, replace them with `vite/client`.
- Rename your `pages` directory to `routes` and move your `api` directory under `routes` as `routes/api`.
- Rename your `page.{jsx,tsx}` files to `index.page.{jsx,tsx}`.
- Use `useLocation` instead of `useRouter` and other navigation hooks.
- `definePage` and `defineLayout` don't exist anymore. Replace them with (depending on the use case)
  - Plain components
  - [`useQuery`](/guide/use-query) calls
  - [`preload`](/guide/preload-function) functions
  - [`headers`](/guide/status-and-headers) functions
- Use plain React context instead of the old layout context mechanism.
- Use the `Head` component from `rakkasjs` instead of `Helmet` from `react-helmet-async`.
- Consider using [`useServerSideQuery`](/guide/use-server-side-query) and [action handlers](/guide/using-forms) instead of API routes for data fetching.
- Rename your `*.endpoint.{js,ts}` files as `*.api.{js,ts}` and `endpoint.{js,ts}` as `index.api.{js,ts}`.
- Use standard `Request` and `Response` types instead of `RakkasRequest` and `RakkasResponse` in your API routes and middleware.

## 0.4 to 0.5

- Remove the `@rakkasjs/runner-node` package.
- Upgrade to `rakkasjs@0.5.0` and `@rakkasjs/cli@0.5.0`.
- Update your `start` script to `node dist/server/index.js` instead of `@rakkasjs/runner-node`.
- If you were using `rakkas export` to generate a static site:
  - Change your build command to `rakkas build -d static`.
  - Serve your static site from `dist` instead of `dist/static`.
  - `load` functions in static sites will now run like in normal sites instead of caching their results. If you're relying on a slow or ever-changing external API, create internal API endpoints accessed with `GET` method do the downstream fetching there since `GET` API endpoints can now be prerendered.
- `NavLink` is deprecated, use `StyledLink` instead.
- Rename `NavLink`'s props as follows:
  - `currentRouteClass` as `activeClass`
  - `currentRouteStyle` as `activeStyle`
  - `nextRouteClass` as `pendingClass`
  - `nextRouteStyle` as `pendingStyle`
- Rename `useRouter`'s return value's properties, `current` is now `currentUrl` and `next` is now `pendingUrl`.
- Return `redirect` instead of `location` to redirect from your `load` functions.
