File explorer app help

Hi,

I have this app that I’m working on :

This is the code for files :

const fs = require('fs');

let files = fs.readdirSync('./');

let stats = fs.statSync('./');

files.forEach(function(files) {

if (stats.isFile()){

$("#list").append("<li>" + "File : " + files + "</li>")

}

else if(stats.isDirectory()) {

$("#list").append("<li>" + "Folder : " + files + + "</li>")

}

else {$("#list").append("<li>NO FILE/FOLDER!</li>")}

});

console.log(files)

console.log(stats.isDirectory())

console.log(stats.isFile())

The console says only true and false, It’s checking the stats only of the root folder, not the all files. I’ve also tried to make a second for each but It keeps saying stats is not a function.

  1. How can I check all files in that directory for their stats?
  2. How can I read and check their stats for all files and folders on the Windows partitions like a normal file explorer, not a fixed path like the root folder.

Thanks!

Set up a recursive function that looks at everything in the files variable. Don’t store stats as a separate variable; instead, you should have a single JavaScript object that stores all of the relevant information and builds a complete model of the file tree. It would look something like this (I’m assuming the name of your top folder since you haven’t provided it):

{
"file-explorer":
  {
    files:
      {
        ".gitignore":
          {
            files: NULL,
            stats: {...}
          },
        "buttons.js":
          {
            files: NULL,
            stats: {...}
          },
        "files.js":
          {
            files: NULL,
            stats: {...}
          },
        "icons":
          {
            files: {...},
            stats: {...}
          },
      },
    stats: {
      isDirectory: true,
      isFile: false,
      dev: 2114,
      ino: 48064969,
      mode: 33188,
      nlink: 1,
      uid: 85,
      gid: 100,
      rdev: 0,
      size: 527,
      blksize: 4096,
      blocks: 8,
      atimeMs: 1318289051000.1,
      mtimeMs: 1318289051000.1,
      ctimeMs: 1318289051000.1,
      birthtimeMs: 1318289051000.1,
      atime: Mon, 10 Oct 2011 23:24:11 GMT,
      mtime: Mon, 10 Oct 2011 23:24:11 GMT,
      ctime: Mon, 10 Oct 2011 23:24:11 GMT,
      birthtime: Mon, 10 Oct 2011 23:24:11 GMT
    }
  }
}

How can I read and check their stats for all files and folders on the Windows partitions like a normal file explorer, not a fixed path like the root folder.

Node will not do it for you. You will have to tell it where to look (through a recursive function, naturally). In general, you do not want to read the user’s entire computer all at once, though. That takes a long time even for native code programs, like WinDirStat. Only look at the folders the user actually wants to see (reading and displaying a new folder when it becomes relevant takes very little time, but reading every node_modules/ folder on your computer would strain both your CPU and your patience.

1 Like

I got the app to show correctly if It’s a folder or a file, do I need to store the files in a json file?

Also to show files I make <li> elements, later if I go through folders should I remove <li> elements and create new ones for the current folder that is?

And one more thing that I can’t find is how to get the file path of “This PC”, display windows partitions and linux too?

No, because you want your file explorer to be constantly updating whenever something happens in a folder you have open. You don’t need to use a file as a cache since you’re not retrieving that much information per operation, and using it as primary storage would just add unnecessary write/read operations into everything the user wants to do.

Also to show files I make <li> elements, later if I go through folders should I remove <li> elements and create new ones for the current folder that is?

You’re going to have to either remove the old elements manually, or use a framework like React that does cleanup on its own.

And one more thing that I can’t find is how to get the file path of “This PC”, display windows partitions and linux too?

It looks like the NPM package drivelist is what you want.

1 Like