과일정보의 최종 완성 모습입니다.
페이지를 열면 미리 저장한 과일정보가 리스트로 출력됩니다.
리스트 페이지에서는 과일 이름과 평점을 별 아이콘으로 표시합니다.
과일 이름을 클릭하면 해당 과일의 상세 페이지로 이동합니다.
상세 페이지에서는 과일 이름과 사진, 설명이 표시됩니다.
참고로...
휴대폰 화면으로 보고 싶다면 앱스토어 들어가셔서 appgyver 검색 하시면 어플이 있습니다.
해당 어플 설치하시면 작업중인 프로젝트 확인이 가능합니다.
1. Data Resource
데이터베이스는 REST API를 지원하며 간단하게 사용할 수 있는 Airtable을 이용합니다.
Airtable은 무료 계정 가입할 수 있으며 Airtable 관련 자세한 내용은 여기서 설명하지 않겠습니다.
Airtable | Everyone's app platform
Airtable is a low-code platform for building collaborative apps. Customize your workflow, collaborate, and achieve ambitious outcomes. Get started for free.
airtable.com
로그인 후 Workspace에서 TEST라는 이름의 base를 만들고 클릭하여 진입합니다.
TB_FRUITS라는 테이블을 만들고 필드를 생성합니다.
기존 필드를 삭제하고 새로 만들어도 되고 rename 및 필드 타입을 수정할 수 있습니다.
필드는 아래 그림과 같이 정의하고 데이터를 입력합니다.
| 필드 이름 | 필드 타입 | 설명 |
| name | Single line text | 과일 이름 |
| desc | Long text | 과일 설명 |
| image | Attachment | 과일 이미지 |
| star | Number | 평점 |
2. REST API
Airtable에서 제공하는 API 페이지로 이동합니다.
REST API - Airtable
After you’ve created and configured the schema of an Airtable base, use the API to create, read, update, and destroy records.
airtable.com
API 페이지 하단에 TEST라는 이름의 base를 클릭하면 API화면으로 진입합니다.
먼저 유의할 점은 좌측 메뉴 중 RATE LIMITS를 클릭합니다. 해당 내용은 초당 5건의 요청만 가능하며 이를 초과 시 상태코드 429를 반환하며 30초 후에 다시 시도해야 하니 사용에 유의하시기 바랍니다.
REST API 설정을 위해 API키가 필요합니다. 이는 AUTHENTICATION의 첫번째 줄에 있는 account 링크를 클릭하거나 화면 우측 상단의 show API key를 체크하면 확인 가능합니다.
과일정보에서는 GET만 사용합니다. 따라서 좌측 메뉴의 List records를 클릭하여 Base URL 및 파라미터 값을 확인합니다.
'Builder > Appgyver' 카테고리의 다른 글
| [Appgyver] 데이터 바인딩(Data Binding) (0) | 2021.05.25 |
|---|---|
| [Appgyver] 페이지 변수(Page Variables) (0) | 2021.05.25 |
| [Appgyver-과일정보] 3. 상세 페이지 만들기 (0) | 2021.05.24 |
| [Appgyver-과일정보] 2. 리스트 페이지 만들기 (0) | 2021.05.24 |
| [Appgyver] 설정 및 Composer Pro 기본 화면 (0) | 2021.05.21 |