HTTP와 Express.js
florent의 개발 적응기
이 글의 주요 내용
[HTTP(HyperText Transfer Protocol)]
[Express.js]
[미들웨어(Middleware)
[라우팅(Routing)]
[라우트 핸들러(Route Handler)]
[라우팅의 구조와 활용]
[Express.js를 활용한 웹서버 구현]
[Express.js를 이용하여 HTML 요소에 HTTP 라우팅하기]
[HTTP(HyperText Transfer Protocol)]
[HTTP란?]
HTTP는 웹에서 데이터를 주고받기 위한 프로토콜로, 클라이언트(주로 웹 브라우저)와 서버 간의 통신 방식을 정의
[HTTP의 주요 메서드]
GET: 리소스 요청. 서버로부터 데이터를 받아옴
POST: 리소스 생성. 서버에 새로운 데이터를 전송
PUT: 특정 리소스를 완전히 새로운 데이터로 대체
PATCH: 리소스의 일부분만 수정
DELETE: 특정 리소스를 서버에서 제거
[자주 보이는 HTTP의 응답 상태 코드]
https://www.reddit.com/r/ProgrammerHumor/comments/2rttnv/http_status_ranges_in_a_nutshell/(서버가 화자)
1xx: 잠깐 기다려봐.
2xx: 요청한 거 여기있어.
3xx: 저리로 가.
4xx: 니가 잘못함.
5xx: 내가 잘못함.
[Express.js]
[Express.js란?]
JavaScript 프레임워크인 Express.js는 JavaScript로 백엔드 서버 측 로직을 작성할 수 있게 해줌
Node.js 환경에서 실행되며, 프론트엔드와 백엔드 모두 JavaScript를 사용할 수 있어 개발 효율성이 높아짐
Node.js가 JavaScript를 서버에서 실행할 수 있게 해주는 런타임 환경이라면, Express.js는 그 위에서 웹 서버를 쉽게 구축할 수 있게 해주는 프레임워크
[Express.js의 특성]
가독성(Readability): Express는 직관적인 API를 제공하여 코드를 이해하기 쉽게 만듬
적은 코드량(Less Code): 복잡한 웹 기능을 간단한 메서드로 구현할 수 있어 코드량이 줄어듬
미들웨어(Middleware): 요청 처리 과정에 여러 기능을 쉽게 추가할 수 있는 미들웨어 시스템을 제공
라우팅(Routing): URL 경로에 따라 다른 처리를 할 수 있게 해주는 기능으로, RESTful API 구현이 용이
템플릿 엔진 지원: 동적 HTML 페이지 생성을 위한 다양한 템플릿 엔진을 지원
[미들웨어(Middleware)]
[미들웨어란?]
미들웨어는 Express.js 프레임워크의 핵심 개념 중 하나로, 요청(request)과 응답(response) 사이에 위치하여 다양한 기능을 수행하는 함수들을 말함
[미들웨어의 주요 용도와 특징]
(1) 요청 또는 응답 객체를 수정: 요청 객체(req)나 응답 객체(res)를 수정하여 다음 미들웨어나 라우트 핸들러가 사용할 수 있게 함
(2) 요청-응답 주기를 종료: 특정 조건이 충족되면 요청-응답 주기를 종료하고 클라이언트에게 응답을 보냄
(3) 다음 미들웨어 함수 호출: next() 함수를 호출하여 다음 미들웨어 함수나 라우트 핸들러로 제어를 전달
(4) 오류 처리: 오류가 발생했을 때 이를 처리하는 미들웨어를 정의할 수 있으며, 오류 처리 미들웨어는 일반적인 미들웨어 함수와 달리 네 개의 인수를 받음 (err, req, res, next).
(5) 인증 및 권한 부여: 사용자의 인증(authentication) 및 권한 부여(authorization)를 처리하여 보안 기능을 구현
(6) 로깅: 요청 정보를 로깅하여 서버 활동을 기록하고 모니터링
(7) 데이터 파싱: 요청 본문이나 쿠키 등의 데이터를 파싱하여 사용할 수 있게 함
[자주 사용되는 미들웨어 예시]
[커스텀 미들웨어 만들기]
[라우팅(Routing)]
[라우팅이란?]
라우팅은 애플리케이션의 엔드포인트(URI)가 클라이언트 요청에 응답하는 방식을 결정하는 메커니즘
URL 경로와 특정 HTTP 요청 메소드(GET, POST, PUT, DELETE 등)에 대한 애플리케이션의 응답을 정의
클라이언트의 요청을 적절한 처리 로직으로 연결함
RESTful API 설계의 기본이 됨
코드의 구조화와 모듈화를 도움
[라우트 핸들러(Route Handler)]
라우트 핸들러는 특정 라우트에 대한 요청이 들어왔을 때 실행되는 함수로, 일반적으로 req, res, next 매개변수를 받음
req (request): 클라이언트의 HTTP 요청에 대한 정보를 담고 있는 객체
res (response): 서버의 HTTP 응답을 형성하는 데 사용되는 객체
next (선택적): 다음 미들웨어 함수로 제어를 넘기는 함수
[라우팅의 구조와 활용]
[Express.js를 활용한 웹서버 구현]
(1) 디렉토리 생성: 프로젝트를 위한 새 폴더를 만들기 ⇒ 이는 프로젝트 파일들을 구조화하고 관리하기 위함
(2) index.js 파일 생성 : 서버 로직을 작성할 메인 애플리케이션 파일을 생성
(3) NPM 초기화: 노드 패키지 매니저(NPM)를 사용하여 프로젝트를 초기화, 이 과정에서 package.json 파일이 생성되며, 프로젝트의 메타데이터와 의존성을 관리
(4) Express 패키지 설치: Express 프레임워크를 프로젝트에 추가
(5) 서버 애플리케이션 작: Express를 사용하여 기본적인 웹 서버를 설정, 이 단계에서 라우트를 정의하고 미들웨어를 추가할 수 있음
(6) 서버 시: Node.js를 사용하여 작성한 서버 애플리케이션을 실행
(7) 로컬 서버 접속: 웹 브라우저나 API 클라이언트를 통해 로컬에서 실행 중인 서버에 접속
(8) 리스닝 확인: 서버가 특정 포트에서 요청을 수신하고 있는지 확인
[Tip 1] nodemon: 서버 시작 및 애플리케이션 활용에 유용 ⇒ 파일이 변경될 때 자동으로 노드 애플리케이션을 재시작 → nodemon index.js 명령어 사용 (npm에서 설치 필요)
[Tip 2] Postman을 사용하면 쉽게 HTTP 요청을 보낼 수 있음
[Express.js를 이용하여 HTML 요소에 HTTP 라우팅하기]
