firstNode.md

Nodejs and Serverside

Install Nodejs and NPM

• Already installed on Github Codespaces

• On your local machine, you can install Nodejs and NPM using the package manager of your choice.

• Example on MacOS, you can use Homebrew: brew install node

• On Windows, you can download the installer from the Nodejs website.

• On Windows, you can also use the Windows Subsystem for Linux (WSL) to install Nodejs and NPM using the Linux instructions above.

Advance Installation Steps

Advance Installation Steps

• On Ubuntu, you can use: Linux

sudo apt install nodejs npm

• If you want to install Nodejs and NPM using the Node Version Manager (NVM), you can follow these steps: https://github.com/nvm-sh/nvm

• This will install NVM on your system.

• After that, you can install Nodejs using NVM:

nvm install --lts

Windows

• On Windows, https://github.com/coreybutler/nvm-windows is a good alternative to NVM.

Create a new Nodejs project

1. Create a new directory for your project my-node-project. This is called the project root / project directory
2. Inside the directory, run npm init to initialize a package.json configuration file (you can keep pressing Enter to use defaults)
3. Install expressjs using npm install express
4. Create a new file called server.js in the project directory

"use strict";

// These are immport statements
const express = require('express');
const app = express();

// ***
// This are the route handlers
// You can add many more here
app.get('/posts', function (req, res) {
  res.type("text").send("Hello World");
});
// ***

// This is the server listener
app.listen(8080);
console.log("Server is running on port 8080");

5. Run the server using node server.js
6. Open your browser and go to http://localhost:8080/posts to see the response "Hello World"
7. You can also use ThunderClient / your browser to test the API endpoint.
8. Don't forget to add a .gitignore before commiting the code and pushing to github

Creating more endpoints

• You can create more endpoints by adding more route handlers to the app object.

// Add this line to create a new endpoint
app.get('/posts/:id', function (req, res) {
  res.type("text").send("Post with ID: " + req.params.id);
});

Setting Content-Type header

• You can set the Content-Type header using the res.type() method.
• This code responds with a text/plain content type.

app.get('/hello', function (req, res) {
  // res.set("Content-Type", "text/plain");
  res.type("text"); // same as above
  res.send('Hello World!');
});

• You can also set the Content-Type header to application/json for JSON responses.

app.get('/json', function (req, res) {
  res.type("json");
  res.json({ message: "Hello World!" });
});

Request Paramaeters

Route path: /states/:state/cities/:city

Request URL: http://localhost:8000/states/wa/cities/Seattle

req.params: { "state": "wa", "city": "Seattle" }

app.get('/states/:state/cities/:city', function (req, res) {
  const state = req.params.state;
  const city = req.params.city;
  res.send(`State: ${state}, City: ${city}`);
});

• You can also use query parameters in the URL.

app.get("/cityInfo", function (req, res) {
  let state = req.query.state; // wa
  let city = req.query.city;   // Seattle
  // do something with variables in the response
});

All endpoints we just created

Try all these endpoints in your browser or ThunderClient:

• /posts
• /posts/:id
• /hello
• /json
• /states/:state/cities/:city
• /cityInfo?state=wa&city=Seattle