반응형

안녕하세요.

저번 글에서는 Automation 의 정의와 Actions 와의 차이점, Process 의 구성에 대해 알아보았는데요, 혹시 관련 내용을 잘 모르시는 분께서는 먼저 아래 글을 확인해 주시기 바랍니다.

 

[앱시트 중급] 04. 앱시트 자동화의 두번째 핵심, Automation (1)

안녕하세요. 이번 시간에는 앱시트 자동화의 두번째 핵심 요소인 Automation 을 공부해 보도록 하겠습니다. Automation 이 Actions(Behavior) 와 어떤 차이점을 가지고 있는지, 언제 Automation 을 사용해야 하

appsheet.tistory.com

이번 글에서는 실제로 Automation 을 사용하는 방법을 여러 가지 예시와 함께 설명해 드리도록 하겠습니다.

그럼 시작해 볼까요?

 

 

● Automation 예시1 - 이메일 보내기

첫번째 예시로 새로운 과일이 추가됐을 때 추가된 과일의 kcal 값이 10이 넘으면 고칼로리 과일로 표시한 뒤, 관리자에게 알림 이메일을 보내 보겠습니다. 우선 저는 '10kcal 이상 과일 추가 시 고칼로리 표시' 이라는 봇을 생성해 주었습니다.

새로운 이벤트를 생성한 뒤 이벤트를 정의해 줍니다. 데이터가 추가됐을 때 Automation 이 실행되도록 하기 위해서는 Data Change 이벤트 중 Adds only를 선택해 줍니다.

그 다음으로는 Table을 지정해 줍니다. 과일 테이블을 지정하게 되면 다른 테이블이 아닌 과일 테이블에서 발생한 이벤트만 가져오게 됩니다.

마지막으로 Condition을 지정합니다. Condition은 필수로 지정해야 하는 값은 아니지만, 이벤트를 한 번 더 필터링해줄 수 있어 유용합니다. 저는 칼로리가 10 이상인 과일에 대해서만 작업이 필요하므로 아래와 같이 FORMULA 를 작성하였습니다.

이제 프로세스를 정의해 보겠습니다. 이 예시에서는 프로세스에서 총 두 개의 단계(step)가 수행되어야 합니다.

  1. 과일의 [고칼로리] 컬럼을 Yes로 변경합니다.

  2. 이메일을 전송합니다.

먼저 고칼로리 표시를 위한 단계입니다. 데이터 컬럼 값을 바꾸는 행위는 Run a data action 을 선택해야 합니다.

Data action 으로는 특정 행의 값을 변경하는 Set row values 작업을 선택해 줍니다. 변경할 컬럼은 [고칼로리] 컬럼이며, 이 컬럼의 값을 Yes(True)로 설정하면 됩니다.

다음으로는 추가된 데이터에 대해서 메일을 보내주도록 하겠습니다. 새로운 Run a task 단계를 생성해 줍니다. Task는 당연히 Send an email 로 선택해 주시면 됩니다. 다음은 Email Type인데요, Embedded app view와 Custom template이 있습니다.

Embedded app view 를 선택하면 템플릿과 함께 메일에 앱시트 화면 중 일부가 표시됩니다. 사용자는 메일 상에서 앱시트 데이터를 변경하거나 Action을 진행할 수 있습니다. 반면에 Custom template은 굳이 앱시트 화면을 메일에 표시하지 않고, 템플릿에 맞는 내용을 자동으로 작성하여 메일을 보내줍니다.

저는 Embedded app view로 선택하도록 하겠습니다. 이후 메일에서 표시할 뷰와 관련된 테이블을 선택한 후, 누구에게 메일을 보낼지 작성합니다. 직접 이메일 주소를 입력해도 되고, 수식으로 메일 주소를 가져와도 됩니다.

그 다음으로는 템플릿을 작성해 주어야 합니다. 저는 이와 같이 작성했습니다.

여기에서 <<_APPNAME>>, <<[과일 아이디]>> 라는 부분이 보이실 겁니다. 이와 같이 <<겹화살괄호>>로 변수나 수식을 입력해 주게 되면 메일이 템플릿에 맞게 작성되어 발송됩니다. 템플릿에서 사용하는 수식에 대한 자세한 내용은 >> 이 문서 << 를 확인해 주시기 바랍니다.

그 다음으로는 메일 상에 어떤 뷰를 보여줄지를 선택하면 됩니다. 저는 시트1_Detail 뷰를 선택해 주겠습니다.

Preview email body 버튼을 누르면 아래와 같은 예시 작성 내용을 확인할 수 있습니다.

마지막으로 Advanced 버튼을 누르면 메일 발신자명을 바꾸거나 이메일 Footer를 추가해줄 수 있습니다.

이제 실제로 데이터를 추가해 보거나, Test 라는 버튼을 통해 기능이 잘 동작하는지 확인해 보시면 됩니다.

 

 

● Automation 예시2 - 파일 만들기

두번째 예시로, 매주마다 과일에 대한 보고서 파일을 작성해 보도록 하겠습니다. '매주 과일 보고서 작성' 봇 생성 후 아래와 같이 이벤트를 정의해 주었습니다.

이때 Time zone은 한국 표준 시간인 GMT+09:00 시간대로 바꾸어 주시는 것이 좋습니다. 하단에 조건부로 이벤트가 실행되게 할 수도 있지만, 저는 굳이 조건을 걸지는 않겠습니다.

다음은 프로세스입니다. 새 단계(Step)을 만들어 줍니다.

Custom task 의 Create a new file 을 통해 파일을 만들어줄 생각입니다.

과일 테이블을 선택해준 후, HTTP Content Type을 지정해 줍니다. 파일이 어떤 형식으로 저장될지를 지정하는 것으로, .pdf, .csv, .json 등으로 지정 가능합니다. 보통은 .pdf 파일로 지정해줍니다.

다음으로 가장 중요한 부분인 템플릿을 생성해 줍니다. 미리 작성한 템플릿을 넣어주어도 되고, Create 버튼을 눌러 새로운 템플릿 파일을 생성해줘도 됩니다. 일반적으로는 Create 버튼을 눌러 새로운 템플릿을 작성하게 됩니다. 다행인 점은, 이 때 빈 문서가 생성되는 것이 아니라, 앱시트에서 제공하는 기본 템플릿 문서가 생성됩니다.

이런 식으로 기본 생성된 파일을 원하는대로 가공하고 수정해 주시면 손쉽게 템플릿 파일을 완성할 수 있습니다. 위 내용에서도 언급했지만, <<겹화살괄호>> 안에 컬럼 이름이나 수식을 넣어주면 각 행의 데이터에 맞게 값이 들어가게 됩니다. 저는 이런 식으로 꾸며 주었습니다.

여기서 특이한 점을 하나 발견하셨을 텐데요, 바로 <<Start: 과일[과일 아이디]>>와 <<End>> 부분입니다. 한 개의 행에 대해서 출력하는 템플릿을 만드는 경우에는 이렇게 바꿔줄 필요가 없지만, 여러 개의 행을 한 번에 출력하려면 값들을 <<Start: 테이블명[참조 테이블의 ID]>>와 <<End>>로 묶어주어야 합니다. 이 템플릿으로 문서를 작성하면 아래와 같이 출력됩니다. 원본 테이블도 올려드리오니 값을 잘 비교해 보시기 바랍니다.

원본 테이블:

과일 아이디 갯수 칼로리 고칼로리
2 사과 394 11 TRUE
3 포도 3 5 FALSE
4 오렌지 7 3 FALSE

출력 결과:

마지막으로 파일의 경로 및 이름을 넣어주시면 됩니다.

File Folder Path를 통해 앱의 기본 경로로 시작해서 어떤 폴더에 파일을 저장할지 지정할 수 있습니다. 앱의 기본 경로는 설정 > Information > Default app folder에 적혀 있습니다. 저는 File Folder Path 경로를 '/과일 보고서' 라고 했으니, 종합해 보면 파일의 실제 경로는 '내드라이브/appsheet/data/testApp-3796008/과일 보고서'가 될 것입니다.

'과일 보고서' 폴더에 지정한 이름으로 파일이 생성된 모습

또, File Name Prefix 옵션으로 저장될 파일의 이름을 수식으로 지정할 수 있습니다. 저는 아래 수식으로 작성하였습니다.

TEXT(NOW(), "yyyy년 mm월 dd일 ") & "과일 보고서"

Disable Timestamp 를 활성화시키지 않으면 지정한 파일 이름 앞에 긴 날짜/시간 문자열이 붙게 됩니다. 저는 웬만하면 Timestamp는 비활성화 되도록 설정하고 있습니다.

이제 마찬가지로 Test 라는 버튼을 통해 기능이 잘 동작하는지 확인해 보시면 됩니다.

 

 

● Automation Test하기 

Automation 기능은 Event에 의해 실행되기 때문에 직접 테스트해보기가 꽤나 번거롭습니다. 데이터를 추가하는 이벤트 정도는 쉽게 발생시킬 수 있지만, 일주일을 기다린다거나 그 외 조건에 맞는 다양한 이벤트를 발생시키는 것은 쉬운 일이 아니죠.

그럴 때 유용하게 사용되는 것이 'Test'라는 기능입니다. Test 버튼은 Automation 기준 오른쪽 위에 위치하고 있습니다.

Test 버튼을 누르면 아래와 같은 화면이 표시됩니다. 하나씩 설명해 보도록 하겠습니다.

우선 첫번째 열인 Event Condition 은 어떤 행에 의해서 이 Automation이 실행될 것인지를 알려줍니다. 화면에 보이는 것은 '10kcal 이상 과일 추가 시 고칼로리 표시' 봇인데요, 위에서 보셨듯이 제 테이블에서 10kcal이 넘어가는 과일은 사과 뿐이기 때문에 첫번째 행만 True로 표시되고, 나머지 행들은 False로 표시됩니다.

그 다음 컬럼부터는 {중괄호}로 묶여 있는 긴 값과, Open 과 Execute 버튼이 보입니다. {중괄호} 내의 값과 Open 버튼은 아직은 신경쓰지 않으셔도 됩니다.

컬럼 이름을 보시면 Process, Run task "b908e740-8bb4-406d-9724-42981ba28962-고칼로리 표시", Run task "Task for 메일 보내기" 라고 되어 있죠? Process는 전체 프로세스를 실행시킬 때, 다음 열들은 프로세스 내의 각 task를 별도로 실행해 보고 싶을 때 Execute 버튼을 눌러주시면 됩니다. 만약 에러가 있다면 빨간 글씨로 표시되며, 에러가 없이 잘 실행되고 나면 Success 라는 창이 나오게 됩니다.

 

 

● Automation Monitor 하기

마찬가지로 Automation 우측 상단에 Monitor 라는 버튼이 있습니다. 이 버튼은 실제 Automation의 실행 과정과 결과에 대해 알려줍니다.

아래 보이는 것이 Monitor 화면입니다. 앱시트 앱을 모니터링 할 수 있는 전용 앱이라고 보시면 됩니다.

가장 중요한 것은 Bots 부분에 있는 Status 항목입니다. 초록색으로 Complete 라고 표시되었다면 Automation이 정상적으로 실행된 것이고, 빨간색 Error 로 표시되었다면 정상적으로 실행되지 않은 것입니다. 또한, 주황색 Pending 으로 표시된다면 아직 Automation이 실행중인 상태입니다.

