title: "Dynamic" paths in React.js
body: <p>I'm new to React.js, so maybe my question is dumb, but I've searched a lot for this information and I just haven't found it, so let's ask.</p>
  
  <p>I've already learned the basics of <code>Router</code> in React, and I can create simple routes, as to say:</p>
  
  <ul>
  <li>My main page is in <code>localhost/</code></li>
  <li>My about page is in <code>localhost/about</code></li>
  <li>My contacts page is in <code>localhost/contacts</code></li>
  </ul>
  
  <p>You can see an exemple of what I'm talking about here: <a href="https://codesandbox.io/s/react-router-dom-example-8vcqu?from-embed" rel="nofollow noreferrer">https://codesandbox.io/s/react-router-dom-example-8vcqu?from-embed</a>. So, I know how to create a application like this.</p>
  
  <p>But I didn't get a clue of how to create an routing system to give me the following:</p>
  
  <ul>
  <li>When the user select School A, React lead the user to <code>localhost/report/school_a</code></li>
  <li>When the user select School B, React lead the user to <code>localhost/report/school_b</code></li>
  <li>When the user select City Z, React lead the user to <code>localhost/report/city_z</code></li>
  <li>When the user select City W, React lead the user to <code>localhost/report/city_w</code></li>
  </ul>
  
  <p>Considering that a school report presents the same layout for all schools, as a city report presents the same for all cities (what changes is only the data showned). Also considering that I have something like 3.000 schools to share reports.</p>
  
  <p>All I wanna know is what topic I need to study to understand that (i.e.: dynamic routing?). You can assume I'm not getting the basics correctly, as I'm newbie to all this. Maybe I even not getting API concept correctly.</p>