IMCAT.DEV
로그인 가입
JavaScript 고급 네트워크

JavaScript RESTful API 설계

JavaScript RESTful API 설계 — 고급

RESTful API 설계

1. 도입 (왜 배워야 하는가)

RESTful API(Representational State Transfer)는 현대 웹 애플리케이션의 핵심입니다. 많은 시스템 간의 데이터 전송 및 상호 작용을 가능하게 하며, 마이크로서비스 아키텍처 및 클라우드 기반 서비스에서 필수적으로 사용됩니다. RESTful API를 이해하지 못하면 웹 애플리케이션 간의 원활한 데이터 통신이 어려워지고, 개발 과정에서 비효율성이 발생할 수 있습니다. 예를 들어, 쇼핑몰 애플리케이션에 RESTful API를 사용하지 않으면, 클라이언트와 서버 간의 데이터 교환이 복잡해지고, 이를 관리하기 어렵게 됩니다.

2. 핵심 개념 설명

RESTful API는 다음과 같은 주요 개념으로 구성됩니다:

  • 자원(Resource): API에서 관리하는 데이터의 단위로, URL로 식별됩니다. 예를 들어, 사용자의 정보는 /users라는 엔드포인트로 접근할 수 있습니다.
  • 행위(Verb): 자원에 대해 수행할 수 있는 작업을 정의합니다. 일반적으로 HTTP 메서드를 사용하여 다음과 같은 행위를 나타냅니다:
  • - GET: 자원 조회 - POST: 자원 생성 - PUT: 자원 업데이트 - DELETE: 자원 삭제

  • 상태 표현(Representation): 자원의 상태를 표현하는 데이터 포맷으로, JSON과 XML이 널리 사용됩니다.
  • 용어설명
    자원API에서 관리하는 데이터 단위
    행위자원에 대해 수행할 수 있는 작업 (GET, POST 등)
    상태 표현자원의 상태를 표현하는 데이터 포맷

    3. 기본 코드 예제

    다음은 간단한 RESTful API 서버를 Node.js와 Express로 구현한 예제입니다.

    const express = require('express'); // Express 모듈을 가져옵니다.
    const app = express(); // Express 애플리케이션을 초기화합니다.
    const port = 3000; // 서버가 사용할 포트입니다.
    
    app.use(express.json()); // JSON 요청을 처리할 수 있도록 설정합니다.
    
    // 사용자 정보를 저장할 배열
    let users = [];
    
    // GET 요청: 모든 사용자 조회
    app.get('/users', (req, res) => {
      res.json(users); // 저장된 사용자 목록을 응답합니다.
    });
    
    // POST 요청: 새로운 사용자 생성
    app.post('/users', (req, res) => {
      const user = req.body; // 요청 본문에서 사용자 정보를 가져옵니다.
      users.push(user); // 배열에 사용자 정보를 추가합니다.
      res.status(201).json(user); // 생성된 사용자 정보를 응답합니다.
    });
    
    // 서버 시작
    app.listen(port, () => {
      console.log(Server is running on http://localhost:${port}); // 서버 실행 메시지 출력
    });

    실행 결과

    서버가 실행되면 http://localhost:3000/users 엔드포인트에서 GET 요청을 통해 빈 배열 []이 반환됩니다.

    코드 동작 설명

    1. express 모듈을 가져옵니다.
    2. 새로운 Express 애플리케이션 인스턴스를 생성합니다.
    3. express.json() 미들웨어를 사용하여 JSON 형식의 요청 본문을 처리합니다.
    4. 빈 사용자 배열을 생성합니다.
    5. /users 엔드포인트에 GET 요청을 처리하여 저장된 사용자 목록을 반환합니다.
    6. /users 엔드포인트에 POST 요청을 처리하여 새로운 사용자를 생성하고 응답합니다.
    7. 지정된 포트에서 서버를 실행합니다.
    8. 4. 실전 활용 예제

      1. 쇼핑몰 장바구니 구현

      쇼핑몰 애플리케이션에서 장바구니를 구현할 때 RESTful API를 사용하여 사용자가 선택한 상품을 추가하거나 삭제할 수 있습니다.

      // 장바구니에 상품 추가
      app.post('/cart', (req, res) => {
        const item = req.body; // 요청 본문에서 상품 정보를 가져옵니다.
        cart.push(item); // 장바구니에 상품을 추가합니다.
        res.status(201).json(item); // 추가된 상품 정보를 응답합니다.
      });

      2. 사용자 인증

      사용자 인증 시스템을 구축할 때, 로그인 및 로그아웃 기능을 RESTful API로 구현할 수 있습니다.

      // 사용자 로그인
      app.post('/login', (req, res) => {
        const { username, password } = req.body; // 요청 본문에서 사용자 이름과 비밀번호를 가져옵니다.
        // 인증 로직 (간단화된 예)
        if (username = 'user' && password = 'pass') {
          res.status(200).json({ message: '로그인 성공' }); // 로그인 성공 응답
        } else {
          res.status(401).json({ message: '인증 실패' }); // 인증 실패 응답
        }
      });

      5. 흔한 실수와 주의사항

      1. HTTP 메서드의 잘못된 사용

    9. 잘못된 코드:
    10. // GET 요청으로 사용자 추가
      app.get('/users', (req, res) => {
        // 사용자 추가 코드
      });
    11. 올바른 코드:
    12. // POST 요청으로 사용자 추가
      app.post('/users', (req, res) => {
        // 사용자 추가 코드
      });

      2. 상태 코드의 부적절한 사용

    13. 잘못된 코드:
    14. // 사용자 생성 후 200 상태 코드 반환
      res.status(200).json(user);
    15. 올바른 코드:
    16. // 사용자 생성 후 201 상태 코드 반환
      res.status(201).json(user);

      6. 정리

    17. RESTful API는 현대 웹 애플리케이션의 필수 요소입니다.
    18. 자원, 행위, 상태 표현의 개념을 명확히 이해해야 합니다.
    19. HTTP 메서드와 상태 코드를 올바르게 사용해야 합니다.
    20. 다음에 학습할 주제로는 GraphQL, OAuth 인증, API 문서화 도구(Postman, Swagger) 등을 추천합니다.