Monitor를 통해 앱의 Automation이 잘 실행되었는지 확인할 수 있고, 문제가 생겼다면 어떤 부분에서 어떤 에러가 발생했는지에 대해 확인할 수 있기 때문에 Automation 이슈 문제가 생기는 경우 이 부분을 꼭 확인해봐야 합니다.

여기까지 두 가지 Automation 예시와, Automation Test 및 Monitor 기능에 대해서 알아보았습니다. Automation 을 어떻게 설정해야 할지 잘 모르셨다면 많은 도움이 될 겁니다. 그 외에도 많은 Task 및 활용법이 있지만 이 글에 다 담을 수는 없기에 제가 가장 자주 쓰고 중요하다고 생각하는 것들만 모아 두었습니다. 혹시 추가적인 설정 방법에 대한 질문이 있으시다면 댓글로 남겨주세요. 다음 시간에는 앱시트와 구글 Chat 을 연동하는 방법을 알아보도록 하겠습니다. 같이 열심히 공부해 보아요~

 

반응형
반응형

안녕하세요.

이번 시간에는 앱시트 자동화의 두번째 핵심 요소인 Automation 을 공부해 보도록 하겠습니다. Automation 이 Actions(Behavior) 와 어떤 차이점을 가지고 있는지, 언제 Automation 을 사용해야 하는지, Automation 에는 어떤 기능들이 있는지 확인해 보도록 하겠습니다.

꽤나 내용이 길어질 것 같아서 Automation 을 실제로 사용하는 방법과 예시 등에 대해서는 다음 글에서 따로 다루어야 할 것 같습니다.

그럼 시작해볼까요?

 

 

● Automation 이란?

Automation 은 'Event 에 따라 Process 를 진행하는 Bot' 을 의미합니다.

여기에서 Event 는 Process 를 진행시키기 위한 조건을 의미하며 크게 두 가지로 나눌 수 있습니다. 첫번째는 Data Change Event 로, 데이터가 생성, 수정 또는 삭제되는 것을 의미합니다. 두번째는 Schedule Event 로, 데이터와 관계 없이 특정 시간이 되었을 때 프로세스를 진행시킵니다.

또한 Process 는 Bot 이 Event 에 따라 수행하는 작업을 의미합니다. Process 에는 메일 보내기, 알림 보내기, 문자 보내기, 웹훅 요청 보내기, 파일 생성하기, 스크립트 실행하기, Action 실행하기 등이 있습니다.

종합해보면 Automation 을 사용한다면 '매주 자동으로 요약 보고서 생성하기', '새로운 데이터가 추가될 때마다 메일 보내기' 등을 설정할 수 있습니다.

 

 

● Automation 과 Actions 의 차이점

저번 글에서 설명드린 Actions 와 지금 설명드리는 Automation 에는 대표적으로 두 가지 차이점이 있습니다.

첫째, 실행 조건입니다. Actions 는 사용자가 직접 버튼을 눌러야 실행되지만, Automation 은 특정 Event 가 발생해야 실행이 됩니다. 물론 Automation 을 통해 Action 이 실행되는 경우나, Automation 의 Test 버튼을 눌러 실행시키는 경우는 논외입니다.

둘째, 할 수 있는 작업의 차이입니다. Actions 와 Automation 은 둘 다 Data action 을 실행할 수 있습니다. 다만 Actions 는 앱 내부에서 사용자가 버튼을 눌렀을 때를 기본적인 실행 조건으로 잡고 있기 때문에 특정 페이지로 이동하거나, 외부 페이지를 여는 등의 내부 작업에 조금 더 특화되어 있습니다. 그리고 Automation 은 앱 외부와 소통하거나 API 요청을 주고 받는 외부 작업에 더 특화되어 있습니다.

따라서 용도와 목적에 맞게 Actions 와 Automation 을 적절히 섞어가며 사용해야 합니다. 특히 Actions 를 통해 변경되는 데이터를 Automation 의 이벤트 조건으로 삼아 Automation 도 같이 실행되게 하는 등의 응용 작업도 가능합니다.

 

 

● Process 의 구성

Automation 의 Process 를 어떻게 정의하는지 조금 더 세부적으로 알아보도록 하겠습니다.

Automation 은 아래와 같이 구성되어 있습니다.

만들어진 봇(Bot) 은 이벤트(Event) 에 의해 프로세스(Process) 를 실행하며, 각 프로세스(Process) 는 여러 개의 단계(Step) 로 이루어져 있습니다. 단계(Step) 는 Task 와 Action 등의 작업을 진행하거나, 작업 진행을 위한 조건을 걸어주는 역할을 하게 됩니다.

Process 내에 Step을 생성하게 되면 아래 이미지와 같은 작업을 지정할 수 있습니다.

각 작업에 대해 설명해 보겠습니다.

작업 이름 설명
Run a task 메일을 보내거나 파일을 생성하는 등 Task 를 실행합니다. (자세한 내용은 아래에)
Run a data action 지정한 Actions 를 실행합니다.
Branch on a condition 조건 수식(Formula)에 따라 각 step 을 실행할지 말지를 결정합니다.
Wait 특정 조건이 만족되거나 지정한 기간이 될 때까지 기다립니다.
Call a process 다른 Bot 에서 지정한 Process 작업을 가져옵니다.
Return values 값을 return 합니다. return 된 값은 나중에 사용 가능합니다.

다음으로는 각 Task 에 대해 설명해 보겠습니다.

Task 이름 설명
Send an email 지정한 사용자에게 이메일을 보냅니다. 단, 외부로 이메일을 보내려면 앱이 배포되어 있어야 합니다. 이메일은
  1. 이메일 내에 앱시트 화면의 일부가 삽입되는 Embedded app view 와,
  2. 원하는 내용으로 메일을 구성할 수 있는 Custom template 이 있습니다.
Send a notification 지정한 사용자에게 앱 알림을 보냅니다.
Send an SMS 지정한 번호로 문자를 보냅니다.
Call a webhook 앱시트 내의 데이터를 활용하여 웹훅 요청을 보냅니다. Custom url, Slack Hook, AppSheet API 요청이 있습니다.
Create a new file 지정한 템플릿을 기반으로 작성된 새로운 파일을 생성합니다.
Call a script Apps Script 코드를 실행합니다.

앱을 처음 만드실 때는 Task 의 모든 부분을 마스터할 필요는 없습니다. 간단한 템플릿 작성법 정도야 일반인 개발자 수준에서도 커버 가능하지만, 웹훅을 보내거나 스크립트 코드를 작성하는 부분은 고급 과정에서 다루어야 할 어려운 작업들 중 하나이기 때문입니다. 또, 문자를 보내는 것도 외부 솔루션과의 연동이 필요하기 때문에 잘 사용하지 않습니다.

따라서 앱시트 중급 개발자 입장에서는 이메일을 보내는 것과, 앱 알림을 보내는 것, 그리고 파일을 생성하는 세 가지 정도만 공부해 두시면 됩니다. 나머지는 앱시트가 API 작업도 할 수 있구나, Apps Script 코드와 연동해서 조금 더 복잡한 작업도 처리할 수 있구나 정도로만 이해해 주시면 되겠습니다.

지금까지 Automation 의 정의와 Actions 와의 차이점, Process 의 구성에 대해 알아보았습니다. Actions 와 Automation 의 기능들을 활용하여 정말 다양한 기능들을 만들 수 있을 것 같지 않나요? 다음 시간에는 실제로 Automation 을 사용하는 방법을 여러 가지 예시와 함께 설명해 드리도록 하겠습니다. 같이 열심히 공부해 보아요~!!

반응형
반응형

안녕하세요.

이번에는 AppSheet 자동화의 핵심인 Actions(Behavior)와 Automation에 대해 자세히 알아보려고 합니다. 여기서 제가 말하는 자동화는, 사람이 해야 할 일을 최소화하기 위해 반복적으로 처리되는 작업을 미리 정의하는 것을 의미합니다.

AppSheet의 자동화는 무엇을 할 수 있으며, 어떻게 사용하는 것이 좋을까요? 저는 오늘 이 질문에 대한 대답을 가지고 왔습니다. 입문 글에서의 내용과 겹치는 부분도 있지만, 중급 수준에 맞게 조금 더 체계적이고 자세한 정보를 적어보도록 하겠습니다. 이번 글에서는 먼저 Actions에 대해서 다루어 보려고 합니다.

그럼 시작해볼까요?

 

 

● Actions 로 할 수 있는 것들

버튼을 클릭하는 등의 이벤트가 발생했을 때 발생하는 액션을 가리키는 Actions (이전 UI에서는 Behavior)에서는 크게 세 종류의 작업을 지정할 수 있는데요, 실행되는 액션이 앱에 대한 것이라면 App, 데이터에 대한 작업이라면 Data, 그 외 외부 솔루션과 관련된 작업에 대한 것이라면 External 이라고 분류할 수 있습니다.

이러한 Action 작업들은 보통 특정 행에 대해서 동작합니다. 예를 들어 1번 행의 디테일 페이지에서 정의된 버튼을 누르면 일반적으로 1번 행에 대해 작업이 실행됩니다.

하나씩 살펴보겠습니다. 먼저 App에 대해 정의할 수 있는 작업들입니다.

Action: App 설명
App: copy this row and edit the copy 행 데이터를 복사하고 복사한 행을 편집합니다.
App: edit this row 이 행을 편집합니다.
App: export this view to a CSV file (not a row-level action) 이 뷰의 데이터를 CSV 파일로 추출합니다. (행 단위 액션 아님)
App: go to another AppSheet app 다른 앱시트 앱으로 이동합니다.
App: go to another view within this app * 이 앱의 다른 뷰로 이동합니다.
App: import a CSV file for this view (not a row-level action) 이 뷰에 데이터를 CSV 파일로 입력합니다. (행 단위 액션 아님)
App: open a form to add a new row to this table (not a row-level action) ** 이 테이블에 새로운 행을 추가하기 위해 Form을 엽니다. (행 단위 액션 아님)
* 자주 쓰는 기능 중 하나로, 다른 뷰에 대한 바로가기를 만들 수 있습니다.                                                                                                                        ** 

* 자주 쓰는 기능입니다. 다른 뷰에 대한 바로가기를 만들 수 있습니다. 같이 쓰는 함수: LINKTOFILTEREDVIEW()

** 자주 쓰는 기능입니다. 연결된 테이블에 값을 추가하기 위한 Form을 열 때 선택된 행의 값을 추가할 행의 Initial 값으로 활용할 수 있습니다.

 

다음은 Data에 대해 정의할 수 있는 작업들입니다.

Action: Data 설명
Data: delete this row 이 행을 삭제합니다.
Data: execute an action on a set of rows 여러 행에 대해서 지정된 (다른) 액션을 수행합니다.
Data: set the value of some columns in this row* 이 행의 지정한 컬럼의 값을 설정한 값으로 변경합니다.
Data: add a new row to another table by using values from this row** 이 행의 값들을 이용하여 다른 테이블에 새 행을 만듭니다.

* 자주 쓰는 기능입니다. 데이터 수정에 대한 자동화 작업을 위해 활용할 수 있습니다.

** 자주 쓰는 기능입니다. Form이 열리지 않고 데이터가 바로 추가됩니다.

 

그리고 External에 대해 정의할 수 있는 작업들입니다.

