Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add RR v7 blog post #314

Merged
merged 5 commits into from
Nov 22, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
48 changes: 48 additions & 0 deletions data/posts/react-router-v7.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
---
title: React Router v7
summary: React Router v7 brings all the great things you love from Remix back to React Router
date: 2024-11-22
image: /blog-images/headers/react-router-v7.jpg
mjackson marked this conversation as resolved.
Show resolved Hide resolved
ogImage: /blog-images/headers/react-router-v7.jpg
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Whoops, one more. Forgot I added this option, really should have documented this stuff

Suggested change
ogImage: /blog-images/headers/react-router-v7.jpg
ogImage: /blog-images/headers/react-router-v7.jpg
imageDisableOverlay: true

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

makes it look like:

image

instead of

Screenshot 2024-11-22 at 4 06 09 PM

imageAlt: "The React Router logo"
authors:
- Michael Jackson
---

Today we are happy to announce the stable release of [React Router v7](https://reactrouter.com).

React Router v7 brings everything you love about [Remix](https://remix.run) back into React Router proper. We encourage all Remix v2 users to upgrade to React Router v7.

For the majority of the React ecosystem that has been around for the last 10 years, we believe React Router v7 will be the smoothest way to bridge the gap between React 18 and 19.

## Upgrading

For React Router v6 users, this release brings a wealth of features from Remix back into React Router [in the form of "framework mode"](https://reactrouter.com/upgrading/component-routes). In addition to the handful of components and hooks that you already use, you now have access to a compiler with broad support for dependencies (based on Vite), server rendering, bundle splitting and optimization, vastly improved type safety, a world-class development environment with HMR, and much more. Read the [React Router v6 upgrade guide](https://reactrouter.com/upgrading/v6) for more information on how we've made the upgrade path as smooth as possible for you, and what you have to look forward to in v7.

For Remix v2 users, this release brings a host of improvements to the type safety in Remix, as well as support for improved routing [via `routes.ts`](https://reactrouter.com/start/framework/routing). Check out [the Remix v2 upgrade guide](https://reactrouter.com/upgrading/remix) for more information on how you can upgrade to React Router v7.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe mention pre-rendering as well? That's the other new feature since v2


## New Apps

If you're starting a new app today with React Router, you have a choice: do you want to use React Router as just a library and bring the rest of the pieces yourself? Or do you want a full framework, ala Remix? It really depends on how much of your stack you'd like to invent yourself, and how much leverage you'd like to get out of React Router.

We have some guides to help you get started building new apps with React Router v7:

- [as a framework, using `create-react-router`](https://reactrouter.com/start/framework/installation)
- [as a library, using `create-vite`](https://reactrouter.com/start/library/installation)

If you'd like to get a head start in framework mode, we have [a number of templates you can choose from](https://github.com/remix-run/react-router-templates) that include:

- Server rendering
- Integrated dev server with HMR
- Asset bundling and optimization
- Data loading and mutations
- Styling using Tailwind
- and much more!

All of our templates come with built-in deployment pipelines as well, whether you're [using Docker and hosting on a VPS](https://github.com/remix-run/react-router-templates/tree/main/default) or deploying to a cloud solution [like Cloudflare Workers](https://github.com/remix-run/react-router-templates/tree/main/cloudflare-d1).

You will get a ton of mileage out of these templates when building a new app with React Router v7!

As always, please check out [the docs](https://reactrouter.com/home) for a full run down of everything React Router v7 has to offer.

Enjoy!
Binary file added public/blog-images/headers/react-router-v7.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading