Let's create a new folder called servingFiles. In it, we're going to make a public folder with an index.html file, an app.js file & a style.css file, also we're going to create a favicon.ico file & an index.js in our root folder. We're going to make some simple styles to each of our pages.

First, we're going to make an if statement to see if the request coming in is a get request. If it is, we're going to search the url for the file extension. If the extension is found, we'll read the file path with fs.readFile.

The fs.readFile method is one of the most useful methods in node. This allows you to read any file path & display it's contents. It can take an absolute or relative path as it's first argument. The second argument gives you a callback function with the file data as it's argument.

Call fs.readFile with the first argument being "." + req.url. If the user types in localhost:3000/public/index.html, fs.readFile will read the path "./public/index.html". The second argument will be a function with the error object & the contents of the file. If there is no file in that path, the error object will be true else, false. When the path comes back true, you can do anything you want with the contents of the file. We're going to view the index.html page, by writing the data to the response object.

The response object lets you send your custom response for each incoming request you receive. The res.writeHead method lets you write the headers for the response. The first argument is the status code which will be 200, the second argument will be the headers object. The headers will take the Content-Type header which is the file type for the data of the file, in this case html. The second argument will be "{Content-Type: text/html}". Then, will use response.end to write our data & end this request. The response.end method takes the data, the encoding & an optional callback function to be performed when the response has ended. We're going to use res.end(data, 'utf8');

This will read the index.html file & display the page.

When a user types in the domain name(in this case localhost:3000) the req.url will be "/", also the server will automatically look for the favicon.ico file. If the req.url = "/" we want to serve the index.html file. Then we're going to repeat the same steps for css, js & ico files.

Our index.html file makes two request. One to /public/style.css & to /public/app.js. The server gets those request just as they're written here. If you were to put a "." before the first "/", the server would not read the ".". Html files make request through the & tags, css files through the font-face src property & background-image src property, js files through the src, href attributes & the fetch method.