기본 개념 이해하기

Drag and Drop: Drag and Drop 은 마우스 끌어다 놓기 액션의 영어식 표현입니다. PC 환경에 마우스의 활용이 보편화 되면서 'Click', 'Mouse over', 'Mouse move' 등의 이벤트가 UX에 많이활용이 되었는데, Drag and Drop 은 복합적인 마우스 이벤트를 하나로 묶어 처리하게 됨으로서 풍부한 UX 표현이 가능하게 되었습니다. Drag and Drop 은 DND 로도 표현 됩니다.

OPEN API

API: Application Programming Interface 의 약자입니다. API의 맥락에서 애플리케이션이라는 단어는 고유한 기능을 가진 모든 소프트웨어를 나타냅니다. 인터페이스는 두 애플리케이션 간의 서비스 계약이라고 할 수 있습니다

네이버 검색, 카카오 메시지보내기, 구글 캘린더 등을 사용해보신적이 있나요? 일반적인 사용자들은 이러한 서비스를 이용하기 위해 해당 서비스를 제공하는 사이트를 방문하여 서비스를 이용하거나 해당앱을 설치하여 사용할 수 있습니다.

하지만 이런 서비스를 활용하여 다양한 파생 서비스를 개발하기 위해서는 사용자기 직접 사이트에 방문하거나 앱을 설치하는 방식으로는 개발을 할 수 없습니다.

이러한 서비스와 온라인으로 연결하여 해당 서비스를 요청하고 데이터를 받을 수 있는 통신채널이 있어야 다양한 파생 서비스가 만들어질 수 있는데, 이렇게 컴퓨터 스스로 온라인으로 연결하고 서비스를 제공받는 방식이 Application Programming Interface 즉, API 입니다.

OPEN API는 어떠한 앱이나 프로그램이 자격을 갖추면, 온라인상에서 해당 API 서비스에 접근하는 것을 허용하는 개념인 OPEN이 추가된 개념입니다.

RESTful API

RESTful: REST는 Representational State Transfer의 줄임말입니다. 데이터 자원을 이름으로 구분하여 해당 데이터 자원의 상태를 주고받는 모든 것을 의미합니다. RESTful은 REST의 원칙을 따르는 시스템 혹은 그러한 환경을 의미합니다.

Representational State Transfer(REST)는 API 작동 방식에 대한 조건을 부과하는 소프트웨어 아키텍처입니다. REST는 처음에 인터넷과 같은 복잡한 네트워크에서 통신을 관리하기 위한 지침으로 만들어졌습니다. REST 기반 아키텍처를 사용하여 대규모의 고성능 통신을 안정적으로 지원할 수 있습니다. 쉽게 구현하고 수정할 수 있어 여러 플랫폼에서 사용할 수 있습니다.

RESTful은 HTTP 프로토콜의 인프라를 그대로 사용하여 REST API 사용을 위한 별도의 인프라를 구축할 필요가 없기때문에 많은 API 서비스 구축에 활용되고 있습니다. 또한 RESTful API의 장점으로는 쉬운 확장성, 유연성, 독립성 등의 특징이 눈에띄는 방식입니다.

이러한 이유로, 위에서 설명한 대형 ICT 기업들의 OPEN API는 대부분 RESTful API 환경에서 서비스가 제공되고 있습니다.

JSON 구조

JSON: JavaScript Object Notation의 약자입니다. JSON은 Javascript 데이터의 구조를 쉽게 표현하기 위한 문자 기반의 표준 포맷입니다.

Map: 키와 값으로 구성되는 데이터 구조로, 하나의 Map 안에 여러개의 키와 값이 쌍으로 저장됩니다. 원하는 값을 찾기 위해서는 키를 이용합니다.

Array: 인덱스 주소에 값이 저장되는 구조로 원하는 값을 찾기 위해서는 인덱스 주소를 이용합니다.

JavaScript 에서 복잡한 구조의 데이터를 저장하고, 전송하기 위해서 사용되는 문자기반의 포맷입니다. 일반적으로 다른 코딩언어의 경우 데이터 구조를 정형화 하기 위해 Map 이나 Array 등의 객체를 제공하지만 JavaScript에서는 이러한 Map, Array를 보다 쉽게 사용할 수 있는 환경을 위해 JSON 구조를 제공하고 있습니다.

JSON의 기본 구조는 '{''}' 사이에 키:값 의 형태를 취합니다. 예를들어 우리반에 홍길동과 친구와 전우치라는 친구가 있다는 내용을 JSON으로 표현하자면 아래와 같습니다.

우리반 = {
    "홍길동":{
        "성별":"남자",
        "키":175
    },
    "전우치":{
        "성별":"남자",
        "키":177
    }
};

API Drag 서비스는 JavaScript를 인식하도록 되어있기 때문에, JavaScript의 데이터구조인 JSON을 기본 데이터 구조로 활용합니다.

JSON 구조

자격증명

API Drag 서비스는 다양한 OPEN API 서비스를 조합하여 Macro 서비스를 제작하는 서비스입니다. API Drag 에서 제공하고 있는 Kakao, Naver, Google OPEN API 서비스는 누구나 사용할 수 있는 OPEN 서비스이지만 적정한 자격을 갖추어야 서비스를 제공합니다. 그리고 이러한 서비스를 사용할 자격을 갖고있음을 증명하는 것이 자격증명입니다.

