title: How can i show image in my html file that's hosted on heroku?
body: <p>Hi everyone reading this.</p>
  <p>So to summarize, I'm trying to create a webpage for my heroku app, but when I try to add images on it, they won't print. So far my files are organized this way:</p>
  <p>Main File</p>
  <ul>
  <li>index.js</li>
  <li>Front
  <ul>
  <li>adding.html</li>
  <li>pic.png</li>
  </ul>
  </li>
  </ul>
  <p>Of course names are not exactly those, but you get the point</p>
  <p>The way i call them in my html file is :</p>
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;
              Hub2Boond - Ajout d'utilisateur
          &lt;/title&gt;
           
          &lt;!-- templates --&gt;
          &lt;style&gt;
              .bgQueriadis {
                  background-color: rgb(129,192,240);
                  width: 400px;
                  position: absolute;
                  top: 150px;
                  left: 40%;
                  width: 450px;
                  bottom:50px;
              }
          &lt;/style&gt;
          &lt;style&gt;
              .logoQueriadis {
                  background-color: rgb(54,80,100);
                  width: 400px;
                  position: absolute;
                  bottom: 0%;
                  left: 0%;
                  width: 100%;
                  height: 50px;
              }
          &lt;/style&gt;
          &lt;style&gt;
              .logoAPI {
                  background-color: rgb(54,80,100);
                  width: 400px;
                  position: absolute;
                  top: 0%;
                  left:0%;
                  width: 100%;
                  height: 150px;
              }
          &lt;/style&gt;
          
      &lt;/head&gt;
      &lt;body&gt;
          &lt;div class=&quot;logoAPI&quot;&gt;
              &lt;p&gt;&lt;br&gt;&amp;nbsp &amp;nbsp &amp;nbsp
              &lt;img src=&quot;./HubSpot_LogoWBG.png&quot; alt=&quot;Logo Hubspot&quot; height=&quot;76px&quot; style=&quot;margin: auto;&quot;&gt;
              &lt;img src=&quot;https://cdn-icons-png.flaticon.com/512/0/248.png&quot; alt=&quot;pretty arrow&quot; height=&quot;76px&quot; style=&quot;margin: auto;&quot;&gt;
              &lt;img src=&quot;./BoondTR.png&quot; alt=&quot;LogoBoondManager&quot; height=&quot;76px&quot; style=&quot;margin: auto;&quot;&gt;
              &lt;/p&gt;
          &lt;/div&gt;
          &lt;div class=&quot;bgQueriadis&quot;&gt;
              &lt;br&gt;&lt;br&gt;
              &lt;p style=&quot;margin: auto; width: 400px;font-family: 'Raleway', sans-serif;font-size: 40px;&quot;&gt;Informations enregistrées avec succès, vous pouvez quitter la page!&lt;/p&gt;
          &lt;/div&gt;
          &lt;div class=&quot;logoQueriadis&quot;&gt;
              &lt;p style=&quot;font-family: 'Raleway', sans-serif; color:white;&quot;&gt;By Queriadis Consulting &amp;nbsp&lt;img src=&quot;./a2f8383a-a348-4d95-a059-3ae2fb574171.png&quot; alt=&quot;Logo Queriadis&quot; height=&quot;20px&quot; style=&quot;margin: auto;&quot;&gt;
              &lt;/p&gt;
          &lt;/div&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <p>I know it's poorly coded, I'm still a beginner, but any help, idea or correction is much appreciated. Thanks</p>