개발세발

Node.js - 2️⃣ 페이지 띄우기 본문

코딩공부/Node

Node.js - 2️⃣ 페이지 띄우기

뉼👩🏻‍💻 2022. 11. 20. 01:00
728x90
반응형
SMALL

 

🟥  http로 서버 생성하고 서버로부터 응답을 주고받기 

 

📍node 실행

 

1️⃣ http

//module 불러오기
const http = require("http");

//서버가 들어갈 변수
const server = http.createServer((req, res) => {
  res.write("<h1>hello from nodejs</h1>");
  res.end();
});

server.listen(3000, () => {
  console.log("The server is listening on port 3000");
});

 

 

 

기본 url이 아닌 다른 url로 접속했을 때 나오는 화면 구성 

//서버가 들어갈 변수
const server = http.createServer((req, res) => {
  if (req.url === "/") {
    res.write("<h1>hello from nodejs</h1>");
    res.end();
  } else {
    res.write("<h1>You have entered invalid ulr</h1>");
  }
});

 

또는 백틱을 사용하여 url 확인가능 

    res.write(`<h1>You have entered this url : ${req.url}</h1>`);

 

 

2️⃣ express

 

//express 사용
const express = require("express");

//서버
const server = express();

//서버 요청시 get, post, delete, put 메소드 중 하나를 사용. get이 기본값
server.get("/", (req, res) => {
  res.send("<h1>Hello from nodejs2</h1>");
});

server.listen(3000, (err) => {
  if (err) return console.log(err);
  console.log("The server is listening on port 3000");
});

 

- url 에 따른 페이지 띄우기 

//express 사용
const express = require("express");

//서버
const server = express();

//서버 요청시 get, post, delete, put 메소드 중 하나를 사용. get이 기본값
server.get("/", (req, res) => {
  // dirname : 경로
  // filename : 파일 이름
  res.sendFile(__dirname + "/index.html")
});

server.get("/about", (req, res) => {
  res.sendFile(__dirname + "/about.html")
})

server.listen(3000, (err) => {
  if (err) return console.log(err);
  console.log("The server is listening on port 3000");
});

 

 

 

📍Middleware(미들웨어) 

 

//express 사용
const express = require("express");

//서버
const server = express();

//@@ 미들웨어 추가
server.use((req, res) => {
  console.log("hi form client");
});

//서버 요청시 get, post, delete, put 메소드 중 하나를 사용. get이 기본값
server.get("/", (req, res) => {
  // dirname : 경로
  // filename : 파일 이름
  res.sendFile(__dirname + "/index.html");
});

server.get("/about", (req, res) => {
  res.sendFile(__dirname + "/about.html");
});

server.listen(3000, (err) => {
  if (err) return console.log(err);
  console.log("The server is listening on port 3000");
});

- 미들웨어에서 멈춰있고 이후 코드가 정상적으로 실행되지 않음 

 

 

* 미들웨어에 next를 추가하고 값이 넘어가 지는지 req.user를 만들어서 테스트 

//미들웨어
server.use((req, res, next) => {
  req.user = {
    id: "1234",
  };
  next();
  console.log("hi form client");
});

//서버 요청시 get, post, delete, put 메소드 중 하나를 사용. get이 기본값
server.get("/", (req, res) => {
  console.log(req.user);
  // dirname : 경로
  // filename : 파일 이름
  res.sendFile(__dirname + "/index.html");
});

 

url이 "/"인 경우에만 { id: '1234' } 가 실행됨 

- about이나 다른 url 로 접속했을 때는 출력되지 않음 

 

 

📍404페이지 (page not found)

server.use((req, res) => {
  res.sendFile(__dirname + "/404.html");
});

 

저어엉엄말 오랜만에 다시 만들어보는 404.html 

 

📍css 파일 적용해보기

//css 파일 적용해보기
server.use(express.static(__dirname + "/public"));

 

 

 

728x90
반응형

'코딩공부 > Node' 카테고리의 다른 글

node, 프론트, 백 분리하기  (0) 2022.12.26
Node.js - 3️⃣ 템플릿 엔진  (0) 2022.11.20
Node.js - 1️⃣ 개념  (0) 2022.11.18