Reach Router is a simple routing library for React designed to have a small footprint. Not to be confused with [react-router] for early versions, though the two libraries have merged as of Reach Router V2.
Introduction
Reach Router is a routing library for React that borrows ideas from React Router, Ember, and Preact Router. Reach Router is designed to be simple and lightweight and therefore only supports simple routing patterns.
As a routing library, Reach Router handles updating the URL on the page and conditional rendering of a React application based on the URL.
Note that Reach Router and React Router are merging as of versions 2 and 6, respectively. The two libraries are the same on these versions and later.
Example
import React from "react";
import { Router, Link } from "@reach/router"
function App() {
<Router>
<Home path="/"/>
<Profile path="profile"/>
</Router>
}
function Home() {
return (
<main>
<h1>Home</h1>
<div>
<Link to="/">Home Page</Link>
<Link to="profile">Your Profile</Link>
</div>
</main>
)
}
function Profile() {
return (
<main>
<h1>Profile</h1>
</main>
)
}