import Router, { Link, navigate, redirect } from 'pagify-it';
 
const Home = () => <div>HOME</div>;
const About = () => <div>ABOUT <Link to="/">HOME</Link></div>;
const Post = props => <div>POST # {props.ctx.params.id}</div>;
 
const routes = {
  '/': Home,
  '/about': About,
  '/post/:id': Post,
  '*': () => <div>404</div>
};
 
const App = () => <Router {...{ routes }} />;
// props: routes, opts (optional), base (optional), onChange(path, ctx) (optional)
 
// to display a link <a />, it accepts a base prop (optional) as well
<Link to="/posts" />
 
// to navigate to a certain path
navigate('/posts');
 
// to redirect to a certain path
redirect('/login');
 
// context: each rendered route will have a `ctx` prop with some routing metadata