저희 API Drag는 다른 웹 서비스와 다르게 이메일 주소를 이용한 회원가입이나 ID/Password 방식의 가입방법을 제공하지 않습니다. 그 이유는 Kakao, Naver, Google 의 OPEN API 서비스를 제공하기 위해 해당 서비스의 자격증명을 득하는 절차를 거쳐야 하기 때문입니다.

저희 API Drag 서비스에서 Google OPEN API를 이용하여 Macro 서비스를 구현하기를 원하신다면 회원가입시에 구글 계정으로 회원계정을 생성해야 합니다. 그리고 Kakao, Naver 서비스를 같이 사용하시기를 원하신다면 Kakao 계정으로 로그인 혹은 회원가입을 해야 하고, Naver 계정으로도 회원가입 혹은 로그인을 해야 합니다.

하지만, 두 종류의 OPEN API를 활용하기 위해 로그인 페이지나 회원가입 페이지로 이동할 필요는 없습니다. 해당 자격증명이 필요한 상황이 되면, API Drag 프로젝트 편집기에서 사용자에게 자동으로 로그인을 요청할 것입니다.

자격증명

프로젝트

Trigger: Macro 서비스가 동작하도록 최초의 이벤트가 발생하는 것

API Drag 서비스는 Macro 서비스를 제공하기 위한 최소 단위를 프로젝트로 정의하고 있습니다.

Macro 서비스를 제작하기 위해서 가장 먼저 프로젝트를 생성하고, 프로젝트 편집기로 이동하여 Macro 서비스를 제작합니다.

프로젝트를 생성하고 Macro 서비스를 제작한 후, 배포를 하게되면 개발을 위한 일련의 과정은 마무리가 된 것입니다. 하지만 이 Macro 서비스는 스스로 동작하지 않을 것입니다. 그 이유는 이 Macro 서비스가 실행되기 위한 Trigger가 등록되지 않았기 때문입니다. Trigger의 동작은 프로젝트 단위로 등록하고 동작합니다.

동작 Trigger

서브도메인: 보통 도메인은 apidrag.com 의 포맷입니다. 서브 도메인은 이 apidrag.com 앞에 추가적인 주소가 붙는 것인데, 사용자가 요청한 서브도메인이 angel 이라면 Trigger의 서브도메인은 angel.api.apidrag.com 이 됩니다.

Trigger의 방식은 다양합니다. API Drag 서비스에서는 스케쥴링HTTP호출 두 종류의 Trigger를 제공하고 있습니다.

스케쥴링은 동작하는 시간을 지정하고, 해당 조건에 만족하는 상황이 되면 반복적으로 등록된 프로젝트를 실행하는 방식입니다.

스케쥴링

HTTP호출은 앞에서 설명한 RESTful API 와 동일한 개념으로 이해하시면 됩니다. 사용자가 등록한 서브도메인 주소를 이용하여 웹 주소를 Listening 하고 있는 프로젝트가 있고, 외부로 부터 HTTP 요청이 들어오면 동작하게 됩니다.

Agency

API Drag 서비스는 누구나 쉽게 OPEN API를 활용할 수 있는 쉬운 기능을 제공합니다. 하지만 어느정도 기초 ICT 지식이 수반되어야 함은 부정할 수 없습니다.

변수, 조건문, 반복문 등의 가장 기본적인 코딩 개념도 없는 사용자는 API Drag 서비스를 이용하여 Macro 서비스를 개발하는데 제약이 있습니다. 이 경우 전문가의 도움을 받아보는 것도 좋은 방법입니다.

주변에 IT 전문가가 있다면 API Drag 계정을 알려주고 개발을 의뢰할 수 있지만, 이 경우 로그인 정보를 알려주어야 하는 보안상 문제가 발생할 수 있습니다.

이런 상황이라면 IT 전문가에게 API Drag 계정을 생성하게 하고 Agency로 지정해 보세요. 서로 다른 계정으로 개발 도움을 받을 수 있기 때문에 내 계정을 안전하게 지킬 수 있습니다.

Agency

아이템 블록

아이템은 코딩블록입니다. API Drag 에서 제공하는 아이템 블럭은 독립적인 기능 동작을 하는 블럭이며, 이러한 아이템 블럭을 서로 엮어서 Flow를 만들고 아이템 블럭에 동작 방식을 설정하여 Macro 서비스가 완성됩니다.

예를 들면 Branch 블럭은 들어오는 데이터의 조건에 따라 분기를 해 주는 동작을 하는 아이템 블럭이며, Assign 블럭은 데이터 값을 새로 만든 데이터 변수에 할당 해 주는 동작을 하는 아이템 블럭입니다.

사용자는 프로젝트 편집기에서 왼쪽에 제공되는 블럭을 편집기로 Drag and Drop 하여 위치 시키고, 아이템 블럭과 아이템 블럭 사이를 연결하여 Flow 를 만듭니다.

아이템 블록

Last updated