Skip to content

Instantly share code, notes, and snippets.

@stolinski
Last active June 8, 2022 05:53
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save stolinski/2089f700231cc7415e631128e3b3ce4d to your computer and use it in GitHub Desktop.
Save stolinski/2089f700231cc7415e631128e3b3ce4d to your computer and use it in GitHub Desktop.
React Spring React Router Starter
import React from 'react';
import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom';
const Routes = () => {
return (
<Router>
<ul className="router-nav">
<NavLink to="/">One</NavLink>
<NavLink to="/two">Two</NavLink>
<NavLink to="/three">Three</NavLink>
</ul>
<div>
<Switch>
<Route exact path="/" component={One} />
<Route exact path="/two" component={Two} />
<Route exact path="/three" component={Three} />
</Switch>
</div>
</Router>
);
};
function NavLink(props) {
return (
<li>
<Link {...props} />
</li>
);
}
const One = () => {
return (
<div className="page-route">
<h1>One</h1>
</div>
);
};
const Two = () => {
return (
<div className="page-route two">
<h1>Two</h1>
</div>
);
};
const Three = () => {
return (
<div className="page-route three">
<h1>Three</h1>
</div>
);
};
export default Routes;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment