REST API

Table Of Contents

1. CRUD
2. 인터페이스
3. 백엔드와 클라이언트
4. HTTP method
5. GET
6. POST
7. PUT
8. DELETE 메소드
9. API
10. RESTFULL API

CRUD

• 서버를 만들 때에 꼭 따라야 하는 방식은 없습니다.
• 다만 소프트웨어의 기본적인 데이터 처리 방식인 CRUD에 따라 인터페이스를 만드는 것이 일반적입니다.
• 여기서 CRUD는 Create, Read, Update, Delete를 의미 합니다.

가장 중요한 개념인 CRUD! 🖍️빨간 밑줄 쫙쫙.!

인터페이스

• 인터페이스란 서로 다른 두 시스템의 접접입니다.
• 쉽게 말해서, 우리가 다른 장치에 접근하기 위한 것이라고 할 수 있습니다.
• 타자를 칠 때 누르는 키보드의 키들은 컴퓨터에게 명령을 내리기 위한 일종의 인터페이스 입니다.
• 특정 소프트웨어의 외부에서 내부의 기능을 동작 시키기 위해 만들어 놓은 일종의 통로라고 이해할 수도 있습니다.
• 프론트엔드 개발자가 서버 내부를 조종할 방법이 없기 때문에(가능하게 해서는 안됩니다!), 서버 개발자는 프론트엔드 개발자가 서버의 자원을 할용할 수 있도록 인터페이스를 만들어주어야 합니다.

백엔드와 클라이언트

• 이전에 만든 서버에 패스네임을 추가해봅시다.

const url = require('url').parse(req.url, true);
if(url.pathname === '/sub') {
    res.statusCode = 200;
    res.setHeader("Access-Control-Allow-Origin", "*");
    res.setHeader('Content-Type', 'text/plain');
    res.write('sub');
    res.end();
} else {
    res.statusCode = 200;
    res.setHeader("Access-Control-Allow-Origin", "*");
    res.setHeader('Content-Type', 'text/plain');
    res.end('Hello World\n');
}

• url로 전달 받는 path의 경로를 체크하여 클라이언트에 응답하는 정보를 다르게 할 수 있습니다.
• 위와 같이, 클라이언트의 리퀘스트를 서버에 접속하는 경로(엔드포인트)에 따라 다르게 핸들링 하는 것을 라우팅이라고 합니다.
• 이제 우리가 만든 서버를 호출해보기 위한 간단한 클라이언트 앱을 만들어 보겠습니다.

var http = new XMLHttpRequest();
var url = 'http://127.0.0.1:3000/sub';
var params = '';
http.open('GET', url, true);

//Send the proper header information along with the request
http.setRequestHeader('Content-type', 'text/plain');

http.onreadystatechange = function() {//Call a function when the state changes.
  if(http.readyState == 4 && http.status == 200) {
    alert(http.responseText);
  }
}
http.send(params);

선생님👨‍🏫: 이것이 바로 백엔드와 클라이언트가 통신하는 방식입니다

⬆ back to top

HTTP method

• HTTP 프로토콜은 클라이언트의 요청을 구분할 수 있는 요청 메소드라고 하는 집합을 포함하고 있습니다.
• 여러 메소드가 있지만, 여기서는 가장 많이 사용되는 GET, POST, PUT, DELETE 메소드를 소개합니다.
• 각 메소드들은 물론, 약속한 방법과 다르게 사용하는 것이 가능합니다.
• 다만 협업과 실수를 줄이기 위해, 약속된 방식으로 개발하는 것을 권장드립니다.

GET

• 서버의 특정 자원(데이터 등)을 받기 위해 요청하는 메소드
• GET으로 회원가입 등 모두 처리하는 업체도 있으나, 일반적으로 데이터 수정을 GET 요청 API에서 처리하는 것은 바람직하지 않습니다.
• 일반적으로 성공시 200 코드를 반환합니다.

POST

• 새로운 정보를 전달하여 입력할 때 사용하는 메소드
• 일반적으로 성공시 201 코드를 반환합니다.

PUT

• 기존 데이터를 수정할 때 사용하는 메소드
• 일반적으로 성공시 201 코드를 반환합니다.

DELETE

• 기존 데이터를 삭제할 때 사용하는 메소드
• 일반적으로 성공시 204 코드를 반환합니다.

⬆ back to top

API

• Application Programming Interface 🤙
• 운영 체제나 프로그래밍 언어가 제공하는 기능을 제어할 수 있게 만든 인터페이스

학습자 해밀의 👀눈높이설명: 저는 API라는 용어를 약속이라고 이해했어요! 프론트엔드 개발자와 백엔드 개발자 협업할 때 데이터를 주고 받기 위한 약속 또한 API가 아닐까요?!

RESTFULL API

• Representational State Transfer
• 클라이언트/서버 구조: 각 앱은 인터페이스로 분리되어야 하며, 서로에 대한 의존성이 낮아야 합니다.
• 무상태(Stateless): 흔히 세션과 쿠키라고 하는 프론트엔드의 상태를 서버에 저장하지 않는 것을 의미합니다.
• 캐시 처리 가능(Cacheable): 데이터를 캐싱하여 전체 응답시간을 줄이고 서버의 성능을 높여야 합니다.
• 계층화(Layered System): 클라이언트는 API를 통해 자원에 접근하지만, 이 자원이 서버의 어디에 존재하는 지 알 수 있도록 여러 단계를 만들어야 합니다.
• 인터페이스 일관성: 구조를 단순화 시키고 통일하며, 특정 언어나 기술에 종속되지 않습니다.

⬆ back to top