title: Using React with Django, do I need react-router?
body: <p>Suppose I have an existing Django webapp with a bunch of urls in urls.py. Now suppose I want to add a number of webpages to this Django app, where the new webpages are built using React. </p>
  
  <p>From what I understand, React has its own routing capability (in react-router) so that if I go to <code>mydomain.com/page1/</code> it will serve one thing and if I go to <code>mydomain.com/page2/</code> it will serve something else. </p>
  
  <p>But what if I don't want to use react-router? In other words, if I have say 10 new pages to add and each page will have its own URL, then why can't I just set this up in Django's urls.py file?</p>
  
  <p>Currently in <code>urls.py</code> I have a url defined like this:</p>
  
  <pre><code>url(r'^testview/', views.testview),
  </code></pre>
  
  <p>In <code>views.py</code> I define testview like this:</p>
  
  <pre><code>def testview(request):
      return render(request, 'testview.html', {})
  </code></pre>
  
  <p>My Django templates are stored in a folder <code>BASE_DIR/myproject/templates/</code> and I set the TEMPLATES variable inside <code>BASE_DIR/myproject/settings.py</code> so Django knows where to find the templates. 
  So in my view method above, <code>testview.html</code> refers to <code>BASE_DIR/myproject/templates/testview.html</code>. The contents of that file are:</p>
  
  <pre><code>{% extends "base.html" %}
  {% load render_bundle from webpack_loader %}
  
  {% block main %}
  &lt;div id="App1"&gt;&lt;/div&gt;
  {% render_bundle 'vendors' %}
  {% render_bundle 'App1' %}
  {% endblock %}
  </code></pre>
  
  <p>Finally, I defined <code>App1</code> in <code>App1.jsx</code> as follows:</p>
  
  <pre><code>import React from "react"
  
  import Headline from "../components/Headline"
  
      class App1 extends React.Component {
        render() {
          return (
            &lt;div className="container"&gt;
              &lt;div className="row"&gt;
                &lt;div className="col-sm-12"&gt;
                  &lt;Headline&gt;Hello There!&lt;/Headline&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          )
        }
      }
  </code></pre>
  
  <p>This works fine, but what if I wanted to have 10 different pages? Would I need new app files like <code>App2.jsx</code>, <code>App3.jsx</code>, etc, one for each page?</p>
  
  <p>Finally, suppose I want to pass a Django variable to my React app, for example:</p>
  
  <pre><code>def testview_with_time(request):
      now = datetime.datetime.now()
      return render(request, 'testviewtime.html', {
          'currtime': '%s' % str(now),
      })
  </code></pre>
  
  <p>Here I pass the variable <code>currtime</code>. How do I pass this into the React <code>App1</code> class?</p>