Prerequisites
Node Packages
You will need to open a terminal window (MacOS or Linux) or command prompt (Windows) in your home or User directory, and make a subdirectory there for this project. I will call this directory tutorial, but you can substitute some other name.mkdir tutorialThen you need to initialise the directory for use with node and its packages. So type the following command:
cd tutorial
npm -y initNext, install the packages we will use. Type the command:
npm i express morgan leafletand watch the flurry of activity as the Node Package Manager (npm) downloads and installs those packages and all their many dependencies.
Web Site
Now that we have our workspace set up, we need to create the files and directory for our small website that will display maps of the NSW Transport System.First, we create a file called index.js:
const express = require('express');This creates a simple web server (using the 'express' package) with a brief log of requests (using the 'morgan' package). Express allows us to designate a subdirectory where it will look for web pages ('public') and it will use port 3000 for the web server - as we will see.
const morgan = require('morgan');
const app = express();
app.use(morgan('tiny'));
app.use(express.static('public'));
app.listen(3000);
Next, we must create the subdirectory public inside our tutorial directory which was mentioned in the index.js file:
mkdir publicNow, inside the public subdirectory, we must create a file called index.html:
<!doctype html>
<html>
<head>
<title>NSW Public Transport</title>
</head>
<body>
<h1>NSW Public Transport</h1>
</body>
</html>
Testing
As we have now created a web server and a home page, we are ready to test our work so far. At our command prompt type the command:node index.jsthen open your browser and go to the following web site:
http://localhost:3000/and you should see our new home page:
NSW Public TransportThat is our first step.
You can type "Control C" in the command prompt to stop the web server, and then close the window until you start Part 2.
No comments:
Post a Comment