HTTP API와 Ajax

📅 TIL #50



🎯 Achievement Goals


  • 브라우저, 클라이언트, 서버, API가 무엇인지 정의 내릴 수 있다.
  • HTTP 메소드의 종류를 이해할 수 있다.
  • HTTP 메시지가 어떤 구성으로 이루어져 있는지 이해할 수 있다.
  • AJAX가 무엇이고, 왜 필요한지를 이해할 수 있다.




👉 브라우저, 클라이언트, 서버, API


브라우저: HTML, CSS, JavaScript 등 작성된 코드를 내부 엔진으로 해독하여 사용자가 쉽게 이해할 수 있는 형태의 컨텐츠로 보여주는 역할을 한다.


클라이언트: 유저와의 전반적인 상호작용을 담당한다. 필요한 API를 서버에 요청한다. 그 후, 서버로부터 받은 응답에 따라 다른 화면을 표시한다.


서버(server): 클라이언트의 요청에 따라 적절한 응답을 되돌려 준다.


API: API(Application Programming Interface)의 약자로, 서버는 클라이언트에게 리소스를 잘 활용할 수 있도록 인터페이스(interface)를 제공하는데 이것을 API라고 한다.





👉 HTTP


HTTP 요청은 서버가 특정 동작을 취하게끔 만들기 위해 클라이언트에서 전송하는 메시지이다.

HTTP 메시지는 서버와 클라이언트 간에 서버(server)데이터가 교환되는 방식</span>이다. 메시지 타입은 두가지가 있는데

  1. 첫번째 요청(request)은 클라이언트가 서버로 전달해서 서버의 액션이 일어나게 하는 것이다.
  2. 두번째 응답(response)은 요청에 대한 서버의 답변이 된다.



HTTP 메소드


GET 메소드는 특정 리소스의 표시를 요청한다.

POST 메소드는 특정 리소스에 엔티티를 제출할 때 쓰인다.

PUT 메소드는 목적 리소스 모든 현재 표시를 요청 payload로 바꾼다.






👉 Ajax


AJAX는 (Asynchronous JavaScript and XML)의 약자로, 비동기적인 웹앱 제작을 위한 웹 개발 기법이다.

Ajax를 통해 클라이언트는 필요한 데이터만 서버를 통해 비동기적으로 받고, 페이지의 일부만 동적으로 업데이트 할 수 있다. fetch API를 통해 AJAX 요청을 보낼 수 도있다.







🙌 느낀점


오늘 배운 HTTP, Ajax 에 대한 개념에 대해서는 유튜브를 통해 보충 설명을 듣고, 계속 내용을 찾다보니 개념을 받아들이는데는 어렵지 않았다. 하지만 오늘 한 과제가 직접 서버에 요청을 하고 데이터를 받아와서 화면에 전송하는 것이었는데, 이 부분을 막상 실제로 구현을 하려고 하다보니 정말 막히는 부분이 많았다.

오류도 엄청 나고, 문제를 해결하면 또 문제가 발생하고.. 연속이었지만, 그래도 페어분이 잘해서 수월하게 진행이 되었다. 내일 마무리가 되어가는데… 이 스프린트 부분은 복습을 철저히 해야겠다.





👊 내일의 TIW(today I Will)

XSS, CORS