title: Load image from django rest in React JS
body: <p>Trying to get image stored in django model in react js</p>
  
  <p>Firstly I have upload image from react to django rest and saved it in a model.It saved like this "/media/project_mainimage/newimage.jpg".But now I want to get this image from django to react and display in  tag but it doesn't load.</p>
  
  <p><strong>Settings.py</strong></p>
  
  <pre><code>           MEDIA_URL='/media/'
             MEDIA_ROOT=os.path.join(BASE_DIR, 'media')
  </code></pre>
  
  <p><strong>Models.py</strong></p>
  
  <pre><code>       description=models.CharField(max_length=600,blank=True,null=True)
         main_image=models.ImageField(upload_to='project_mainimage')
         videourl=models.CharField(max_length=450,blank=True,null=True)
  </code></pre>
  
  <p><strong>Urls.py</strong></p>
  
  <pre><code>urlpatterns = [
  
  url('admin/', admin.site.urls),
  url(r'^portfolio/', include('PortfolioApp.urls')),
  
     ]+ static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
  </code></pre>
  
  <p><strong>React Js component:</strong></p>
  
  <pre><code>    &lt;img  src={this.state.project.main_image} width="184" height="40" 
      alt="Project image"/&gt;  // shows nothing
      &lt;h1&gt;{this.state.project.main_image}&lt;/h1&gt; // shows "/media/project_mainimage/newimage.jpg"
  </code></pre>