Okay, let's get into the nitty-gritty right away, and I'll explain what's going on. Add all of this into a new file in lib/chapter8 called index.js:
import * as Koa from 'koa';
import * as bodyParser from 'koa-bodyparser';
const app = new Koa();
const port = process.env.PORT || 5555;
app.use(bodyParser());
app.listen(port, () => console.log(`Listening on port ${port}`));
export default app;
Here, we import Koa and Koa Body Parser, instantiate Koa, assign a port number (defaulting to 5555), tell Koa to use the Body Parser middleware (which mainly just interprets POST request bodies into JavaScript objects for us) and then tell Koa to listen on that port.
What is process.env.PORT? The process.env is simply a global object of all environment variables from the shell that spawned the NodeJS script. We listen for requests on either port 5555 or whatever the PORT environment variable is set to. I've emphasized that last line because it's a key tenant in building web applications such as this -- keep all configuration in environment variables, so you never have to worry about storing plain text passwords in your source code (or in this case, the port number, which Heroku will set for us).
Your shell keeps a number of variables persistent that it uses to do things -- you might be familiar with $PATH, which is a list of directories the shell looks in for executable code. Environment variables can also be used in web servers to hold configuration details, which can then be consumed by web applications (such as the one we're making).
One example of where this is useful is database connection details -- you generally don't want to version control sensitive details, such as database passwords, so you instead provide them to your web server as environment variables, which your application then uses to connect to the database. There are a ton of other benefits to this, but suffice to say making your applications configurable through environment variables is a key aspect of writing good JavaScript server applications.
Add the following line:
app.use(ctx => ctx.body = 'Hi there!');
This creates a brand new piece of middleware and adds it to the stack. Our middleware here takes one argument, ctx, which is the Koa context object. Every time somebody makes a request to your application, a new context is created, and it navigates down through your middleware. Unlike with Express, a Koa context handles both the request (the incoming message from the user's browser to your application) and the response (what your application sends back to the browser). What we do here is set the response body to simply Hi there! and continue onward. Eventually, we reach the end of the middleware chain, and the response is sent back to the browser.
Now, go back to the command line and type the following:
$ npm run server
Then, go to http://localhost:5555, and you should be greeted with the following text:
Congrats, you are now a bonafide web applications developer.
Well, not quite, but rapidly getting there.
One thing worth noting at this point is that instructions with callbacks in a closure execute simultaneously, just like in the browser. In Chapter 4, Making Data Useful, we discussed how JavaScript is said to be asynchronous -- when you write your server code, you can't rely on something to be blocking, like you can in PHP, for instance. Although it's a bit hard to wrap your head around this when starting in Node, this has really exciting ramifications for server code, making it very fast and easy to scale horizontally.
Let's do something cooler than displaying a static message on the screen, and let's break out a brand new D3 feature while we're at it.