데브코스 TIL - Day 12

23년 12월 4일 강의를 들은 내용과 추가로 더 학습한 내용을 기록한 글입니다.

API? (application programming interface)

사전적 정의
컴퓨터나 컴퓨터 프로그램 사이의 연결

※ interface: 중간에서 양쪽에 있는 친구들을 중재/매개체가 되어주는 역할

예를 들어, 지하철 도착 어플에서 지하철 데이터를 어떻게 받아오는지 생각해보자.

그림

직접 서울 교통공사 데이터베이스에 직접 요청을 하는 것이 아닌, 서울 교통 공사에서 만든 API에 데이터를 요청하고, 응답받는다.

REST API?

HTTP 규약을 잘 따른 API

규칙

• 소문자만 사용한다. 대문자 사용하면 안된다.
• 하이픈(-) 사용한다. 언더바(_) 사용하면 안된다.
• 마지막에 슬러쉬(/)를 작성하지 않는다.
• 행위/목적을 포함하지 않는다.
  • post/get 등등…
• 파일 확장자 포함하면 안된다.
• 복수형을 쓴다.

RESTful API?

HTTP 규약을 REST API보다 더 잘 따른 API

REST API 더 알아보기

HTTP?

인터넷으로 연결된 클라이언트와 서버는 웹 프로토콜인 HTTP를 사용하여 데이터를 주고 받음

템플릿

HEAD

• 통신 상태의 상태 (http status code)

• 응답 형태 (html

  json)

BODY

• 전달해줄 데이터 / 화면 등…
• 데이터 목적 (조회/등록/수정/삭제 등…)
  • 전체 상품 보고 싶어 = 전체 상품 리스트 + 조회
  • 이 상품 등록 해줘 = 추가된 데이터 + 등록

URL

인터넷 상에서 웹 페이지가 어디있는지 위치를 알려주는 것 뿐아니라 데이터 연산해달라고 서버에 요청을 보내는 방법

http://localhost:8888

• localhost: 내 컴퓨터 주소
• 8888: 포트번호

데이터 연상해달라고 서버에 요청하는 방식

• http://localhost:8888/전체상품조회
  • method: “GET”
  • http://localhost:8888/products
• http://localhost:8888/전체상품삭제
  • method: “DELETE”
  • http://localhost:8888/products
• http://localhost:8888/상품등록
  • method: “POST”
  • http://localhost:8888/product

실습 - API 사용해보기

■ 메인 페이지

프로세스

1. 메인 페이지 틀 받아오기
2. 전체 상품 조회 API 요청하기
3. 전체 상품 데이터 응답받기
4. 받은 데이터를 페이지에 뿌림

API 설계

상품 전체 조회 ‘GET’

• /products

■ 상세페이지

프로세스

1. 상세페이지 틀 받아오기
2. 상품 개별 조회 API 요청하기
3. 상품 데이터 응답받기
4. 받은 데이터를 페이지에 뿌림

API

상품 개별 조회 ‘GET’

• /product/{id}
• http:// localhost:8888/product/1
• http:// localhost:8888/product/99

■ 상품 관리 페이지

프로세스

1. 상품 관리 페이지 틀 받아오기
2. 전체 상품 조회 API 요청하기
3. 전체 상품 데이터 응답받기
4. 받은 데이터를 페이지에 뿌림

API 설계

상품 전체 조회 ‘GET’

• /products

■ 상품 수정 페이지

프로세스

1. 상품 수정 페이지 틀 받아오기
2. 상품 개별 조회 API 요청하기
3. 상품 데이터 응답받기
4. 받은 데이터를 페이지에 뿌림

API 설계

상품 개별 조회 ‘GET’

• /products/{id}
• http:// localhost:8888/product/1
• http:// localhost:8888/product/99

■ 수정을 완료하고 완료 버튼을 누르기

프로세스

1. 완료 버튼 누르기
2. 상품 수정 API 요청하기

API 설계

상품 개별 수정 ‘PUT’ ‘POST’

• /products/{id}