Example use from route definitions to components rendered on page

[jaredloson]

Hello, I'm generally new to React and would like to try this simple router before anything more complex. From the Readme I see how I can define some routes that are mapped to component files, but I'm not sure how to use the Router to actually render those components. Based on other routers I've used, I assume something like the following is possible inside a top-level component:

render() {
    return (
      <div className="app">
        <div>
           <Header  />
        </div>
        <div>
          <Router /> {/* a Router component renders the appropriate "page" here? */}
        </div>
        <div>
          <Footer />
        </div>
      </div>
    );
  }

Am I on the right track?

[jaredatron]

yeah you're on the right track. The only piece missing here is the definition if your router. If you checkout the examples in the README you should see how to define a Router. Then when you render the router it will look at the current location, find the first matching component, and render it.

[jaredloson]

Great thank-you, I've got something working now.

[jaredatron]

Woot! I'd love to see what you're up to if its open source :)

[jaredloson]

Unfortunately it's not open source, but I can say that we're implementing a "headless" approach on Wordpress sites. Most have been single-page sites and we used Handlebars to render the layout. This one has a few pages, so we wanted to use a router, plus wanted to try out React. React-Router seemed far more complex than we needed. So far, this one is doing the job! Thanks again for your help.