Introduction to Backend

MIN KYOUNG KIM·2022년 3월 14일

UI

UI(User Interface)는 유저가 소프트웨어와 만나는 경계면
웹 서비스에서 UI를 만든다 라는 표현은 사용자가 직접 사용하고 정보를 알아들을 수 있는웹 페이지 화면을 만든다 는 의미로 사용.

API

어플리케이션과 어플리케이션이 서로 의사소통을 하고 데이터를 교환할 수 있는 매개체가 되어주는 대상
서로 다른 프로그램 간에 소통할 수 있게 도와주는 통신 규약
서버에게 요청해서 데이터 가져오는 방법(함수)

Http vs Express

const http = require('http')
const { sendPosts } = require('./sendPosts')

const server = http.createServer((req, res) => {
  const { url, method } = req
  res.setHeader('Content-Type', 'application/json')

  if (url === '/') return res.send({ message: '/ endpoint' })
  if (url === '/signup' && method === 'POS') return res.end(JSON.stringify({ message: '회원가입 완료!' }))
  if (url === '/login' && method === 'POST') return res.end(JSON.stringify({ message: '로그인 완료!' }))
  if (url === '/products' && method === 'GET') return sendPosts(res)

  res.send(JSON.stringify({ message: 'this response answers to every request' }))
})

server.listen(8080, () => { console.log('server is listening on PORT 8000')})

Http 차이점 
- 서버 만드는 법 
- if 사용됨 
const server = http.createServer((req, res) => {
  const { url, method } = req
  res.setHeader('Content-Type', 'application/json')
  if (url === '/signup' && method === 'POS') return res.end(JSON.stringify({ message: '회원가입 완료!' }))
})

const http = require('http')
const express = require('express')
const { sendPosts } = require('./sendPosts')

const app = express()
app.use(express.json())

app.get('/', (req, res) => {
  res.json({ message: '/ endpoint' })
})

app.post('/signup', handleSignUp) // 첫번째 인자에는 endpoint url 을 기입하고,
app.post('/login', handleLogin) // 각각의 요청에 대해 핸들링 하는 함수를 두번째 인자로 넣는다.
app.get('/products', sendPosts)

const server = http.createServer(app)

server.listen(8000, () => {
  console.log('server is listening on PORT 8000')
})

express을 사용했을 때 다른 점

- const express = require('express');
- const app = express();
- app.use(express.json());
- const server = http.createServer(app)

res.send() vs res.json() vs res.end()

res.send()
- res.send([body])의 body에는 Buffer, String, Object, Array가 올 수 있다. 그리고 response Header에는 Body의 Content-Type이 자동으로 정의된다
res.json()
- json이 아닌 것도 json 형식으로 바꾸어서 보내준다. 즉 content-type 헤더를 application/JSON으로 고정한다. 그런데 결국 res.json()도 마지막에 res.send()를 호출한다.
res.end()
- 보내줄 아무 데이터도 없는데 response를 끝내고 싶을 때 사용한다.ex) res.status(400).end();

Status Code

Status Code는 사용자가 웹 서버에 요청을 보냈을 때, 응답으로 보내주는 숫자 코

2XX Success

200 OK - 대표적인 성공코드, 에러 없이 요청이 성공적으로 진행, 주로 Get 요청에 대한 응답으로 사용된다.
201 Created - 요청이 성공적으로 처리되어, 서버가 새로운 리소르를 생성했을 때 사용하는 코드. POST,PUT 등의 요청에 대한 응다브올 주로 사용
204 No Content - 서버에 대한 요청이 성공적으로 처리, 제공해줄 응답 데이터 없을 때 204 사용