Action: External 설명
External: go to a website* 웹사이트로 이동합니다.
External: open a file 외부 파일을 엽니다.
External: start an email (기본 메일 앱에서) 이메일을 작성합니다.
External: start a phone call (기본 전화 앱에서) 전화를 겁니다.
External: start a text message (기본 문자 앱에서) 문자를 보냅니다.

* 자주 쓰는 기능입니다. 홈페이지나 외부 사이트에 연결하고 싶을 때 사용합니다. 데이터에 파일 링크가 입력된 경우 open a file 대신 사용하기도 합니다.

 

그 외에, Grouped 라는 작업을 정의할 수 있습니다.

Action: Grouped 설명
Grouped: execute a sequence of actions* 여러 액션을 한번에 실행합니다.

* 자주 쓰는 기능입니다. 버튼을 한 번만 클릭해도 여러 개의 액션이 한번에 실행되어 보다 다양한 자동화 작업이 가능해집니다.

 

 

● Actions 를 사용하는 방법

Behavior 로 할 수 있는 것들이 뭔지 잘 파악하고 나면 본격적으로 Actions 를 사용해 보아야 할 것입니다. Actions 를 사용할 때 구체적으로 어떻게 설정해야 하는지 몇 가지 예시와 함께 설명해 보겠습니다.

  예시1. Actions 를 통해 데이터 변경하기

기본적으로 AppSheet 사용자가 데이터를 변경하기 위해서는 시스템에서 생성된 Edit 이라는 버튼을 눌러 편집을 진행한 뒤, 저장 버튼을 눌러 변경사항을 저장해 주어야 합니다. 다만 이는 사용자 입장에서는 꽤 번거롭게 느껴질 수 있습니다. 따라서 자주 이루어지는 편집 작업에 대해서는 Actions 로 지정하여 작업 소요를 줄여 주시는 것이 좋습니다.

또한 이 방법을 사용하게 되면 사용자가 무엇을 할 수 있으며 무엇을 해야 하는지 조금 더 직관적으로 확인할 수 있고, 데이터를 실수로 잘못 입력하지 못하게 됩니다.

다만 주의할 점은 Behavior 작업을 추가할 때 여러 사용자가 함께 작업을 진행했을 때를 고려해 주어야 한다는 것입니다. 예를 들어 아래와 같이 사과의 갯수에 1을 더해주는 Actions 와 사과의 갯수에 2를 곱해주는 Actions 가 있다고 가정해 봅시다.

한 사용자만 이 앱을 사용한다면 상관없지만, 만약 동시에 여러 사용자가 이 앱에 접속하여 한번에 +1과 *2 버튼을 누른다면 어떻게 될까요? 정답은 먼저 버튼을 누른 사용자의 작업만 반영이 됩니다. 나중에 버튼을 누른 사용자가 동기화를 하면 사과의 갯수가 먼저 버튼을 누른 사람의 값으로 변경됩니다. 만약 이러한 작업이 필요하다면 다른 방식으로 Actions 를 사용해 주어야 합니다.

그 방식은 사과 갯수라는 신규 테이블을 만든 후, +1 또는 *2 버튼을 눌렀을 때 바로 갯수가 바뀌는 것이 아니라, +1 또는 *2 버튼을 눌렀을 때 사과 갯수 테이블에 어떤 버튼을 눌렀는지에 대한 로그를 기록하게 하고, 사과의 갯수는 FORMULA를 통해 계산하는 방식입니다. 이렇게 하면 모든 Actions 작업이 누락되지 않고 진행될 것입니다.

  예시2. Actions 의 아이콘, 표시 방법과 표시 조건 정하기

Actions 는 최초 생성 시, 액션 작업이 지정된 테이블의 데이터를 사용하는 뷰 최상단에 종이비행기 모양의 아이콘 밑에 액션의 이름을 표시해주는 동그란 버튼 모양으로 보이게 됩니다.

Appearance 탭

앱의 아이콘과 표시 방법은 Behavior 메뉴에서 수정이 가능합니다. 먼저 Appearance 탭에서 Display name 을 변경하여 버튼의 이름을 바꿔줄 수 있고, Action icon 을 변경하여 버튼의 아이콘을 바꿔줄 수 있습니다. Prominence 또한 중요한데요, 어떤 옵션을 선택하는지에 따라 아래 이미지와 같이 표시가 됩니다.

Display as primary 옵션 선택 시
Display prominently 옵션 선택 시
Display inline 선택 후 Attach to column 옵션을 '갯수'로 지정할 시

또한 Do not display 옵션 선택 시 아이콘이 화면에서 사라집니다.

Behavior 탭

그 다음으로, 해당 Action의 Behavior 탭에서 앱이 표시되는 조건과, 버튼을 눌렀을 때 컨펌 메시지를 띄워서 한 번 더 확인할지를 결정할 수 있습니다.

Needs confirmation? 을 활성화 시키고 컨펌 메시지를 설정한 뒤 버튼을 누르면 아래와 같이 표시됩니다.

그 다음으로 Only if this condition is true 란에 적절한 FORMULA를 입력하여 앱에 버튼이 보이게 할지 말지를 선택할 수 있습니다. 예를 들어 [과일 아이디] = "사과" 와 같이 FORMULA 작성 후, 앱을 둘러보면 아래와 같이 [과일 아이디]가 "사과"일 때만 *2가 표시되는 것을 볼 수 있습니다.

그 외에도 CONTEXT("VIEWTYPE")="Detail" 과 같이 조건을 설정하면 Detail 뷰에서만 해당 버튼이 보이게 됩니다. 또한, 뷰마다 데이터 슬라이스를 만들어 버튼 표시를 제한하는 방법도 있습니다. 데이터 슬라이스를 만들 때 아래와 같이 해당 슬라이스에서 사용할 수 있는 버튼을 제한할 수 있습니다.

이후 해당 데이터 슬라이스를 뷰에 적용하면 그 뷰에서는 *2 버튼만 보이게 됩니다. 이 때 따로 지정하지 않으면 시스템에서 생성한 Actions 인 Add, Delete, Edit 버튼도 보이지 않게 됩니다. 참고하여 설정해 주시면 됩니다.

지금까지 Actions 로 할 수 있는 것들과 Actions 를 활용하는 방법에 대해 알아보았습니다. 이정도만 알고 사용해도 Actions 의 거의 모든 것을 알고 있다고 해도 과언이 아닙니다. 다음 시간에는 AppSheet 자동화의 두번째 핵심 기능인 Automation 기능에 대해 알아보도록 하겠습니다. 읽어주셔서 감사합니다. 같이 열심히 공부해 보아요~

반응형
반응형

안녕하세요.

이번 시간에는 다양한 앱에서 쓰이는 Formula 예시들을 가져와 보았습니다. 입문 강의에서 다뤘던 내용보다는 조금 더 구체적이고 조금 더 실용적인 내용입니다. 입문 강의 내용은 아래 링크를 참고해 주시기 바랍니다.

 

[앱시트 입문] 07. 앱시트 앱 개발 Key Points - 외부 배포용 앱, 에러 핸들링, Formula 예시

안녕하세요. 앱시트 입문 개발자 분들을 위해 앱시트 앱 개발 Key Points를 정리해 보았습니다. 이 글은 앱시트를 스프레드시트와 연동해서 사용하시는 분들, 아직 앱시트의 에러 

appsheet.tistory.com

Formula 작성도 하다보면 생각보다 반복되는 내용이 많아서 그러한 수식들을 모아놓은 '나만의 라이브러리'를 작성하시는 것도 좋은 방법입니다. 공유하고 싶은 나만의 꿀팁이나, Formula 작성에 어려움을 겪고 계신 분들은 댓글로 남겨주시면 많은 사람들에게 도움이 될 것 같습니다.

그럼 시작해 볼까요?

 

 

● 캘린더 색깔 지정하기

먼저 가볍게 시작해 보겠습니다. 앱시트에서 캘린더를 쓰는 앱은 꽤 많습니다. 그런데 개발을 진행하다 보면 캘린더 색이 원하는대로 표시되지 않아 불편할 때가 있습니다. 예를 들어 [미완료]인 작업은 빨간색으로, [완료]된 작업은 초록 색으로 표시하고 싶은 경우입니다. 그럴 때는 새로운 가상 컬럼에 이렇게 Formula를 작성해 주시면 됩니다.

SWITCH(
    [상태],
    "미완료", "Red",
    "Green"
)

이후 캘린더 뷰에서 아래와 같이 Category를 설정해주면,

아래 이미지처럼 원하는대로 일정의 색을 바꿀 수 있습니다.

테스트: 미완료, 테스트2: 완료

 

 

● 첨부파일 템플릿 활용법

입력된 데이터를 바탕으로 견적서나 보고서 등을 자동으로 생성하는 앱의 경우 첨부파일 템플릿을 작성해 주어야 합니다. 이 때 변수들을 이중꺾음괄호 안에 넣게 되는데요, 이 때 변수 뿐만이 아니라 함수도 넣을 수 있습니다.

또한, 문서 템플릿에서 리스트를 가져오는 방법으로 Start-End 메소드를 사용할 수 있습니다. 이를 활용하면 템플릿 상에서 활성화 상태의 주문 리스트 정보를 가져오기 위해 아래와 같은 표를 작성할 수 있습니다.

상품 가격 수량 총 금액
<<Start: SELECT(주문[주문ID], [상태]="활성")>><<[상품ID].[상품 이름]>> <<[상품ID].[가격]>> 원 <<[수량]>> 개 <<[상품 ID].[가격] * [수량]>> 원<<End>>

복잡해 보일 수 있지만, 하나씩 뜯어서 보면 어렵지 않습니다.

  • Start-End 메소드로 리스트를 불러온다.
  • SELECT() 함수로 불러올 리스트를 결정한다.
  • 꺾음 괄호 안에 불러오고 싶은 <<변수>>를 지정한다.

아래는 이 테이블을 통해 만들어진 문서의 예시입니다.

상품 가격 수량 총 금액
앱시트 스타터 7,000 원 10 개 70,000 원
앱시트 코어 14,000 원 10 개 140,000 원

 

 

● SHOW? 의 조건 정하기

저는 SHOW? 의 조건으로 두 가지 정도의 방법을 사용합니다.

  • 첫 번째는 권한에 의한 설정입니다.

보통 사용자 Role이 Admin인 경우에 이렇게 Formula를 작성합니다.

USERROLE() = ADMIN

 

  • 두 번째는 사용자 입력값에 의한 설정입니다.

예를 들어, 아래와 같은 방법으로 Form 뷰에서 사용자가 [배송 방법]을 "배달"로 선택한 경우에만 [주소 입력] 이라는 컬럼이 보이도록 설정할 수 있습니다.

[배송 방법] = 배달

"수학", "과학", "영어" 세 개의 선택지를 가진 [좋아하는 과목] 이라는 이름의 EnumList 값에 따라 [수학 점수] 컬럼을 표시하기 위해 IN() 함수를 활용하면 아래와 같은 응용도 가능합니다.

IN(수학, [좋아하는 과목])

 

 

● 특정 뷰로 이동하기

기본적으로 앱시트에서 데이터를 볼 때, 그 데이터를 클릭하면 해당 데이터에 대한 디테일 뷰로 이동하게 됩니다. 그러나 지금 설명드리는 방법을 통해 해당 데이터를 클릭했을 때 일어날 일을 지정할 수 있습니다.

