Node JS

Chapter 4 : EXPRESS YOUR SERVER

 JSETTING SKILLS PART 3

  1. Starting a server
  2. HTTP request
  3. Routing our app
  4. Sending HTML files
  5. Using middleware
  6. Static files

1. Starting a server

What is express?

1. Starting a server

install express

> npm i express -s

Requiring express

const express = require("express");

lunching express application

const app = express();

1. Starting a server

Setting our port

app.listen(port, ()=>{
  console.log(`Server running on port: ${port}`);
})

Listining to a port

const port = 3000;

2. HTTP request

What are HTTP requests ?

HTTP (Hypertext Transfer Protocol) is the underlying format used to structure requests and responses for effective communication between a client and a server. The message sent by a client to a server is known as an HTTP request.

HTTP requests work as the intermediary transportation method between a client/application and a server. The client submits an HTTP request to the server, and after internalizing the message, the server sends back a response. The response contains status information about the request.

2. HTTP request

What are HTTP requests ?

3. Routing our app

Create a route

app.get('/', (req, res)=>{
  res.send('Welcome to our first app');
})

This is a request method, there a bunch of them, and GET is the most common one, GET according to its name is used to "GET" or Request data from our server, in our case, each time we make a get request to the root route, the server sends back a message.

Each time we try to access any website, we are making by default a GET request to that specific URL, and the server usually responds with HTML (we'll see how to do that soon <3)

Every route method in express takes 2 parameters, the route(a string), and a callback function to execute each time that route is accessed.

the callback function takes gives us 2 parameters, express devs usually name them req and res

We'll talk more about them, but req contains information about the request made by the user, res, contains some method so the server can respond to a specific request, as you can see, send is one of these methods, which just sends back a string

3. Routing our app

Route parameters

app.get('/animal', (req, res)=>{
  res.send('Only cute animals here');
})

let's say that we want to create a route that sends back the name of the animal typed in it.
we can start by creating the route:

the idea is that we want the user to access a route that looks like this: "/animal/someanimal"
 
u might think that "someanimal" is some kind of parameter, and if you think so, well you are a 100% right!!

when we define our routes, we can define fields that should take anything the user types in, these fields are called params, and we define them like this:

app.get('/animal/:someanimal', (req, res)=>{
  const { someanimal } = req.param;
  res.send(`I see you like ${someanimal}`);
})

the parameter is then stored inside req.param, remember that req stores information that came from the request and parameters are one of them.

3. Routing our app

Using Routers as modules

const express = require("express"),
  router = express.Router();

router.get("/", (req, res) => {
  res.send("[cat,dog , cow ....]");
});
router.get("/:an", (req, res) => {
  // if animal exist in db
  res.send(`the name of this animal is ${req.params.an} `);
});
module.exports = router;
const express = require("express"),
  app = express(),
  port = 3000,
  animalsRoute = require("./routes/animal");

app.use("/animals", animalsRoute);

app.listen(port, () => {
  console.log(`Server started on ${port}`);
});

4. Sending HTML files

const express = require("express"),
    app = express(),
    port = 3000;

app.get("/", (req, res) => {
    res.sendFile("index.html", { root: __dirname + "/views" });
});

app.listen(port, () => {
    console.log(`Server started on ${port}`);
});

5. Using middleware

const express = require("express"),
    app = express(),
    port = 3000;
app.use(function (req, res, next) {
    const t = Date.now();
    next();
    console.log(
        req.method + "/ " + res.statusCode + " " + (Date.now() - t) + "ms"
    );
});
app.get("/", (req, res) => {
    res.sendFile("index.html", { root: __dirname + "/views" });
});
app.listen(port, () => {
    console.log(`Server started on ${port}`);
});

app.use(middleware);

debugers

5. Using middleware

const express = require("express"),
    app = express(),
    port = 3000,
    logger = require("morgan");

app.use(logger("dev"));

app.get("/", (req, res) => {
    res.sendFile("index.html", { root: __dirname + "/views" });
});

app.listen(port, () => {
    console.log(`Server started on ${port}`);
});

app.use(middleware);

morgan for debug

6. Static files

const express = require("express"),
    app = express(),
    port = 3000;

app.use("/public", express.static("public"));

app.get("/", (req, res) => {
    res.send("Hi welcome");
});

app.listen(port, () => {
    console.log(`Server started on ${port}`);
});

app.use(middleware);

EXPRESS YOUR SERVER

Ends

Node js Chapter 4

By Youcef Madadi

Node js Chapter 4

  • 345