react-isomorphic-starterkit icon indicating copy to clipboard operation
react-isomorphic-starterkit copied to clipboard

Routing in 5.0.5

Open thehashrocket opened this issue 10 years ago • 4 comments

Let me preface this by saying that I'm really interested in this kit. I attempted a different one, before, but it had way more than what we needed and it just got in the way. I like the "just the basics" that you have in this kit. Thank you!

So I attempted to create my first route using this starter kit. Here's what I attempted:

import React from "react";
import {Router, Route, Link, browserHistory} from "react-router";

import Main from "./Main";
import Home from "./Home";

/**
 * The React Router 1.0 routes for both the server and the client.
 */
module.exports = (
    <Router history={browserHistory}>
        <Route path="/" component={Main}>
            <Route path="/about" component={Home}/>
        </Route>
    </Router>
);

However, that doesn't work? It's the example provided by react-router so I assumed it would. Instead I needed to do this:

import React from "react";
import {Router, Route, Link, browserHistory} from "react-router";

import Main from "./Main";
import Home from "./Home";

/**
 * The React Router 1.0 routes for both the server and the client.
 */
module.exports = (
    <Router history={browserHistory}>
        <Route path="/" component={Main} />
        <Route path="/about" component={Home}/>
    </Router>
);

Did I do something wrong? '/about' didn't work until I changed the route code to be the bottom.

thehashrocket avatar Jan 08 '16 04:01 thehashrocket

Do you get a 404 Not found in the first case?

It might be a bug with nested routes support. I haven't tested nested routes with the starterkit.

RickWong avatar Jan 09 '16 12:01 RickWong

So, I was getting a 404 error, you're right. I was able to get it working like this:

<Router history={browserHistory}>
        <Route path="/" component={App}>
            <IndexRoute component={Classrooms}/>
        </Route>
        <Route path="/about" component={Home}/>
        <Route name="RegularPage" path="/RegularPage" component={RegularPage} />
    </Router>

thehashrocket avatar Jan 09 '16 15:01 thehashrocket

Confirm that /about works as a sibling, but not as a child of /.

~~I'll try and dig into Transmit.~~

routes.js just needed to be updated.

chemoish avatar Jan 11 '16 18:01 chemoish

My Routes are working, but every time i hit a new route the whole page gets reloaded, how do i fix that ?

sajjad26 avatar Feb 25 '16 04:02 sajjad26