우선 아래와 같은 테이블을 만들어 줍니다.

링크ID 이름 이동할 뷰 설명
Link-1 1번 메뉴 Menu1 첫번째 메뉴로 이동합니다.
Link-2 2번 메뉴 Menu2 두번째 메뉴로 이동합니다.
Link-3 3번 메뉴 Menu3 세번째 메뉴로 이동합니다.
Link-4 4번 메뉴 Menu4 네번째 메뉴로 이동합니다.

이 테이블을 앱시트 뷰로 만들어주면 4 개의 항목이 만들어질 것입니다(보통은 카드 뷰나 덱 뷰 선호). 그 다음으로는 각 항목을 선택했을 때 실행할 액션을 아래의 Formula 와 함께 작성해 줍니다. 예를 들어, 저는 아래와 같이 작성하였습니다.

LINKTOVIEW([이동할 뷰])

이 액션을 실행하게 되면 [이동할 뷰] 컬럼에 적힌 이름을 가진 뷰로 이동하게 됩니다. 그 다음으로는 아래와 같이 뷰 선택 > Behavior > Event Actions 에서 데이터를 클릭했을 때(Row Selected) 실행할 액션을 선택합니다.

참고로 카드 뷰의 경우 Layout 란에서 지정해 주어야 합니다.

이렇게 하면 데이터를 클릭했을 때 원하는 메뉴로 이동할 수 있게 설정할 수 있습니다. 다른 Formula를 써서 얼마든지 응용 가능한지라 꽤 자주 쓰는 테크닉입니다.

 

 

● 통계를 위한 값 만들기

앱을 만들다 보면 통계 대시보드를 만들어야 할 때가 꽤 있습니다. 막상 통계 대시보드를 만들어보려고 하면 생각보다 쉽지 않은데요, 원리는 알고 보면 간단합니다. 결국 통계는 2차원 그래프고, 2차원 그래프는 x축과 y축을 뭘로 설정할지만 정하면 되는 거니까요.

간단하게 알아보겠습니다. 배송을 위한 앱에서 "승인 필요", "승인됨", "거부됨", "배송 완료" 의 4개의 값을 갖는 [배송 상태] 라는 Enum 타입의 컬럼에서 각 타입에 대해 최근 7일 간 주문이 몇 개씩 있는지 확인하기 위한 통계입니다. 이 경우 최근 7일 간의 데이터를 뽑아내기 위해 아래와 같은 Row filter condition을 갖는 데이터 슬라이스를 만들어 줍니다.

HOUR(TODAY() - [DateTime])/24  <= 7

그 다음으로는 차트 뷰를 만든 다음 만들어둔 데이터 슬라이스를 선택 후 View Options 를 아래와 같이 설정해주면 됩니다.

여기서 Group aggregate가 의미하는 것이 y축, Chart columns가 의미하는 것이 x축이 됩니다. 즉, 7일간 이루어진 주문 데이터(Delivery Status)에서 각 배송 상태에 대해서 항목의 갯수를 세어(COUNT) 표시해달라는 의미가 되는거죠. 실제 그래프는 아래와 같이 완성됩니다.

최근 7일간 이루어진 배송 건들

이렇게 다양한 앱에서 쓰이는 Formula 예시들을 가져와 보았는데요, 생각보다 Formula가 여기저기서 많이 쓰이고 있다는 것을 알 수가 있습니다. 조금 더 복잡한 예시를 가져와 볼까 생각도 해봤는데 설명만 복잡해지고 결국 기본 함수들을 잘 쓸 수 있다면 다 하실 수 있을 것 같아서 굳이 가져오지는 않았습니다. 그럼 글은 여기서 마무리 하고 다시 한 번 말씀드리자면, 공유하고 싶은 나만의 꿀팁이나, Formula 작성에 어려움을 겪고 계신 분들은 댓글로 남겨주시면 감사할 것 같습니다. 같이 열심히 공부해 보아요~

반응형
반응형

안녕하세요.

이번 글부터 앱시트 중급 가이드를 진행할 예정입니다.

앱시트 중급 개발자의 조건은 무엇일까요? 저는 이렇게 생각합니다.

  1. 앱을 만들고 이를 유지보수 할 수 있는 사람.
  2. 개발할 수 있는 것과 없는 것을 구분할 수 있는 사람.
  3. 앱시트의 대부분의 기능을 알고 이를 적절히 활용할 수 있는 사람

이번 시리즈를 통해서 당당한 앱시트 중급 개발자가 되시기를 바라겠습니다. 그럼, 첫번째 내용입니다.

앱을 아무리 꼼꼼히 개발해도 실제로 그 앱을 사용자들에게 배포하여 사용하기 시작하면 예상하지 못한 다양한 의견과 문제점들을 마주하기 마련입니다. 버그가 있거나, 사용이 편리하지 못하거나, 개발한 기능이 생각보다 유용하지 못한 것, 사용량에 따른 속도 저하 등의 문제점들인데요, 이럴 때는 앱에 새로운 업데이트 사항들을 적용해 주어야 합니다.

이번 글에서는 이러한 유지보수 과정에 있어서 앱시트가 얼마나 편리한지 소개하고, 유지보수에 관련된 다양한 방법 및 기능들에 대해 소개해 보려고 합니다.

그럼 시작해볼까요?

 

 

● 버전 기록

앱시트에서는 SAVE 버튼을 누를 때마다 새로운 앱의 버전으로 저장됩니다. 이를 버전 기록이라고 하는데요, 앱시트 편집기에서 Manage > Versions > Version History 메뉴로 들어가 'Get version history'를 누르면 현재 버전과 이전 버전의 앱을 확인하고, 그 버전으로 앱을 롤백할 수 있습니다. 버전 기록은 저장 후 즉시 목록에 나타나는 것은 아니며, 일정 시간(버전 별로 상이)이 지나면 자동으로 삭제됩니다.

만약 AppSheet Enterprise 버전을 사용하고 있다면 Stable 버전에 대한 이야기를 빼놓을 수 없을 것 같습니다. 이미 앱시트 입문 강의에서 간단히 소개드리긴 했었지만 다시 한 번 설명드리자면, Stable 버전이란 앱 개발자가 지정한 특정 버전으로, 사용자들은 해당 버전 기준의 앱에만 접속이 가능하며, 최신 업데이트 사항은 개발자가 또다른 Stable 버전을 갱신하기 전까지는 볼 수 없게 하는 기능입니다.

쉽게 말하면 이는 앱시트를 위한 배포 관리 기능 중 하나라고 보면 될 것 같습니다. 만약 다른 사용자들이 함께 앱을 사용하며, 앱에 대한 업데이트가 있을 예정이라면 Stable 버전은 꼭 지정해 두시는 것이 좋습니다. 이를 지정하지 않은 채 앱을 변경하다 보면 그 과정에서 사용자들이 에러 메세지를 보거나 앱을 사용하지 못하게 될 수도 있으니까요.

Stable 버전은 Manage > Versions > Stable Version 메뉴에서 'Make the current version the new stable version'이라는 버튼을 눌러 지정할 수 있습니다.

 

 

● 기존 앱 vs 앱시트 앱 유지보수 단계 비교

기존 앱 개발의 경우 유지보수 작업이 쉬운 편은 아니었습니다. 기존 앱 유지보수의 단계는 아래와 같습니다.

  1. 유지보수에 대한 요구사항을 정리하여 개발자에게 넘겨줍니다
  2. 개발자가 요구사항에 맞게 앱을 수정합니다
  3. 고객은 수정된 앱을 보고 다시 피드백을 제출합니다
  4. 고객의 마음에 들 때까지 2~3번 과정 반복
  5. 최종 앱의 버전에서 문제가 없는지 테스트를 진행합니다
  6. 앱을 다시 배포합니다

앱시트를 사용하면 이런 앱의 유지보수 작업을 최대한 간소화할 수 있습니다. 이미 배포된 Stable 버전의 앱이 있다는 가정 하에, 앱시트 앱은 다음과 같은 단계로 업데이트할 수 있습니다.

  1. 앱시트 편집기에서 현업 개발자가 직접 요구사항에 맞게 앱을 편집합니다.
  2. 편집이 완료된 후 앱에 문제가 없는지 테스트를 진행합니다
  3. 테스트 이후 앱의 Stable 버전을 갱신합니다.

이렇듯 앱시트를 사용하면 많은 커뮤니케이션 및 문서화 작업과 배포 작업이 생략되어 최대의 효율로 앱 유지보수가 가능하게 됩니다.

 

 

● 모니터링

앱을 유지보수하기 위해서는 사용자들이 정확히 어떤 작업을 통해 어떤 결과를 얻어냈는지 알 수 있어야 합니다. 앱의 관리자 및 개발자들은 모니터링 기능을 통해 사용자들이 어떤 작업을 했고, 어떤 결과값을 얻어냈는지 직접 확인할 수 있습니다. 모니터링은 앱 내부에서 수행되는 상호 작용에 대한 가시성과 투명성을 제공하여 앱에 대한 깊은 이해를 가능하게 한다는 면과, 애플리케이션에 발생하는 모든 오류를 해결하는 방법과 기능을 제공하고 있다는 점에서 아주 중요합니다. 앱시트의 모니터링은 아래와 같이 4가지로 분류할 수 있습니다.

    1. Automation 모니터링

→ Automation 작업에 대한 모니터링입니다. 봇에 대한 통계와 각 실행 작업에 대한 결과값 등을 한눈에 확인할 수 있습니다.

    2. 사용량 통계 모니터링

→ 몇 명의 사용자가 앱을 사용했는지, 각 사용자별로 얼마나 앱을 사용했는지 확인할 수 있습니다.

    3. 성능 모니터링

→ 각 동기화 작업을 진행하는 데 걸린 시간, 앱 버전에 따른 계산량 등을 확인할 수 있습니다.

    4. 사용자 활동 모니터링

→ 사용자의 작업 내용 및 출력된 결과값을 알려줍니다. 에러가 발생한 경우 에러의 원인도 확인할 수 있습니다.

 

이러한 모니터링 로그 자료들은 에러의 원인을 분석하거나 사용자들의 사용 경향을 파악하는데 아주 큰 도움을 줍니다. 또한, 모니터링 기록은 일정 기간이 지나면(버전 별로 상이) 자동으로 삭제됩니다.

 

 

● 앱 유지보수 시나리오

구글이 공식 문서에서 소개한 앱 유지보수 시나리오를 알려드립니다. AppSheet Core 버전에서 사용할 수 있는 방법이며, 구글에서 공식적으로 소개한 만큼 가장 안정적이고 효율적인 방법이라고 보셔도 좋을 것 같습니다. 그 과정은 아래와 같습니다.

  1. 앱 복사를 통해 Test environment를 생성하여 업데이트 내용 작업
  2. Manage > Versions > App upgrade > Copy app upgrade from 에 앱 이름 입력

이렇게 하게 되면 따로 Stable 버전을 지정하지 않고도 Stable 버전을 지정한 것과 같은 효과를 볼 수가 있습니다. 평범한 업데이트의 경우 이 방법을 사용하는 것이 안정성과 간편함을 동시에 보장하게 됩니다. 다만 데이터 소스 구조가 변경된 경우 업데이트에 다운타임이 필요합니다. 만약 업데이트 도중 사용자가 앱을 사용할 경우 오류가 발생할 수 있습니다. 데이터 소스 업데이트 방법은 데이터 > 각 변경된 테이블 > Storage > Source Path 에서 변경된 테이블을 지정해주면 됩니다.

