YouTube Clone. setting

---

유튜브 backend 만들기
express
babel
nodemon
등등 사용

---

https://expressjs.com/en/4x/api.html#res
express공식 문서!!!

1. 기본 세팅

-jmTube folder를 하나만들고
-npm init 하면,
-package json이 생긴다.
-npm i express
-extension에서 gitignore
-git에 repository 만들고(githube.com/new)
-git init
-git remote add origin ${만들어진 repository}
-git add .
-git commit -m "start"
-git push origin master

2. babel 세팅

https://babeljs.io/setup

여기서 NodeJs Nodemod 두개 초이스해서 세팅하면됨

$npm i --save-dev

"@babel/core": "^7.19.3",
"@babel/node": "^7.19.1",
"@babel/preset-env": "^7.19.4",
"nodemon": "^2.0.20"

root에 babel.config.json 만듬

{
  "presets": ["@babel/preset-env"]
}

package.json의 script 세팅

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "node index.js",
    "dev": "nodemon --exec babel-node src/server.js"
  },

babel 관련 npm 을 다 설치했으면(nodemon포함),
"dev": 에 위와 같이 scrips를 만든다.

next~
src폴더를 만들고,
server.js 파일을 만든다.

3.src/server.js

-express사용
-server만들기
-middleware만들기

import express from 'express'

const PORT = 4000  ///2)PORT도 설정해준다.
const app = express()  ///1)가장먼저 express를 불러준다.

const goMiddleware = (req, res, next) => {
  console.log(`go to ${req.method}...${req.url}`)
  next()
}
///middleware~
///req, res, next를 argument로 넣어주고,
///반드시 next를 넣어준다.

const privateMiddleware = (req, res, next) => {
  const url = req.url
  if (url === '/protected') {
    return res.send('<h1>Not Allowed</h1>')
  }
  console.log('Allowend YOu')
  next()
}
///middleware~
///req, res, next를 argument로 넣어주고,
///res.send를 넣으면, next로 이어지지 않고, 
///<h1>Not Allowed</h1>으로 마무리 됨.
///반드시 next를 넣어준다.

const handleListening = () => {
  console.log('Server listening on port 4000')
}
///4)app.listen에 넣어 줄 callback함수.

const handleHome = (req, res) => {
  return res.send('<h1>I love you</h1>')
}
///아래에 사용될 callback함수

const handleLogin = (req, res) => {
  return res.send('I love Login')
}
///아래에 사용될 callback함수

const handleProtected = (req, res) => {
  return res.send('Welcome Prot')
}
///아래에 사용될 callback함수

app.use(goMiddleware) 
///app.use는 모든 path에 적용되는 middleware
///반드시 app.get위에 위치해야 적용이 됨, 모든 route에 적용됨
///특정 path에만 middleware를 넣을려면,
///app.get('/login', middleware함수, login함수)
///이런 식으로 넣어주면, 된다.
///app.use는 모든 middleware에 적용!!!

app.use(privateMiddleware)
///middleware는 두세개 사용할 수 있다.
///callback함수를 만들어줌.

app.get('/', handleHome) 
///5)Path 설정!(home path('/'), 뒤에 들어가는 callback함수)
app.get('/login', handleLogin)
///6)Path 설정(/login),  뒤에 들어가는 callback함수
app.get('/protected', handleProtected) 
///7)Path설정('/protected),  뒤에 들어가는 callback함수

app.listen(PORT, handleListening) 
///3)app.listen으로 PORT란 callback함수를 불러준다.
///(PORT, ()=>{}) 이렇게 설정하던, callBack함수로 설정하던.
///handleListening이란 함수를 만들어서 넣어져도 된다.

console.log('he111222llo')