[Express/node] FirstApp

(Udemy) The Web Developer 부트캠프 2023 :: 섹션 33: Express로 서버 제작하기

(Express 공식 문서) https://expressjs.com/ko

 

[334. 우리의 첫 번째 Express 앱]

폴더 생성, express 설치, index.js 생성

mkdir FirstApp
cd FristApp

npm init -y
npm i express
touch index.js

//index.js

const express = require("express");
const app = express();
// console.dir(app)

app.listen(8080, () => {
  console.log("Listening on port 8080!")
})

작성 후, 터미널에서 node index.js 실행하면~

Listening on port 8080!

그리고, http://localhost:8080/ 접속하면, 아래 글자가 보임.

Cannot GET /

: 요청을 받고 있지만 응답할 콘텐츠가 없는 상태!

 

index.js에 app.use() 작성하고,

app.use(()=> {
  console.log("WE GOT A NEW REQUEST!!")
})

node index.js 실행하고, http://localhost:8080/ 새로고침하면, 터미널에~

WE GOT A NEW REQUEST!!

---

[335. 요청 및 응답 객체]

app.use((req, res)=> {

- 첫 번째 파라미터는 들어오는 요청을 의미하는 객체이고, 두 번째는 응답을 의미.

- Express는 자동으로 HTTP 요청 정보를 파싱해 JavaScript 객체를 만들고 그걸 콜백의 첫 번째 인수로 전달한다!

- 응답 객체에는 메서드가 있는데, res.send()

res.send("Hello, how are you today?")

작성 후, node index.js 실행하면, 로컬호스트8080 브라우저에 화면에 해당 문구 등장~

 

아래 형태도 모두 가능~

res.send('<h1>This is my webpage!!</h1>')

res.send({color: "red"})

---

[336. Express 라우팅 기초]

 

// /cats => "MEOW!!"
app.get('/cats', (req, res)=> {
  res.send("MEOW!!")
})

http://localhost:8080/cats 접속하면 MEOW!!

 

POST 요청도 있음

 

그 외 페이지 접속 시, 보여줄 문구 작성 => 주의: 가장 위에 두면 안됨

app.get('*', (req, res)=>{
  res.send(`I don't know that path!`)
})

---

[337. Express 경로 매개 변수]

req.params 로 입력값 추출하기

app.get(`/r/:sub`, (req, res) => {
  // console.log(req.params)
  const {sub} = req.params
  res.send(`Hello, ${sub}`)
})

app.get(`/r/:sub/:postId`, (req, res) => {
  // console.log(req.params)
  const {sub, postId} = req.params
  res.send(`<p>Viewing Post Id: ${postId} </p><h1>Hello, ${sub}</h1>`)
})

---

[338. 쿼리 문자열 작업하기]

쿼리란 URL의 일부로 물음표 뒤에 위치하며, 키-값 쌍으로도 정보를 담는다.

app.get('/search', (req, res)=>{
  const {q} = req.query;
  res.send(`HI! ${q}`)
})

http://localhost:8080/search?q=SOMETHING

=> HI! SOMTHING

 

입력쿼리값 없을 때 설정-

if(!q){
res.send("아무것도 찾지 않았어요!")
}

---

[339. Nodemon을 사용한 자동 재시작]

 

npm i -g nodemon
nodemon -v
nodemon index.js

위와 같이 했는데, 설치는 된 것 같은데 nodemon -v 하면 zsh: command not found: nodemon 나오고, 실행도 안 되는 오류.

 

해결 방법은!!

npx nodemon index.js

잘 됨.