지금까지 앱시트 앱을 유지보수하는 방법에 대해 알아보았습니다. 앱시트 앱 개발자 입장에서 꼭 한 번은 짚고 넘어가야 할 문제라서 다루어 보았는데요. 이론 위주의 내용이라 재미는 없으셨겠지만 이번 글을 통해 앱 유지보수에 어려움이 없는 진정한 중급 개발자로 거듭나시기를 바라겠습니다. 다음 시간에는 조금 더 재미있는, 자주 쓰이는 Formula 작성 예시에 대해서 알아보도록 하겠습니다. 같이 열심히 공부해 보아요~

반응형
반응형

안녕하세요.

앱시트 입문 개발자 분들을 위해 앱시트 앱 개발 Key Points를 정리해 보았습니다.

이 글은 앱시트를 스프레드시트와 연동해서 사용하시는 분들, 아직 앱시트의 에러 및 Formula에 익숙하지 않으신 분들에게 도움이 될 것입니다.

목차는 아래와 같습니다.

  1. 외부 배포용 앱에 관하여
  2. 앱시트에서의 에러 및 트러블슈팅
  3. 앱시트 FORMULA 잘 쓰는 법과 활용 예시

 


외부 배포용 앱에 관하여

앱시트는 사내 비즈니스 로직을 자동화하는 것에 최적화 되어 있습니다. 따라서 앱시트로 외부 배포용 앱을 개발하기 위해서는 추가로 고려해야 할 사항이 있습니다.

현재 앱시트는 앱 별로 가격을 매기는 것이 아닌, 사용자 별로 가격을 매기는 라이선스 정책을 채택하고 있습니다. 이는 사용자 수를 예측하기 어려운 외부 배포용 앱에 적용하기 어려운 가격 정책입니다. AppSheet Enterprise 버전의 경우 로그인이 필요하지 않은 외부 사용자를 위한 라이선스를 보다 저렴한 가격에 따로 구매할 수 있지만, 그보다 낮은 버전의 경우 일반 사용자와 동일한 라이선스를 구매해야 합니다.

다만, 아래의 조건만 만족한다면 Publisher Pro(앱 당 월별 $50) 요금제를 사용하는 것도 고려해볼만 합니다.

  • 특정 인원에 대한 앱 액세스 제한이 필요하지 않습니다.
  • 앱이 기밀 데이터를 포함하지 않습니다.
  • 사용자에 따라 앱의 동작을 다르게 할 필요가 없습니다.
 

How to choose a subscription plan - AppSheet Help

The following sections describe what you can do with a free plan and how to choose a subscription plan when you are ready to deploy your apps for use by other users.  What can I do with a free plan? App development and testing is always free on AppSheet.

support.google.com


또한 앱의 사용자 및 데이터의 양이 너무 많은 경우가 있습니다. 외부 앱 배포 시 특히 이런 경우가 많이 발생할 수 있는데요. 앱에 연결된 테이블 수가 너무 많아지거나(30개 이상), 앱의 데이터(이미지나 문서 등 외부 파일 제외)가 5MB 또는 10MB를 초과하거나, 데이터가 쌓이다가 엑셀이나 스프레드시트가 허용하는 최대 셀 개수를 초과하는 경우 앱의 유지가 어려울 수 있습니다. 이런 경우 AppSheet Enterprise 요금제를 이용하여 외부 데이터 소스를 연결하거나 데이터 파티셔닝 등의 기능을 활용하는 것을 권장드립니다.

 

 

 앱시트에서의 에러 및 트러블슈팅

앱시트에서는 다양한 에러가 발생할 수 있습니다. 앱시트 앱에서 에러가 발생하는 경우 앱이 더이상 동작하지 않기 때문에 꼭 해결해 주어야 합니다. 에러가 발생하면 아래와 같은 경고 메세지가 표시되는데요, More info 를 눌러 에러 리스트에 등록된 관련 세부정보를 확인하거나, Go to the problem 을 눌러 어디에서 에러가 발생했는지 확인해볼 수 있습니다.

에러 메세지 표시 예시

 

AppSheet : mobile apps from spreadsheets : Errors and Warnings

ERROR WORKFLOW RULE ATTACHMENT INVALID PAGE DIMENSIONS unfold_more Meaning The attachment file has an invalid width or height. Likely Cause The attachment page Height or width is too small Resolution Steps Increase the page height or width, or use a non-cu

www.appsheet.com

 

하지만 이 정보만으로 에러를 해결하지 못하는 경우도 있습니다. 그런 경우 직접 문제의 원인을 찾아서 필요한 부분을 고쳐줘야 합니다. 저는 아래와 같은 단계로 에러를 해결합니다.

  1. 에러 메세지를 참고하여 에러가 발생한 위치로 이동합니다.
  2. 발생한 에러가 어떤 테이블에 대한 에러인지 확인합니다.
  3. 해당 테이블에 대한 변경 사항 로그를 확인하여 에러의 원인을 찾아냅니다.
  4. 에러의 원인이 된 부분을 수정합니다(주로 데이터 연결이 잘못된 경우가 많습니다).
  5. 필요한 경우 이전 버전으로 앱을 롤백합니다.

 

이렇게 해도 원인을 찾아내지 못한 경우 AppSheet Community 에 영어로 질문을 올리거나 앱시트 고객센터에서 관련 문서들을 찾아보아야 합니다. 그래도 원인을 알 수 없다면 SBC Technology 와 같은 앱시트 파트너사에 문의하는 방법도 있습니다. 다만 이 방법은 Google Workspace 혹은 AppSheet를 SBC Technology를 통해 사용하고 있을 때만 가능하다고 합니다.

 

AppSheet

Find answers, ask questions, and connect with other creators.

www.googlecloudcommunity.com

 

 

AppSheet Help

 

support.google.com

 

 

● 앱시트 FORMULA 잘 쓰는 법과 활용 예시

FORMULA 를 잘 사용하기 위해서는 결국 각 함수의 기능과 사용법을 잘 알고 있어야 합니다. 다행히 앱시트 고객센터에는 각 함수의 기능과 사용법이 친절한 예시와 함께 설명되어 있습니다. 특히 AND, OR, NOT, IF, TEXT, NOW, UNIQUEID, USEREMAIL, USERROLE 등의 기본 함수들과, ISBLANK, LINKTOVIEW, CONCATENATE, REF_ROWS, COUNT, SELECT 등 자주 쓰이는 함수들에 대해서는 미리 알아두는 것이 좋습니다.

아래는 다양한 활용 예시입니다.

  1. 화면에 표시되는 문자열 형식 변경

CONCATENATE([고객명], ” 님”) 또는 [고객명]&” 님”


→ 설명: 고객명 뒤에 “님” 이라는 글자를 붙여 앱에 표시하고 싶을 때 사용.

→ 결과 예시: “앱시트 님”

TEXT(NOW(), “YYMMDD”)


→ 설명: 날짜 및 시간에 대한 특정 형식 부여.

→ 결과 예시: “221005”

  2. 다른 테이블의 값 가져오기

SELECT(영어[알파벳], TRUE)


→ 설명: 영어 테이블의 알파벳 컬럼 중 조건이 TRUE인 값들만 선택

→ 결과 예시: LIST(“a”, “b”, …, “z”)

SELECT(영어[알파벳], [_RowNumber] < 4)


→ 설명: 영어 테이블의 알파벳 컬럼 중 행 번호가 4 미만인 값들만 선택(행 번호는 2부터 시작)

→ 결과 예시: LIST(“a”, “b”)

  3. 기타

OR(USERROLE() = “ADMIN”, [관리자] = USEREMAIL())


→ 설명: Security filter 등에서 사용자가 관리자 Role을 갖고 있거나, 관리자 컬럼에 기록된 경우 Yes 를 반환하여 해당 테이블에 대한 권한을 부여하도록 설정

→ 결과 예시: Yes

COUNT(REF_ROWS(“할일”, “담당자”))


→ 설명: 차트 뷰 등에서 할 일 테이블에서 담당자 별로 관련 데이터가 몇 개 있는지 확인

→ 결과 예시: 2

그 외에도 이러한 함수들을 응용하여 정말 많은 기능을 구현할 수 있습니다. 더 많은 함수들을 조합한 복잡한 형태의 예시도 있지만, 설명이 너무 길어질 것 같아 생략하였습니다.

여기까지 앱시트 입문 개발자 분들을 위한 앱시트 앱 개발 Key Points였습니다.

앱시트 입문 가이드는 이정도로 내용을 마무리하려고 합니다. 다음 글부터는 앱시트 중급 개발자가 알아야 할 내용을 가지고 돌아오도록 하겠습니다. 중급 가이드에서는 이번 시간과 같이 앱 개발 Key Points, 그 중에서도 추가적인 FORMULA 예시 등의 주제를 위주로 다루어볼 생각입니다. 고생 많으셨습니다! 같이 열심히 공부해 보아요~

반응형
반응형

안녕하세요.

앱을 다 만들었으니 이제 앱을 다른 사용자들에게 공유하고, 테스트를 거쳐 원하는 사용자들에게 배포할 차례입니다. 앱시트를 사용하면 생각보다 쉽게 이런 과정들을 진행할 수 있습니다. 이전 글들은 아래에 링크를 넣어두도록 하겠습니다.

 

[앱시트 입문] 02. 앱 만들어보기 - (1) 앱 생성

안녕하세요. 이번에는 한 번 직접 앱을 만들어 보면서 앱을 만드는 과정과 완성된 앱의 모습을 확인해 보도록 하겠습니다. 글을 몇 개만 읽으면서 따라해 보시면 앱시트로 앱을 만드는 기본적인

appsheet.tistory.com

 

[앱시트 입문] 03. 앱 만들어보기 - (2) 데이터 작업

안녕하세요. 저번 글에 이어서 커뮤니티 앱을 계속 만들어 보겠습니다. 만들어진 템플릿 앱의 데이터를 변형해서 유머, 자유, 베스트, 정보, 나눔 의 각 게시글 데이터가 구분되어 표시되도록 설

appsheet.tistory.com

 

[앱시트 입문] 04. 앱 만들어보기 - (3) 댓글과 좋아요 기능

안녕하세요. 저번 글에 이어서 커뮤니티 앱을 계속 만들어 보겠습니다. 저번 시간까지는 템플릿 앱을 만들고, 만들어진 템플릿 앱의 데이터를 변형해서 유머, 자유, 베스트, 정보, 나눔의 각 게

appsheet.tistory.com

 

[앱시트 입문] 05. 앱 만들어보기 - (4) 앱 꾸미기

안녕하세요. 계속해서 커뮤니티 앱을 만들어 보겠습니다. 지금까지는 앱을 만들고 필요한 기능을 추가하는 작업이었다면 이제부터는 앱을 꾸며주는 작업을 진행하게 될 텐데요, 시작하기 전에

appsheet.tistory.com

기존 앱개발 환경에서 앱을 공유, 테스트 및 배포하는 것은 꽤 어렵고 복잡한 작업입니다. 특히 보안 관련해서 확인해야 할 사항이 한두 개가 아닌데요, 앱시트에서는 따로 보안 검수를 하지 않아도 되고 다른 작업들도 훨씬 간소화돼서 빠른 앱 배포가 가능한 이점이 있습니다.

