The AppSheet Community recently came together for our first App Jam - a guided session taking you step-by-step through building an app in the AppSheet platform.
In this post, we share the recording and the steps listed out for you to follow along. By following these steps, you will:
- Build an intermediate-level app
- Gain experience with many fundamental skills used in the AppSheet platform
- Gain the knowledge needed to create a wide range of useful apps to enhance your business
If you have any questions, please add a comment below and someone from the Community will get back to you. Okay, letâs get started!
Video demonstration and app template
As you take the steps below, follow along in a live walkthrough demonstration led by the AppSheet team. Each section below includes a link for you to jump to that particular section in the video.
In addition, here is the app template created during the session, which you can copy and customize.
Data
Follow along here in the video demonstration.
Generate a default app and make some small updates to set some initial values, as well as adding a relationship between Requests and Users. A final step is to create a Slice to query filtered data.
- Click on this sheet to make a copy.
Generate an App
- In the Google Sheet, generate a default app from the sheet by clicking from the menu: âExtensions â AppSheet â Create an appâ.
Alternatively, in AppSheet you can click âMake a new app â Start with your own data â Choose your data â google â <Your spreadsheet from step #1>â.
Customize the âRequestsâ table
Follow along here in the video demonstration.
-
Click the âDataâ tab on the left and then click the âRequestsâ table.
-
Click âView Columnsâ, and update the following column values:
a. ID - Unclick Show?
b. User - Set 'Initial valueâ â USEREMAIL().
(Hint: scroll the column properties to the right to access âInitial Valueâ)
c. Status - Click âEditâ (pencil icon) to show the Enum values [Review required, Approved, Rejected].
Note: These were automatically generated from the Sheets data validation in the column. Click âDoneâ to close the dialog.
d. Status - Set âInitial Valueâ â âReview requiredâ.
e. Approver - Set âInitial Valueâ to â USEREMAIL().
- Click SAVE. (Ignore the warnings)
Add a new table, âUsersâ
Follow along here in the video demonstration.
- Click âTablesâ at the top and then click âAdd Table âUsers"'.
Add a table Reference
-
Edit the âRequestsâ table columns again, change the User columnâs TYPE from Email to Ref and select the âUsersâ table as the source table.
-
Click Done and click SAVE.
-
Click to edit âUsersâ table columns and see that âRelated Requestsâ column has been added.
Create a new Slice
Follow along here in the video demonstration.
-
Click âSlicesâ at the top and click âNew Sliceâ.
-
Name the slice Review required.
a. Set:
i. Source Table: âRequestsâ
ii. Row filter condition: â= [Status] = âReview requiredââ
- Click SAVE.
UX
Follow along here in the video demonstration.
Update the Requests view and create a new view for âUsersâ. Add some further UI updates to branding, and formatting.
A final step is to add a view that queries from the new Slice created in the Data section.
Update the Requests view
-
Click the âUXâ tab on the left.
-
Click to edit the âRequestsâ view.
a. Change viewtype to â âCardâ.
- Click SAVE.
Create a âUsersâ view
- Create a new View named âUsersâ and set the following:
a. Data â âUsersâ
b. View type = Leave default (Deck)
c. Display icon: search for âpeopleâ - and select the people icon for the View.
-
Optional: Move the âStatisticsâ view to â Menu.
-
Click SAVE.
Create a âRequired Reviewsâ view
- Create a new View named âRequired Reviewsâ
a. Set âFor this Dataâ â âReview required (Slice)â
b. Position: Left most
c. Set Display Icon: Search for âAlertâ and select an appropriate icon.
-
Click SAVE.
-
Test by clicking on the new âRequire Reviewsâ action at the bottom of the app and note that only Required Reviews are shown.
Branding and other UI updates
-
Click âBrandâ at the top and change the Theme, Primary color, App logo etc as you wish.
-
Click SAVE.
-
Change the default Font by clicking âOptions->Fontsâ and set Font style from âRobotoâ â âRubikâ
-
Click SAVE.
-
Click âRequestsâ again to view all the requests.
Setting Format Rules
- Create a new format rule: Approved Requests. Set the following:
a. âFor this dataâ : Requests
b. âIf this condition is trueâ: [Status] = âApprovedâ
c. âFormat these columns and actionsâ: Status
d. âIconâ: Search for âcheckâ and select a checkbox icon.
e. âText colorâ: green
- Click SAVE.
Behavior / Actions
Follow along here in the video demonstration.
Create a new action to add a quick approval button on the form.
- Click the âBehaviorâ tab on the left and click âNew Actionâ and name it: Approve Request.
a. Select âData: Set value of some columns in this rowâ from the dropdown and set:â
i. [Status] = âApprovedâ
b. Appearance â Action Icon
i. Search for âthumbsâ and select a thumbs up icon.
-
Click SAVE.
-
Test the action by selecting a record that needs approval and then clicking on the new Action to approve the request.
Automations
Follow along here in the video demonstration.
Create a new automation to send an email when a Request is created.
-
Click the âAutomationâ tab and click âNew Botâ
-
Select the suggestion: âWhen a Requests record is created or updated, send a notificationâ
-
In the Automation Settings window on the right, change the Event Type to Adds only.
-
Click SAVE.
-
Click on the âTasksâ tab at the top and change to task name to âSend an emailâ
a. Table name: - Requests
b. To: [User]
- Add or customize the following:
a. Email Subject: New Request!
b. Email Body: A new request: <<[Description]>> was created!
-
Click SAVE.
-
Test the new automation by creating a new request.
-
Now check your email and see the generated response!
-
Return to editing the automation task, and change the Email Type to Embedded App view option.
-
Click SAVE.
-
Add a new request, and check your email again to observe the difference where a form is rendered in the email.
-
Click Approve Request in the embedded Form in the email!
Security filters
Follow along here in the video demonstration.
Add a security filter to only show the ownerâs requests.
-
In AppSheet, click Security â Security Filters
-
Set Security Filter: [USER] = USEREMAIL()
-
Click SAVE.
-
Click âRequestsâ at bottom of the app and notice that only requests of the owner will show.
Deploying and sharing
Follow along here in the video demonstration.
Deploy the app and then share it with another user to become an editor.
-
Click Manage â Deploy
-
Click âRun Deployment checkâ
-
Review the deployment check report.
-
Click âMove app to deployed stateâ to deploy the app.
Share the app with another developer.
-
Click +(people) to share the app.
-
Add a userâs email on your same domain.
-
Click the Advanced option.
-
Allow the new user to âEdit definitionâ of the app.
-
Click Done!
Thatâs it! Let us know how it goes for you or if you have any questions in the comments below ![]()