이번 강의에서는 HTTP요청을 배워 볼 것이다. 지금까지 우리는 직접 더미데이터를 만들어 놓고 그 데이터를 가지고 데이터를 렌더링했다. 이번 강의에서는 더미 데이터를 만들지 않고 서버에서 데이터를 얻어와서 그 데이터를 가지고 렌더링을 할 것이다.
우리는 프로젝트에서 데이터베이스에 직접 연결해서 데이터를 얻어오지 않을 것이다. 브라우저에서 실행되는 자스코드를 데이터베이스에 직접 연결하게 되면 브라우저 사용자마저도 백엔드 코드를 모두 볼 수 있게되어서 인증 정보를 숨길 수 없다.
그렇다면 어떤 방법으로 데이터베이스에 있는 정보를 받아올 수 있는 것일까?
우리는 Backend API 를 가지고 DB와 소통할 것이다. Backend API는 DB와 소통할 수 있도록 만들어진 인터페이스이다. Backend API는 DB와 같은 서버이거나 다른 서버에서 작동한다. 그렇기 때문에 브라우저에서 실행할 일이 없기 때문에 인증 정보를 숨길 수 있게 된다.
<aside> 💡 ***API가 머에요
일단 Interface 부터 알아보자.
Interface는 사물과 사람이 간에 상호작용을 할 수 있도록 돕는 매개체이다.
예를 들어 티비와 사람간에 상호작용을 하려고 한다면 그 인터페이스는 리모컨이 될 것이다.***
이어서 API는 ***(Aplication Programming Interface)***는 어떤 프로그램이 제공하는 기능을 사용할 수 있게 만든 매개체이다.
</aside>
그럼 HTTP API란?
HTTP API 를 REST 하게 쓴게 REST API이다.
REST 란 자원을 명시하고 HTTP method를 통해 그 자원을 가지고 CRUD 을 해주는 것이다. 우리는 axios도 있지만 이번 프로젝트에서는 fetch api 를 써볼 것이다.
fetch("URL"); //이 fetch함수는 프로미스를 반환한다.
fetch 함수는 비동기로 동작하기 때문에 코드의 결과를 바로 얻어서 볼 수 있는 것이 아니다.
fetch("URL").then(); //서버로부터 응답을 받으면 호출한다