그럼 시작해볼까요?

 

 

● 앱 공유

앱시트 앱은 기본적으로 링크를 통해서 공유가 됩니다. 앱시트 편집기 우측 상단의 공유 버튼을 누르면 아래와 같은 창이 열립니다.

공유 버튼
앱을 공유할 수 있는 화면

보이는 회색 입력창에 이메일 주소나 도메인을 입력하면 추가가 가능합니다. 사용자는 아래와 같이 Use app(앱의 사용자), View definition(편집기 뷰어), Edit definition(편집자)의 세 권한 중 하나를 선택하여 부여가 가능합니다.

Advanced 라는 항목을 활성화 시키면 권한에 대한 세부 설정도 가능합니다. 이 설정에서는 사용자 권한 / 사용자 역할 / 앱 버전 을 지정하게 되는데요, 보통 사용자의 경우 Use app / User / Default로 설정하시면 되고, 앱 관리자는 Use app / Admin / Default로, 편집자의 경우 Edit definition / Admin / Latest 로 설정하시면 됩니다.

일반 사용자 권한
편집자 권한

간단히 부연설명 드리자면, App role은 사용자가 앱 내에서 가지는 권한을 의미하며 User와 Admin이 있습니다. 이 Role이라는 것은 개발자가 관련 Formula를 작성하기 전까지는 크게 의미가 없습니다. 하지만 특정 뷰에 접근할 수 있는 사용자를 제한하고 싶은 등 사용자 권한에 대한 설정이 필요한 경우, 개발자는 USERROLE()이라는 함수를 써서 권한 관련 Formula를 작성할 수 있습니다. 예를 들어 아래와 같이 댓글의 작성자를 볼 수 있는 사람을 Admin 역할을 가진 사람으로 제한할 수 있습니다.

(Data > Columns > 댓글 > 작성자 컬럼 좌측 연필 모양 > Show? 옆의 필터 모양 아이콘 클릭 > Formula 작성)

App version에는 Default, Latest, Stable 세 가지가 있습니다. Default 란 개발자가 Stable 버전을 따로 지정하지 않았을 경우 사용자들이 가장 최신(Latest) 버전의 앱을 열도록 하겠다는 의미입니다. 만약 Stable 버전이 지정되면 사용자들은 해당 버전 기준의 앱에만 접속이 가능하며, 최신 업데이트 사항은 개발자가 또다른 Stable 버전을 업데이트하기 전까지는 볼 수 없게 됩니다.

그 외에도 Copy sharing links 버튼을 눌러 앱의 접속 링크를 볼 수가 있습니다.

위와 같이 앱 편집을 위한 Editor Link, 앱 사용을 위한 Browser Link, 모바일 사용자를 위한 Install Link가 있습니다. 링크를 복사해서 카톡이나 문자로 전달해주면 됩니다.

기본적으로 앱시트는 추가된 사용자만 앱에 접근할 수 있고, 나머지 사용자들은 링크로 접속하려 해도 권한이 없다면서 차단됩니다. 그래서 앱시트 앱에 접속하기 위해서는 로그인이 필요하게 됩니다. 다만 Security 메뉴에서 Require user signin? 이라는 항목을 Disable하게 되면 로그인 없이 어떤 사용자라도 링크만 있으면 앱에 접속할 수 있게 됩니다. 대신 앱이 공개 상태라고 하더라도 Editor Link 에는 앱의 편집자로 추가된 사용자만 접근 가능합니다. 또, 공개 상태의 앱에서는 USEREMAIL(), USERROLE() 등의 사용자 관련 함수를 쓸 수 없게 됩니다.

 

 

● 앱 테스트

이제 앱을 공유했으니 다양한 방식으로 앱을 테스트해보면 됩니다. 모바일(안드로이드 및 iOS), 태블릿, 브라우저 등 각 환경에서 앱이 잘 동작하는지와 기능 및 성능 면에서의 이상은 없는지와 같은 부분을 확인해볼 수 있습니다.

참고로 아래와 같이 데스크탑 사용자용 UI를 사용하는 경우 다른 환경에서와 어떤 차이점이 있는지 꼭 미리 확인해 보셔야 합니다.

 

[UX] 데스크탑 사용자를 위한 새로운 UI

안녕하세요. 오늘은 정말 반가운 소식인, 앱시트 앱을 브라우저에서 사용하는 분들을 위한 위한 UI 업데이트 내용을 전달해 드리려고 합니다. 앱시트로 만든 앱들은 데스크탑보다는 모바일에 더

appsheet.tistory.com

모바일에서 테스트를 진행할 때는 두 가지 방식으로 앱에 접근할 수 있습니다. 첫번째는 모바일 브라우저 상에서 Browser Link를 통한 접근입니다. 이는 따로 설치 과정이 필요하지 않습니다. 두 번째는 Install Link를 통한 접근입니다. 모바일 상에서 Install Link에 접속할 경우 앱을 설치할 수 있습니다. 앱 설치를 위해서는 스토어에서 호스트 앱이라고도 하는 AppSheet 어플리케이션을 먼저 설치해야 하고, 이후 바탕화면에 바로가기를 추가하여 개발한 앱에 접근할 수 있습니다. 설치한 모든 앱들은 AppSheet 라는 앱을 통해 동기화 및 업데이트됩니다.

 

 

● 앱 배포

앱 배포를 하지 않아 앱이 프로토타입 상태에 있는 경우 모든 이메일, 메세지, 알림 등이 앱의 소유자에게만 전송됩니다. 이러한 기능을 제대로 사용하려면 꼭 배포를 진행해야 합니다.

앱 배포는 Manage > Deploy 메뉴에서 가능합니다. 배포에는 일반 배포와 화이트 라벨링이라는 두 가지 방식이 있습니다.

  1. 일반 배포

말 그대로 링크를 통해서 앱에 접속하는 일반적인 앱시트 앱의 배포 형태입니다. 특히 모바일에서 앱이 추가될 때 실제 앱이 아닌 바로가기 형태로 앱이 추가됩니다. 특별히 다른 작업을 할 필요 없이, Deployment check 및 Move app to deployed state 버튼을 눌러주기만 하면 앱 배포가 완료됩니다.

  2. 화이트 라벨링

화이트 라벨링은 앱을 스토어에 등록하여 사용자가 검색한 후 직접 다운로드 받을 수 있도록 배포하는 방법입니다. 스토어에 앱을 올리기 위한 다양한 인증 절차가 필요하지만, 사용자의 접근성을 조금 더 높일 수 있는 방법입니다. 앱을 화이트 라벨링한 경우 기본적으로는 업데이트가 자동으로 적용되지만, 업데이트 내용에 따라 재배포가 필요한 경우도 있습니다.

오늘은 앱을 공유, 테스트 및 배포하는 방법을 알아보았습니다. 이제 드디어 첫 번째 앱을 완성했군요! 앱을 만들었으면 유지 보수를 할 수 있어야 하겠지만, 그 주제는 중급 과정에서 더 심도있게 알아볼 예정입니다. 이제 여러 앱들을 직접 만들면서 경험을 쌓아 나가다 보면 금방 앱시트 중급 개발자가 되실 수 있을 겁니다. 다음 시간에는 앱시트 입문 개발자들이 알아야 할 키 포인트들을 소개해 드리겠습니다. 같이 열심히 공부해 봅시다~!!

반응형
반응형

안녕하세요.

계속해서 커뮤니티 앱을 만들어 보겠습니다. 지금까지는 앱을 만들고 필요한 기능을 추가하는 작업이었다면 이제부터는 앱을 꾸며주는 작업을 진행하게 될 텐데요, 시작하기 전에 이전 글들도 꼭꼭 확인해 주세요!

 

[앱시트 입문] 02. 앱 만들어보기 - (1) 앱 생성

안녕하세요. 이번에는 한 번 직접 앱을 만들어 보면서 앱을 만드는 과정과 완성된 앱의 모습을 확인해 보도록 하겠습니다. 글을 몇 개만 읽으면서 따라해 보시면 앱시트로 앱을 만드는 기본적인

appsheet.tistory.com

 

[앱시트 입문] 03. 앱 만들어보기 - (2) 데이터 자르기

안녕하세요. 저번 글에 이어서 커뮤니티 앱을 계속 만들어 보겠습니다. 만들어진 템플릿 앱의 데이터를 변형해서 유머, 자유, 베스트, 정보, 나눔 의 각 게시글 데이터가 구분되어 표시되도록 설

appsheet.tistory.com

 

[앱시트 입문] 04. 앱 만들어보기 - (3) 댓글과 좋아요

안녕하세요. 저번 글에 이어서 커뮤니티 앱을 계속 만들어 보겠습니다. 저번 시간까지는 템플릿 앱을 만들고, 만들어진 템플릿 앱의 데이터를 변형해서 유머, 자유, 베스트, 정보, 나눔의 각 게

appsheet.tistory.com

오늘은 각 화면(View)의 타입, 이름과 아이콘을 바꾸고, 버튼의 모양과 위치를 조정하고, 글씨체를 바꿔주도록 하겠습니다.

그럼 시작해 볼까요?

 

 

● 화면(View) 꾸미기

화면(View)은 UX 메뉴의 View 탭에서 꾸미기가 가능합니다. 먼저 화면을 하나 선택한 뒤, Display 메뉴를 열어 보면 아래와 같이 아이콘과 화면 이름(Display name)을 지정할 수 있습니다.

적절한 아이콘을 찾아서 선택해 주시면 됩니다. 저는 아래와 같이 메뉴 아이콘을 설정해 주었습니다.

메뉴가 훨씬 눈에 잘 들어오죠?

다음은 뷰 타입을 설정해 보겠습니다. 앱시트의 뷰 타입은 아래와 같습니다.

뷰 타입 설명 예시
Calendar 달력 형식으로 일별, 주별, 월별 일정 확인
Card 데이터 내용과 관련 액션을 묶어서 보여줌
Chart 히스토그램, 도넛 차트 등 데이터 시각화
Dashboard 한 화면에서 여러 뷰를 동시에 확인
(예시는 캘린더 뷰 + 차트 뷰)
Deck 행 데이터를 덱 형식으로 출력
Detail 한 행의 데이터를 상세하게 출력, 이전이나 다음 버튼을 눌러 다른 데이터 확인
Form 앱 사용자의 입력을 받음
Gallery 이미지 위주로 데이터 출력
Map 지도 상에 주소, XY, 좌표 데이터 표시
Onboarding 신규 사용자를 위한 소개 페이지
Table 행 데이터를 테이블 형식으로 출력

원하는 뷰 타입을 고른 후 View options 에서 데이터 표시 방식, 데이터의 정렬 순서 등을 지정해 주시면 됩니다. 저같은 경우 게시판을 보기 위해 Card 뷰를 선택하였습니다.

Card 뷰는 이미지와 같이 Layout이라는 항목이 있는데요, 이 메뉴를 통해 화면에 데이터가 어떻게 표시될지 정할 수 있습니다. 예를 들어 저는 이미지를 넣지 않았기 때문에 이미지를 클릭한 뒤, Column to show 를 None으로 선택해 주었고, Title 란에는 작성자 데이터를 넣어 주었습니다. 설정이 끝난 결과입니다.

