API가 **란** 무엇인가요? 🤷🏼♀️ Pt I
또 다른 약어!
만세, 나는 약어를 좋아합니다!
무슨 뜻인가요.....?
API는 '응용 프로그래밍 인터페이스'의 약자입니다.
신비한...
네 확실합니다.
기술은 신비한 것을 좋아합니다. 거의 모든 애플리케이션에는 API가 있으며 본질적으로 시스템으로 무엇을 할 수 있고 필요한 데이터를 얻는 방법을 알려주는 계약입니다.
룰북처럼?
좀 그렇지만 그렇게 구체적이지 않습니다.
내 Newbie Dictionary 에서 API는 다음과 같이 정의되었습니다.
"Stands for Application Programming Interface, is a software intermediary that allows two applications to talk to each other, is a contract between you and the software that you want to use, telling you what you can and can't do with it. It's a bridge allowing you to use the software and integrate it with your code, so that it becomes easier to integrate. Example- The google maps API allows you to integrate their maps to your apps through their API."
그것은 꽤 좋은 정의입니다. 그러나 그것이 실제로 의미하는 바는 무엇입니까?
Google 지도의 예를 더 살펴보겠습니다. 귀하의 사이트에 표시되는 사업장 위치의 지도를 원한다고 가정하십시오(일반적인 사용 사례).
코드, 특히 지도용 JavaScript, HTML 및 CSS에 액세스하고 다음을 포함합니다.
HTML:
<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
<link rel="stylesheet" type="text/css" href="./style.css" />
<script src="./index.js"></script>
</head>
<body>
<div id="map"></div>
<!-- Async script executes immediately and must be after any DOM elements used in callback. -->
<script
src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
async
></script>
</body>
</html>
JavaScript:
let map;
function initMap() {
map = new google.maps.Map(document.getElementById("map"), {
center: { lat: -34.397, lng: 150.644 },
zoom: 8,
});
}
CSS:
#map {
height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html,
body {
height: 100%;
margin: 0;
padding: 0;
}
지금 바로 이 작업을 수행하고(Google 클라우드에 대한 결제 계정을 설정했다고 가정) 지도와 함께 로컬에서 실행되는 작은 페이지를 가질 수 있습니다.
시원한
위의 예에서는 Google Maps API에 액세스했습니다.
하지만 모든 일이 너무 빨리 일어났습니다!
그게했다. 분해해 봅시다.
HTML
블록을 다시 살펴보십시오. 맨 아래에 있는 <script>
태그(이 페이지에서 JavaScript가 있는 곳)에는 약간의 src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
가 있습니다. 이 src
는 끝점이라고 하며 일반 URL처럼 보이는 것을 가리키고 있습니다. 하지만 실제로는 Google Maps API에 대한 요청입니다. '이봐, 나에게 보내진 weekly
지도가 필요해, 봐봐 - 난 권한이 있어, 난 'API 키를 가지고 있어!'API 키는 API에 대한 액세스를 제공합니다. Google의 경우 결제 계정과 이메일을 설정할 때 받을 수 있습니다. 다음과 같이 보일 것입니다.
b07fa21a-8863-4953-8aae-22027540a782
codepen의 random API key generator에서 이 키를 받았습니다.
앞서 살펴본
YOUR_API_KEY
의 src
에 입력합니다. 이 작업을 잊어버리거나 잘못 복사/붙여넣기하는 것은 일반적인 실수이며 가장 먼저 확인해야 할 것 중 하나입니다. 모든 문자가 거기에 있습니까? 아니면 실수로 한 문자를 잘라냈습니까?그렇다면 API는 항상 지도나 사이트에 추가하는 것입니까?
불행히도 당신과 API 이해에 대해 설명하려는 모든 사람에게 API는 말 그대로 무엇이든 될 수 있습니다.
콘텐츠 관리 시스템?
이를 위한 API가 있습니다.
공학용 계산기?
이를 위한 API가 있습니다.
무작위로 생성된 강아지 사진?
이를 위한 API가 있습니다(여기 , 원하는 것을 알고 있습니다)
당신은 사진을 얻을. API는 데이터에 대한 액세스 권한을 제공하고 액세스 방법을 알려주는 브리지와 같습니다. 항상 데이터를 다시 전송하지는 않지만 매직 키가 있는 한 액세스할 수 있습니다.
그들이 모두 다르게 작동하고 다른 일을한다면 어떻게 사용하는지 알 수 있습니까?
문서 친구, 문서. 모든 API에는 일종의 문서가 있으며 여기에는 사용 방법에 대한 단계가 포함됩니다.
랜덤으로 생성된 강아지 사진 보다 여기까지 계속 읽고 계신다면, 먼저 안녕하세요👋🏻, 그리고 두 번째로 강아지 사진은 왜 안 보고 계시나요?!
거기에 있는 동안 문서를 살펴보세요. 프로젝트에서 사용할 수 있는 엔드포인트가 여러 개 있습니다. 그것도 무료!
우리가 일상에서 사용하는 API의 더 많은 예시를 보고 싶다면 추천합니다this site
This weather API 다른 끝점이 어떻게 다른 것을 줄 수 있는지에 대한 아이디어를 제공합니다.
REST, HTTP, GET, POST, AUTHENTICATION 및 기타 모든 것에 대해 들어본 적이 있습니까?
잠시만요. 이것은 이 기사의 범위를 조금 벗어나지만 파트 II와 파트 III에 대한 리소스와 지식을 수집하고 있습니다.
'API'는 큰 주제인데, 예전에 써봤지만 **가 무엇인지, 그 내용이 무엇인지 완전히 이해하지 못했습니다.
우리는 모두 여기에 코드 뉴비입니다 ...
Reference
이 문제에 관하여(API가 **란** 무엇인가요? 🤷🏼♀️ Pt I), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/javascriptcoff1/what-is-an-api-pt-i-2914텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)