내 발자취

UI vs API 본문

코딩공부/Java Script

UI vs API

듀무 2020. 12. 31. 00:47

UIUser Interface의 약자다.

API Application Programming Interface의 약자다.

이 두개의 서로 다른듯 비슷하고 비슷한듯 다른 이 둘의 의미를 살펴보면서 우리가 하는 일이 무엇인가를 음미해보자.

여기에 버튼이 있다. 누르면 경고창이 뜬다.

이 버튼을 사용하는 주체는 우리의 웹 앱을 이용하려고 하는 사용자다.

사용자는 이 버튼과 같은 조작장치를 이용해서 우리의 웹 애플리케이션을 사용하고 있는 것이다. 

사용자가 시스템을 제어하기 위해서 사용하는 조작장치User Interface. 줄여서 UI라고 부른다.


그럼 이번에는 웹 애플리케이션의 코드를 살펴보자.

이 경고창은 우리가 만든 것이기도, 만들지 않기도 했다.

생각해보면 경고창이 실행되는 타이밍이나 경고 창에 표시되는 텍스트는 우리의 의도가 반영되었기 때문에 우리가 만든 거라 할 수 있다.

하지만 이 코드. 한줄짜리 코드에는 경고창의 기능이나 모양 이런것이 일체 설명되어있지 않다. 

이건 웹브라우저를 만드는 사람들이 우리 대신에 경고창 기능을 미리 만들어두었다가 저 alert라는 함수를 실행하면 경고창을 띄워주겠다고 자바스크립트의 사용설명서를 통해서 약속한 것이다.

함수 alert은 경고창을 실행하는 조작장치인것.

바로 우리가 만들고 있는 이 버튼을 클릭하면 경고창이 뜨는 애플리케이션이 

웹브라우저가 가지고 있는 경고창 기능을 alert이라고 하는 자바스크립트의 문법에 따라서문법의 코드를 이용해서 사용하고 있는 것이다.

애플리케이션을 만들기 위해서 프로그래밍을 할 때 사용하는 조작 장치들을 Application Programming Interface라고 부른다. 

alert이 API인 것이다. 

js에만 국한되는 얘기가 아니라 모든 프로그래밍 언어에 공통적으로 적용되는 이야기다. 

모든 애플리케이션들은 API를 프로그래밍 적으로, 즉 순서대로 실행하는 것을 통해 만들어진다

API가 없다면 순서가 무슨 소용이겠는가? 순서가 없다면 API가 무슨 소용이겠는가

API와 순서는 서로 뗄레야 뗄 수가 없는 관계에 있다.

프로그래머가 되기 전까지 평생 UI만 사용했지만 이제 API도 사용할 수 있게 되었다.

자바스크립트는 이 API를 결합/응용해서 세상의 누구도 만들어본 적이 없는 프로그램을 만들 수 있게 한다.

 

'코딩공부 > Java Script' 카테고리의 다른 글

[복습] var/const/let 변수 선언 방식  (0) 2021.05.06
[복습] for문  (0) 2021.04.27
라이브러리와 프레임워크  (0) 2020.12.30
파일로 쪼개서 정리 정돈하기  (0) 2020.12.30
객체 활용  (0) 2020.12.30