여기서 좋아요 수를 표시해 주기 위해 표시를 위한 가상 열을 추가해 주었습니다.

여기서는 CONCATENATE()라는 함수를 사용하여 "좋아요 수: " 라는 텍스트와, 좋아요 갯수를 합쳐서 표시해 주었습니다.

CONCATENATE(): 순서에 따라 입력된 값을 합친 새로운 텍스트를 반환합니다.
  예 - CONCATENATE("Good morning, ", [First Name], "!")
    => 결과: Good morning, Martin!

베스트 게시판에도 CONCATENATE() 함수를 활용하여 '유형 표시' 라는 가상 열을 추가 후 카드에 표시해 주었습니다.

이제 Detail 화면과 Form 화면을 수정해 보겠습니다. 앱시트에서 화면(View)를 하나 생성하면, 시스템에서 자동으로 해당 화면의 데이터를 클릭했을 때 그에 대한 세부 항목을 보여주는 Detail 화면과 새 데이터를 추가하기 위한 Form 화면을 추가해 줍니다. 이런 시스템 뷰는 UX > Views 의 Show system views 버튼을 눌러 확인 가능합니다.

현재 앱의 Detail 페이지는 PID, 좋아요 등 표시할 필요 없는 항목까지 표시해주고 있기 때문에 이를 표시하지 않도록 수정해 주도록 하겠습니다. 방법은 Column order라는 항목에 표시하기 원하는 정보를 순서대로 추가해주면 됩니다.

Display 메뉴를 열어 앱에 표시할 이름도 적절히 변경해 줍니다.

똑같은 방법으로 다른 Detail 및 Form 화면에 대한 Column order 및 표시할 이름도 지정해 줍니다. 완성된 모습은 이와 같습니다.

앱이 드디어 모양새를 갖춰나가고 있네요.

 

 

● 버튼 꾸미기

댓글 작성과 좋아요 버튼의 아이콘을 바꿔 줍니다. Behavior 메뉴의 Actions 탭에서 버튼을 선택한 후 Appearance 메뉴를 열어 원하는 아이콘을 선택해 줍니다.

또, Prominence 메뉴도 원하는 디자인으로 바꿔 줍니다. Display overlay는 우측 하단에 버튼이 고정되는 방식이고, Display prominently는 페이지 상단에 버튼이 고정되며, Display inline은 특정 데이터 컬럼 옆에 버튼이 고정됩니다. 원하는 방식으로 적절히 수정해 주시면 됩니다.

같은 메뉴에서 Show all 버튼을 눌러 시스템 버튼에 대한 설정도 가능합니다.

설정을 마친 화면입니다. 좀더 보기 좋아졌군요.

 

 

● 글씨 꾸미기

마지막으로 글씨체, 글씨 크기와 색깔을 조금 바꿔주겠습니다. 이는 UX 메뉴의 Format Rules 탭에서 설정 가능합니다. 우선 좋아요 수가 눈에 잘 띄지 않아 해당 부분을 먼저 수정해 보겠습니다. New Format Rule 버튼을 눌러 새로운 서식을 생성합니다.

필요하다면 서식을 적용할 조건을 걸어줄 수 있습니다. 예를 들면 좋아요가 10개가 넘는 경우에는 색을 다르게 한다던가 하는 방식으로요. 저는 따로 조건을 넣어주지는 않았습니다. 저는 '좋아요 표시'를 선택하고 서식을 적용해 주었습니다.

위와 같이 텍스트와 함께 표시할 아이콘, 색깔, 크기 및 포맷을 지정해 주었습니다. 변경 결과는 아래와 같습니다.

이런 식으로 앱에 표시되는 글씨를 꾸며줄 수 있습니다. 원하는대로 앱을 꾸며주시면 됩니다.

오늘은 이렇게 앱을 예쁘게 꾸며 보았습니다. 설정 전과 후를 비교하면 엄청난 차이가 있는 것을 보실 수 있을 거예요. 이제 진짜로 앱을 사용할 때가 된 것 같습니다. 다음 시간에는 앱을 공유, 테스트 및 배포하는 방법을 알아보도록 하겠습니다. 같이 열심히 공부해 보았으면 좋겠습니다~

반응형
반응형

안녕하세요.

저번 글에 이어서 커뮤니티 앱을 계속 만들어 보겠습니다. 저번 시간까지는 템플릿 앱을 만들고, 만들어진 템플릿 앱의 데이터를 변형해서 유머, 자유, 베스트, 정보, 나눔의 각 게시글 데이터가 구분되어 표시되도록 설정해 보았습니다.

혹시 저번 글을 못보신 분들이 있다면 아래 링크에서 먼저 내용을 확인해 주세요!

 

[앱시트 입문] 02. 앱 만들어보기 - (1) 앱 생성

안녕하세요. 이번에는 한 번 직접 앱을 만들어 보면서 앱을 만드는 과정과 완성된 앱의 모습을 확인해 보도록 하겠습니다. 글을 몇 개만 읽으면서 따라해 보시면 앱시트로 앱을 만드는 기본적인

appsheet.tistory.com

 

[앱시트 입문] 03. 앱 만들어보기 - (2) 데이터 자르기

안녕하세요. 저번 글에 이어서 커뮤니티 앱을 계속 만들어 보겠습니다. 만들어진 템플릿 앱의 데이터를 변형해서 유머, 자유, 베스트, 정보, 나눔 의 각 게시글 데이터가 구분되어 표시되도록 설

appsheet.tistory.com

오늘은 댓글과 좋아요 기능을 구현해 보도록 하겠습니다. 또, 베스트 게시판에서 좋아요 갯수가 많은 순서대로 표시하도록 수정해 볼게요.

그럼 시작해볼까요?

 

 

● 댓글 구현하기

사실 저희는 이미 데이터를 다 준비해놓은 상황이기 때문에 설정만 잘 해주면 댓글 구현은 끝납니다. 먼저 댓글을 달 수 있게 댓글 달기 버튼을 추가해 주겠습니다.

버튼 추가는 Behavior 메뉴에서 가능한데요, New Action 버튼을 눌러 아래와 같이 새로운 버튼을 추가해 주었습니다.

저는 이 버튼을 눌렀을 때 해당 게시물에 대한 댓글을 작성할 수 있도록 하고 싶은데요, 그래서 Do this 항목에는 App:go to another view within this app 을 선택한 후, Target을 LINKTOFORM("댓글_Form", "PID", [PID]) 로 설정했습니다.

여기서 Target 란에 들어간 부분을 수식(formula)이라고 부르는데요, LINKTOFORM이라는 함수는 다음과 같이 설명이 돼 있습니다.

LINKTOFORM: 한 개 이상의 값을 미리 지정한 상태로 앱에 있는 특정 폼 화면으로 이동합니다.
  예 - LINKTOFORM("Some Form View", "Date", TODAY(), "Color", [_THISROW].[Color])
       => Date 값은 TODAY(), Color 값은 [_THISROW].[Color] 가 입력된 "Some Form View"라는 화면을 실행시킨다

이런 수식(formula) 작성 방법의 경우 별도 글에서 제대로 정리해 드릴 예정입니다. 지금은 일단 따라해보고, 어떤 결과가 나오는지 확인해 보면 좋을 것 같습니다. 적용된 화면은 이렇게 보입니다.

이처럼 '댓글 작성'이라는 버튼이 각 게시물에 표시가 됩니다. 버튼을 누르면, 아래처럼 PID가 1이라는 값으로 채워진 댓글 Form 화면이 보입니다.

내용을 입력하여 댓글을 입력해 보겠습니다. 저장 버튼을 누르면 댓글 등록이 완료되지만 아직 게시글 화면에는 댓글이 표시되지 않고 있네요.

댓글을 표시해주기 위해 Data 메뉴의 Columns 에서 게시글 테이블에 대한 가상 열(Virtual column)을 추가해 주도록 하겠습니다. 등록된 해당 열을 통해 댓글을 불러오면 됩니다.

Add Virtual Column 버튼을 누르면 가상 열이 추가됩니다.

여기에서는 수식(formula)으로 REF_ROWS("댓글", "PID")를 넣어 주었는데요, 댓글 테이블의 행 중 PID가 같은 행들만 리스트로 가져오라는 의미입니다.

REF_ROWS(): 특정 테이블이나 데이터 슬라이스에서 지정한 참조값과 일치하는 행들을 가져옵니다.
  예 - REF_ROWS("Order Details", "Order ID")
      => Order Details 테이블에서 Order ID 가 일치하는 행들을 가져옵니다.

이렇게 댓글을 추가해 주면 게시글 디테일 화면(게시글을 눌렀을 때 나오는 화면)에 댓글이 아래와 같이 표시됩니다.

 

 

● 좋아요 구현하기

좋아요도 댓글과 유사하게 Behavior 메뉴에서 좋아요 라는 버튼을 만들어주도록 하겠습니다.

저는 Data: add a new row to another table using values from this row 를 선택해 주었습니다. 현재 테이블인 게시글 테이블의 값을 이용해서 좋아요 테이블에 새로운 행을 추가하겠다는 의미입니다. [PID], USEREMAIL(), NOW(), 1 과 같이 필요한 값을 입력해준 뒤 저장 버튼을 눌렀습니다.

이처럼 좋아요 버튼이 생겼는데요, 해당 게시글에 대한 좋아요가 몇개인지 확인하기 위해서 새로운 가상 열(Virtual Column)을 추가해 주도록 하겠습니다.

여기서 똑같이 REF_ROWS() 함수를 사용했습니다. 그리고 지금 필요한 것은 좋아요 리스트가 아닌, 좋아요의 갯수이기 때문에 COUNT() 함수를 활용하여 리스트의 갯수만 가져오도록 하겠습니다.

이후 앱을 동기화해주면 아래와 같이 좋아요의 갯수가 표시됩니다.

 

 

● 좋아요가 많은 게시글부터 표시

좋아요를 만들어 주었으니 베스트 게시판을 수정해 보겠습니다. 모든 게시글 중 좋아요가 많은 게시글부터 표시하도록 설정해 보겠습니다. 방법은 생각보다 간단합니다. 먼저 UX 메뉴의 Views 탭으로 간 후, 베스트 를 클릭하여 화면 설정을 열어줍니다. 이후 Sort by, Group by 및 Group aggregate 메뉴를 통해 사용자에게 보여줄 데이터의 순서 및 형식을 조절할 수 있습니다.

이렇게 설정하고 테스트를 위해 정보 게시글에 좋아요를 3개 누르고, 유머 게시글에 좋아요를 2개 누른 후 앱을 동기화해 주었습니다(다른 게시글은 0개). 그랬더니 아래와 같이 화면이 표시되었습니다.

원하는대로 잘 정렬된 것을 확인할 수 있습니다.

오늘은 댓글과 좋아요 기능, 베스트 게시판 정렬을 해보았습니다. 여러 가지 수식이 지금은 낯설게 느껴지시겠지만 공부하고 앱을 만들다 보면 점점 익숙해 지실 거예요! 앱이 지금은 별로 예쁘거나 실용성이 있는 것 같지는 않아서, 다음 시간에는 앱을 좀더 꾸며주도록 하겠습니다. 앱을 잘 꾸미면 사용자 입장에서도 원하는 메뉴를 쉽게 찾아서 볼 수가 있고, 보기에도 예뻐서 더 좋은 앱으로 바뀐답니다. 같이 열심히 공부해 보아요~

