title: How to use Node.js File System to set the src of an img tag in a browser?
body: <p>I am creating an html file meant to be viewed in a browser, and on the page there is a slideshow of images that plays. I would like the iterations of pictures to play through all pictures that are in a subfolder.</p>
  
  <p>Optimally, I should be able to add/remove pictures from the images folder without touching the code or ever hardcoding the names of the files. I am trying to use node.js and <code>require('fs')</code> to return a list of available files from the folder, but I am completely new to node and have no idea how to call the node file from the browser. currently this is what I have:</p>
  
  <p>website.html</p>
  
  <p><code>&lt;script src="app.js"&gt;&lt;/script&gt;</code></p>
  
  <p>app.js</p>
  
  <pre><code>const fs = require('fs');
  
  const files = fs.readdir('./images', function(err, files) {
      if (err) console.log('Error: ', err);
      else console.log(files);
  })
  </code></pre>
  
  <p>Running this in the browser throws the error <code>require is not defined</code>.</p>
  
  <p>I have run <code>npm install -g browserify</code> in command prompt against the folder.</p>
  
  <p>How can I implement my node file in such a way that the browser can access the files in the images folder?</p>