0% found this document useful (0 votes)
23 views

COMP229WEEK2 - Developing Node - Js Web Application11

The document discusses developing Node.js web applications using the Connect module. Connect provides middleware functionality that allows intercepting HTTP requests and executing callback functions in a defined order. This allows adding modular application logic to handle different request scenarios. The document provides examples of creating a basic Connect app and registering middleware to handle requests to specific paths. It notes that Express builds upon Connect's approach to provide additional features for web app development.

Uploaded by

c.34
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
23 views

COMP229WEEK2 - Developing Node - Js Web Application11

The document discusses developing Node.js web applications using the Connect module. Connect provides middleware functionality that allows intercepting HTTP requests and executing callback functions in a defined order. This allows adding modular application logic to handle different request scenarios. The document provides examples of creating a basic Connect app and registering middleware to handle requests to specific paths. It notes that Express builds upon Connect's approach to provide additional features for web app development.

Uploaded by

c.34
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 17

Web Application Development

Developing Node.js web applications


 Node.js is a platform that supports various types of
application, but the most popular kind is the
development of web applications.

 Node's style of coding depends on the community to


extend the platform through third-party modules.

 These modules are then built upon to create new


modules, and so on.

 Companies and single developers around the globe are


participating in this process by creating modules that
wrap the basic Node APIs and deliver a better starting
point for application development.
10/06/2023 Web Application Development 2
Developing Node.js web applications
 There are many modules to support web application
development, but none as popular as the Connect
module.

 The Connect module delivers a set of wrappers around


the Node.js low-level APIs to enable the development of
rich web application frameworks.

10/06/2023 Web Application Development 3


Developing Node.js web applications
 To understand what Connect is all about, let's begin with a basic
example of a basic Node web server.

 In your working folder, create a file named server.js that


contains the following code snippet:

const http = require('http');


http.createServer((req, res) => {
res.writeHead(200, {
'Content-Type': 'text/plain'
});
res.end('Hello World');
}).listen(3000);

console.log('Server running at
http://localhost:3000/');
10/06/2023 Web Application Development 4
Developing Node.js web applications
 To start your web server, use your command-line tool and navigate to your working
folder.

 Then, run the Node.js CLI tool and run the server.js file as follows:

$ node server

 Now, open http://localhost:3000 in your browser and you'll see the Hello
World response.

 In this example, the http module is used to create a small web server listening to
the 3000 port.

 You begin by requiring the http module and then use the createServer() method
to return a new server object.

 The listen() method is then used to listen to the 3000 port.

 Notice the callback function that is passed as an argument to the


createServer() method.
10/06/2023 Web Application Development 5
Meet the Connect module
 Connect is a module built to support the interception of
requests in a more modular approach.

 In the first web server example, you learned how to


build a simple web server using the http module.

 If you wish to extend this example, you'd have to write


code that manages the different HTTP requests sent
to your server, handles them properly, and provides the
correct response to each request.

 Connect creates an API exactly for that purpose.

10/06/2023 Web Application Development 6


Meet the Connect module
 Connect uses a modular component called middleware, which
allows you to simply register your application logic to predefined
HTTP request scenarios.

 Connect middlewares are basically callback functions, which get


executed when an HTTP request occurs.

 The middleware can then perform some logic, return a response,


or call the next registered middleware.

 While you will mostly write custom middleware to support your


application needs, Connect also includes some common
middleware to support logging, static file serving, and more.

 The way a Connect application works is using an object called


dispatcher.
10/06/2023 Web Application Development 7
Meet the Connect module
 The dispatcher object handles each HTTP request
received by the server and then decides the order of
middleware execution in a cascading form.

 To understand Connect better, take a look at the


following diagram:

10/06/2023 Web Application Development 8


Meet the Connect module
 The preceding diagram illustrates two calls made to the Connect
application: the first is handled by a custom middleware and the
second is handled by the static files middleware.

 Connect's dispatcher initiates the process, moving on to the next


handler using the next() method, until it gets to a middleware
responding with the res.end() method, which will end the
request handling.

 In the next Lesson, you'll create your first Express application,


but Express is based on Connect's approach.

 So, in order to understand how Express works, we'll begin by


creating a Connect application.

10/06/2023 Web Application Development 9


Meet the Connect module
 In your working folder, create a file named server.js that contains the following
code snippet:

const connect = require('connect');


const app = connect();
app.listen(3000);

console.log('Server running at http://localhost:3000/');

 As you can see, your application file is using the connect module to create a new
web server.

 However, Connect isn't a core module, so you'll have to install it using npm.

 As you already know, there are several ways of installing third-party modules.

 The easiest one is to install it directly using the npm install command.

10/06/2023 Web Application Development 10


Connect middleware
 Connect middleware is basically a JavaScript function
with a unique signature.

 Each middleware function is defined with the following


three arguments:
 req: This is an object that holds the HTTP request
information
 res: This is an object that holds the HTTP response
information and allows you to set the response
properties
 next: This is the next middleware function defined
in the ordered set of Connect middleware

10/06/2023 Web Application Development 11


Connect middleware
 When you have a middleware defined, you'll just have to register it with the
Connect application using the app.use() method.

 Let's revise the previous example to include your first middleware. Change
your server.js file to look like the following code snippet:

const connect = require('connect');


const app = connect();

function helloWorld(req, res, next) {


res.setHeader('Content-Type', 'text/plain');
res.end('Hello World');
};

app.use(helloWorld);
app.listen(3000);
console.log('Server running at http://localhost:3000/');

10/06/2023 Web Application Development 12


Mounting Connect middleware
 As you may have noticed, the middleware you registered responds
to any request, regardless of the request path.

 This does not comply with modern web application development


because responding to different paths is an integral part of all
web applications.

 Fortunately, Connect middleware supports a feature called


mounting, which enables you to determine which request path is
required for the middleware function to get executed.

 Mounting is done by adding the path argument to the app.use()


method.

10/06/2023 Web Application Development 13


Mounting Connect middleware
 To understand this better, let's revisit our previous
example. Modify your server.js file to look like the
following code snippet:

10/06/2023 Web Application Development 14


Mounting Connect middleware
 A few things have been changed in the previous example.

 First, you mounted the helloWorld() middleware to respond


only to requests made to the /hello path.

 Then, you added another (a bit morbid) middleware called


goodbyeWorld() that will respond to requests made to the
/goodbye path.

 Notice how, as a logger should do, we left the logger()


middleware to respond to all the requests made to the server.

 Another thing you should be aware of is that any requests made to


the base path will not be responded to by any middleware because
we mounted the helloWorld() middleware to a specific path.

10/06/2023 Web Application Development 15


Mounting Connect middleware
 Connect is a great module that supports various
features of common web applications.

 Connect middleware is super simple, as it is built with a


JavaScript style in mind.

 It allows the endless extension of your application logic


without breaking the nimble philosophy of the Node
platform.

10/06/2023 Web Application Development 16


Mounting Connect middleware
 While Connect is a great improvement over writing your web
application infrastructure, it deliberately lacks some basic
features you're used to having in other web frameworks.

 The reason lies in one of the basic principles of the Node


community: create your modules lean and let other developers
build their modules on top of the module you created.

 The community is supposed to extend Connect with its own


modules and create its own web infrastructures.

 In fact, one very energetic developer named TJ Holowaychuk did it


better than most when he released a Connect-based web
framework known as Express.

10/06/2023 Web Application Development 17

You might also like