반응형
반응형

안녕하세요.

저번 글에 이어서 커뮤니티 앱을 계속 만들어 보겠습니다. 만들어진 템플릿 앱의 데이터를 변형해서 유머, 자유, 베스트, 정보, 나눔 의 각 게시글 데이터가 구분되어 표시되도록 설정해 보는 것이 오늘의 목표입니다.

혹시 저번 글을 못보신 분들이 있다면 아래 링크에서 먼저 내용을 확인해 주세요!

 

[앱시트 입문] 02. 앱 만들어보기 - (1) 앱 생성

안녕하세요. 이번에는 한 번 직접 앱을 만들어 보면서 앱을 만드는 과정과 완성된 앱의 모습을 확인해 보도록 하겠습니다. 글을 몇 개만 읽으면서 따라해 보시면 앱시트로 앱을 만드는 기본적인

appsheet.tistory.com

오늘은 한글화(Localization), 데이터 정리, 데이터 구조 변경(Regenerate Structure), 데이터 자르기(Slice), 화면(View) 만들기 작업을 진행해볼 예정인데요, 누구라도 이해할 수 있도록 자세히 설명해 보도록 하겠습니다.

그럼 시작해볼까요?

 

 

● 기본 설정

앱에 대한 모든 변경 사항은 자동으로 저장되지 않고, 우측 상단의 SAVE 버튼을 눌러야 합니다.

SAVE 버튼을 누를 때마다 앱에 오류가 있지는 않은지 자동으로 검증이 진행되며, 성공적으로 저장 시 앱의 새로운 버전이 생성되게 됩니다. 예를 들어 1.0001 버전에서 저장 시 1.0002 버전이 새로 생기게 되며, 데이터가 남아있는 동안에는 버전 백업이 가능합니다.

1. 앱 이름 변경

왼쪽 상단의 앱 이름을 클릭하여 앱 이름을 변경할 수 있습니다. 저는 커뮤니티 앱이라고 이름을 지었습니다.

2. 로고 및 기본 색상 변경

UX 메뉴의 Brand 탭에서 기본 색상(Primary color)을 빨간 색으로 변경해 주고, 앱 로고 아이콘을 바꿔 주었습니다. 저는 앱시트에서 기본 제공하는 모양으로 바꿨지만, 커스텀 이미지를 업로드하여 사용할 수도 있습니다.

3. 한글화(Localize)

UX 메뉴의 Localize 탭에서 시스템 안내 문구를 커스터마이징 해주었습니다. "Yes : 예", "No : 아니오" 처럼 적당히 원하는 문구를 넣어 주시면 됩니다.

 

 

● 데이터 정리

이제 데이터를 깔끔하게 정리해 보겠습니다. 일단 스프레드 시트의 이름을 '커뮤니티 앱 데이터'로 변경해 주겠습니다. 그 다음으로는 각 시트 이름을 바꿔준 다음 데이터에서 첫번째 행 빼고 다 지워주시면 됩니다. 첫번째 행도 열 이름을 한글로 착착 바꿔볼게요. 저는 아래와 같이 이름을 변경해 주었습니다.

시트 이름 열 이름
게시글 PID, 내용, 링크, 첨부파일, 작성자, 날짜 / 시간, 유형
댓글 CID, PID, 내용, 링크, 첨부파일, 작성자, 날짜 / 시간
좋아요 LID, PID, CID, 좋아요 누른 사람, 날짜 / 시간, 카운트

여기서 게시글 시트에 '유형'이라는 열을 추가해 주었는데요, 이에 대해서는 나중에 설명하겠습니다.

어쨌든 이렇게 앱 개발자가 알아보기 쉬워야 개발도 편하고 사용자들도 쉽게 쓸 수 있습니다. 정리는 언제나 번거롭지만, 언제나 시간을 아껴줍니다.

원본 데이터 이름을 변경했기 때문에 앱시트는 이를 아예 다른 테이블로 인식합니다. 기존의 테이블을 모두 삭제하고 새로운 테이블을 넣어주겠습니다.

추가가 완료된 모습입니다. 앗, 그런데 저 빨간 점들은 뭐죠? 네 맞습니다. 에러입니다. Info에서 목록을 보니 무려 11개의 에러와 5개의 경고 문구가 표시되었는데요, 이미 있었던 데이터를 기준으로 작성된 앱인데 그 데이터를 지우고 새로운 데이터를 추가했으니 에러가 나올 수밖에 없죠. 이럴 때는 에러와 경고가 표시된 항목들을 다 지워주면 됩니다.

항목을 삭제하기 위해서는 Delete 버튼을 누르면 됩니다. Data 메뉴의 Slice 탭, UX 메뉴의 Views와 Format Rules 탭, Behavior 메뉴의 에러가 표시되는 모든 항목들을 다 지워주겠습니다. 그러고 나면 아래와 같이 깔끔한 앱이 완성되죠.

이제야 드디어 제대로 앱을 수정할 준비가 되었네요.

 

 

● 데이터 구성

단언컨데, 앱시트에서 가장 중요한 것은 데이터입니다. 데이터가 어떻게 구성되고 어떤 항목을 포함하는지에 따라 만들어지는 앱이 달라집니다. 저번 글에서 이미 앱시트 데이터가 관계형 데이터베이스라는 것을 언급했었는데요, 정리된 아래의 표를 보시면 댓글 테이블은 게시글 테이블을, 좋아요 테이블은 게시글 테이블과 댓글 테이블을 참조하는 것을 볼 수 있습니다.

시트 이름 열 이름
게시글 PID, 내용, 링크, 첨부파일, 작성자, 날짜 / 시간, 유형
댓글 CID, PID, 내용, 링크, 첨부파일, 작성자, 날짜 / 시간
좋아요 LID, PID, CID, 좋아요 누른 사람, 날짜 / 시간, 카운트

이제 Data 메뉴의 Columns 탭에서 각 열의 세부정보를 설정해줄 건데요, 이 때 3가지 중요한 요소가 있습니다.

1. 데이터 타입(Type)

  : 데이터의 유형. (텍스트, 숫자, Enum 등)

2. 키(Key)

  : 각 데이터를 구분하기 위한 고유값

3. 초기값(Initial value)

  : 해당 열에 데이터가 추가됐을 때의 초기값을 지정합니다.

각 열의 용도에 맞게 아래와 같이 설정해 주었습니다.

시트 이름 열 이름
게시글 PID(Text)[UniqueID()], 내용(LongText), 링크(Url), 첨부파일(File), 작성자(Email)[UserEmail()], 날짜 / 시간(DateTime)[Now()]유형(Enum)
댓글 CID(Text)[UniqueID()], PID(Text), 내용(LongText), 링크(Url), 첨부파일(File), 작성자(Email)[UserEmail()], 날짜 / 시간(DateTime)[Now()]
좋아요 LID(Text)[UniqueID()], PID(Text), CID(Text), 좋아요 누른 사람(Email)[UserEmail()], 날짜 / 시간(DateTime)[Now()], 카운트(Number)

, (타입),[초기값]

보기가 꽤 복잡한데요, 참고용으로만 쓰셨으면 좋겠습니다. 키는 해당 데이터의 ID 열로 지정해 주시는 것이 가장 편합니다. 타입같은 경우에는 상식적으로 작성해 주시면 됩니다. 초기값은 작성 시에는 아래와 같이 수식 작성을 위한 창이 나오는데요, 입력칸에 파란 괄호 안에 있는 값을 그대로 복사 붙여넣기 해주시면 됩니다.

유형의 경우 데이터 타입이 Enum으로 지정되었습니다. Enum은 정해진 목록을 만들어 사용자가 해당 목록 중 하나를 고르게 하고 싶을 때 쓰기 좋은 타입입니다. 왼쪽의 수정 버튼을 눌러 목록 작성이 가능합니다. 저같은 경우 아래와 같이 유머, 자유, 정보, 나눔 의 4개의 게시판 유형 목록을 작성했습니다. 베스트 게시판은 모든 게시판에서 좋아요 수가 많은 글만 가져오기 위한 게시판이라서 따로 목록에 추가하지는 않았습니다.

이제 데이터 구성이 완료되었습니다. 다음으로는 데이터 자르기(Slice)를 통해 각 화면(View)에 표시될 데이터를 구분해 보겠습니다.

 

 

● 데이터 자르기(Slice)

Data 메뉴의 Slice 탭에 가면 New Slice 버튼을 눌러 데이터를 자를 수 있습니다. 저는 아래와 같이 먼저 유머 게시글만을 보기 위한 "유머"라는 이름의 데이터 슬라이스를 생성해 주었습니다.

여기서 데이터를 어떻게 자를지는 Row filter condition 에서 정의할 수 있는데요, 저는 게시글 시트의 데이터 중 [유형] 열이 "유머"인 게시글만 가져올 수 있도록 [유형] = "유머" 라는 수식(formula)을 작성해 주었습니다. Copy 버튼을 눌러 동일한 방식으로 "자유", "정보", "나눔" 데이터 슬라이스를 추가해 주었습니다.

모든 작업이 끝나면 저장 버튼을 꼭 눌러주세요!

 

 

● 화면(View) 만들기

마지막으로 UX 메뉴에서 각 게시글에 대한 화면(View)을 추가해 주도록 하겠습니다. New View 버튼을 눌러 이름 및 데이터, View type을 아래와 같이 지정해 줍니다.

마찬가지 방법으로 자유, 유머, 정보에 대한 화면(View)를 추가해 줍니다. 또, 마지막으로 전체 게시글 시트로 "베스트"라는 이름의 화면(View)를 추가해 줍니다.

이후 Position 이라는 항목을 조정하여 각 화면(View)의 위치를 설정해주면 끝입니다. 데이터가 제대로 나눠지는지 확인하기 위해 원본 데이터 '게시글' 시트에 아래와 같이 항목을 추가해 주었습니다.

PID 내용 링크 첨부파일 작성자 날짜 / 시간 유형
1 유머     korea.appsheet@gmail.com 8/11/2022 17:37:00 유머
2 자유     korea.appsheet@gmail.com 8/12/2022 17:37:00 자유
3 정보     korea.appsheet@gmail.com 8/13/2022 17:37:00 정보
4 나눔     korea.appsheet@gmail.com 8/14/2022 17:37:00 나눔

그럼 지금까지 완성된 앱의 모습을 보시죠!

보면 아시겠지만 디테일 화면 등 내가 만들지 않은 화면도 시스템이 알아서 생성해 줍니다. 개발하는 입장에서 공수를 줄여주는 아주 큰 장점 중에 하나입니다.

오늘은 만들어진 템플릿 앱의 데이터를 변형해서 유머, 자유, 베스트, 정보, 나눔 의 각 게시글 데이터가 구분되어 표시되도록 설정해 보았습니다. 한글화(Localization), 데이터 정리, 데이터 구조 변경(Regenerate Structure), 데이터 자르기(Slice), 화면(View) 만들기 작업을 진행해 보았는데요. 너무 어렵진 않았을까 걱정이네요. 댓글로 의견 주시면 반영해 보도록 하겠습니다! 다음 시간에는 댓글과 좋아요 기능을 구현해 보고 베스트 게시판을 정비하도록 하겠습니다. 같이 열심히 공부해 보아요~

반응형

+ Recent posts