When working out a nodejs project it would be nice to have a way to just quickly create something that will just serve an index of a public html folder and that is it. I could take the time to work out my own solution when it comes to that, but even simple things like this can often prove to be a little time consuming. If I am willing to make expressjs part of the stack, and often that is one npm package that I do not minde using, then there is a middleware for express called serve index that can make quick work of this kind of task.
The serve index middleware can be combined with the built in express static function as a way to serve an index for a path, while serving up files when a full path with file name is given. So then bu just using express and one additional package I can quickly have a system that will work well as a way to serve up and index of files for a path of files some of which might be html files. In addition when a user clicks an html file all the assets will load thanks to the built in express static function.
So then in this post I will be going over a quick simple expressjs example that will involve using nodejs, express, and serve-index to create a simple static server that will host a public folder.
In this section I will be going over a quick, simple, example of serve index that I put together in a flash. When I made this I was using nodejs 10.24, with express 4.17.1, and serve-index 1.9.1. If for some reason the code example here breaks, be sure to check the version numbers of the various assets that you are using. I will be going over the process of setting this up from the ground up, but I also have the source at my test express repo
In the public folder I just have a single index.html file that looks like this.
First I use serve index for the root path of the site, and any additional paths. For any url then that is a path to a folder the serve index middleware should work for that. In the event that the path is to a file then the flow should continue to the next middleware function and for this I am using the express built in static function to serve the file. After that I just listen on the port that I want that can be set by environment variable, arguments, or a hard coded default of 8080.
Now that I have everything in place I can start the ever on a given port of say 8000 like this.
So then this basic example of serve-index seems to work as expected, I have to say that this is a nice little solution for this sort of thing and I like to use it in some of my repositories that have to do with collections of examples for framworks and so forth.
Well that is it for now when it comes to the serve index middleware at least for now. There might be a few more things to write about when it comes to other use case examples for this though. What I wanted is to have a way to just always list files for any path, however I might want to have another system worked out for when there is an index.html file in a path. For now it is fine that an index.html file is just listed along with everything else, but there might be situations in which I would like to have the index.html file be what is used for paths where there is such a file, and only use serve index for paths where there is no such file.