Andrew Coelho 4e5eb34864 Change tutorial structure to individual folders for each lesson		10 lat temu
..
modules	4e5eb34864 Change tutorial structure to individual folders for each lesson	10 lat temu
README.md	4e5eb34864 Change tutorial structure to individual folders for each lesson	10 lat temu
index.html	4e5eb34864 Change tutorial structure to individual folders for each lesson	10 lat temu
index.js	4e5eb34864 Change tutorial structure to individual folders for each lesson	10 lat temu
package.json	4e5eb34864 Change tutorial structure to individual folders for each lesson	10 lat temu
webpack.config.js	4e5eb34864 Change tutorial structure to individual folders for each lesson	10 lat temu

Navigating with Link

Perhaps the most used component in your app is Link. Its almost identical to the <a/> tag you're used to except that its aware of the Router it was rendered in.

Lets create some navigation in our App component.

// modules/App.js
import { Link } from 'react-router'

export default React.createClass({
  render() {
    return (
      <div>
        <h1>React Router Tutorial</h1>
        <ul role="nav">
          <li><Link to="/about">About</Link></li>
          <li><Link to="/repos">Repos</Link></li>
        </ul>
      </div>
    )
  }
})

Now visit http://localhost:8080/ and click the links, click back, click forward. It works!

Next: Nested Routes

README.md

Navigating with Link