Reading image files asynchronously and displaying them on the page

Question

I am trying to display images from a folder in my project using the "fs" module with NodeJS. I need to read all images in a directory and run them in a loop for them to be displayed. I was able to do it but I'm not sure if this is the proper or good way to do it.

I inserted my readdir (Reading Files Asynchronously) inside my Homepage route. The images were displayed but I have no one to ask if I did it the proper way.

const express = require('express');
const router = express.Router();
const fs = require('fs');

router.get('/', function(){ 
    fs.readdir('./assets/images/', (err, files) => {
        if(err) {
            throw err;
        }
        res.render('home', {
            files: files
        });
    });
});

module.exports = router;

Answer 1

• Don't use callbacks, it's hard to read and maintain, the fs.readdir function will return a promise if you didn't provide a callback function.
• Use arrow functions when you could.
• Respond with an error instead of throwing (unless you have a catch wrapper middleware).
• Use property shorthands.
• You forgot req and res.

Try this:

const express = require('express');
const router = express.Router();
const fs = require('fs');

router.get('/', async (req, res) => { 
  try {
    const files = await fs.readdir('./assets/images/')
    res.render({ files })  // notice the property shorthand
  } catch (error) {
    res.status(404).json({ error })
  }
});

module.exports = router;

Answer 2

That's not a lot to review, but it looks textbook good.

If anything, the value of './assets/images/' could have been an upfront declared constant, or could have been retrieved from a configuration file.