본문 바로가기
개발/웹 개발

Day 3: REST API의 이해

1. 오늘의 학습 목표 

학습 목표: 현대 웹 개발의 표준 아키텍처인 REST의 개념을 이해합니다.

REST API를 구성하는 세 가지 핵심 요소인 자원(Resource), 행위(Verb), 표현(Representation)을 설명할 수 있습니다.

 

핵심 요약: REST는 클라이언트와 서버가 효율적으로 통신하기 위한 API 디자인 가이드입니다.


2. 핵심 개념 파헤치기

2.1. REST API란 무엇인가?

REST(Representational State Transfer)는 웹 서비스를 설계하는 데 널리 사용되는 아키텍처 스타일 중 하나입니다.

복잡한 규칙 대신, HTTP 프로토콜의 장점을 최대한 활용하여 클라이언트와 서버 간의 통신을 명확하고 간결하게 만드는 것을 목표로 합니다. 이렇게 REST 원칙을 따라 설계된 API를 REST API 또는 RESTful API라고 부릅니다.

 

2.2. 핵심 원리: 세 가지 구성 요소

REST는 다음 세 가지 요소로 구성됩니다. 이 세 가지를 조합하면 API의 기능과 목적을 이름만 보고도 쉽게 파악할 수 있습니다.

 

자원

API가 다루는 데이터나 대상을 의미합니다. 예를 들어 '게시물', '사용자', '댓글' 등이 모두 자원이 될 수 있습니다.

자원은 고유한 주소인 URI를 통해 식별됩니다. (예: /posts, /users/123)

URI는 동사 대신 명사를 사용하여 자원을 표현하는 것이 특징입니다.

 

행위

자원에 대해 수행할 작업을 의미하며, 이는 HTTP 메서드를 통해 표현됩니다.

주요 HTTP 메서드와 역할

  • GET: 조회
  • POST: 생성
  • PUT / PATCH: 전체/부분 수정
  • DELETE: 삭제

표현 

서버가 클라이언트에게 응답으로 보내주는 자원의 상태를 의미합니다

자원은 다양한 형태로 표현될 수 있으며, 오늘날에는 주로 JSON 형식이 사용됩니다
클라이언트는 이 JSON 데이터를 받아 화면에 표시하거나 가공합니다


3. 코드로 배우기

3.1. 구현 목표

게시물(posts)이라는 자원을 관리하는 REST API의 URI를 설계해 봅니다. 각 URI와 HTTP 메서드가 어떤 기능을 수행하는지 코드를 통해 개념적으로 이해합니다. (서버 프레임워크 Express.js의 라우팅 문법을 예시로 사용합니다.)

 

3.2. [1단계: 자원과 행위 설계하기]

'게시물'이라는 자원(/posts)에 대해 CRUD(Create, Read, Update, Delete) 기능을 HTTP 메서드를 사용해 설계합니다.

[GET] /posts      - 모든 게시물 조회
[GET] /posts/1    - ID가 1인 특정 게시물 조회

[POST] /posts     - 새로운 게시물 생성

[PUT] /posts/1    - ID가 1인 게시물 수정

[DELETE] /posts/1 - ID가 1인 게시물 삭제

 

3.3. [2단계: 개념적 코드 작성]

위 설계를 Express.js 프레임워크의 라우팅 코드로 표현하면 다음과 같습니다. 각 메서드와 URI가 어떻게 기능과 연결되는지 직관적으로 알 수 있습니다.

//모든 게시물 조회 API
app.get('/posts', (req, res) => {
  //데이터베이스에서 모든 게시물을 찾아 '표현(JSON)'으로 응답
});

//특정 게시물 조회 API
app.get('/posts/:id', (req, res) => {
  const postId = req.params.id;
  //데이터베이스에서 postId에 해당하는 게시물을 찾아 '표현(JSON)'으로 응답
});

//새로운 게시물 생성 API
app.post('/posts', (req, res) => {
  const newPost = req.body;
      //newPost 데이터를 데이터베이스에 저장
});

4. 전체 코드


//'posts' 자원에 대한 REST API 라우팅 설계 (Express.js)

//CREATE
app.post('/posts', (req, res) => {
 				 // 새 게시물 생성 로직
});

//READ (All)
app.get('/posts', (req, res) => {
  				// 모든 게시물 조회 로직
});

//READ (One)
app.get('/posts/:id', (req, res) => {
  				// 특정 게시물 조회 로직
});

//UPDATE
app.put('/posts/:id', (req, res) => {
			  //특정 게시물 수정 로직
});

//DELETE
app.delete('/posts/:id', (req, res) => {
 					 //특정 게시물 삭제 로직
});

 

'개발 > 웹 개발' 카테고리의 다른 글

Day 6: HTML과 시맨틱 웹  (1) 2024.08.02
Day 5: CORS (Cross-Origin Resource Sharing)  (1) 2024.08.01
Day 4: 동기 vs 비동기  (2) 2024.07.31
Day 2: HTTP/HTTPS 프로토콜  (0) 2024.07.28
Day 1: 브라우저 렌더링 (DOM, CSSOM)  (0) 2024.07.25