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
2. 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.
3. Click the ‘Data’ tab on the left and then click the ‘Requests’ table.
4. 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().
5. Click SAVE. (Ignore the warnings)
Add a new table, ‘Users’
Follow along here in the video demonstration.
6. Click ‘Tables’ at the top and then click ‘Add Table “Users"'.
Add a table Reference
7. 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.
8. Click Done and click SAVE.
9. 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.
10. Click ‘Slices’ at the top and click ‘New Slice’.
11. Name the slice Review required.
a. Set:
i. Source Table: ‘Requests’
ii. Row filter condition: ‘= [Status] = "Review required"’
12. 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
1. Click the ‘UX’ tab on the left.
2. Click to edit the ‘Requests’ view.
a. Change viewtype to -> ‘Card’.
3. Click SAVE.
Create a ‘Users’ view
4. 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.
5. Optional: Move the ‘Statistics’ view to -> Menu.
6. Click SAVE.
Create a ‘Required Reviews’ view
7. 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.
8. Click SAVE.
9. 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
10. Click ‘Brand’ at the top and change the Theme, Primary color, App logo etc as you wish.
11. Click SAVE.
12. Change the default Font by clicking ‘Options->Fonts’ and set Font style from ‘Roboto’ -> ‘Rubik’
13. Click SAVE.
14. Click ‘Requests’ again to view all the requests.
Setting Format Rules
15. 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
16. Click SAVE.
Behavior / Actions
Follow along here in the video demonstration.
Create a new action to add a quick approval button on the form.
1. 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.
2. Click SAVE.
3. 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.
1. Click the ‘Automation’ tab and click ‘New Bot’
2. Select the suggestion: “When a Requests record is created or updated, send a notification”
3. In the Automation Settings window on the right, change the Event Type to Adds only.
4. Click SAVE.
5. Click on the ‘Tasks’ tab at the top and change to task name to ‘Send an email”
a. Table name: - Requests
b. To: [User]
6. Add or customize the following:
a. Email Subject: New Request!
b. Email Body: A new request: <<[Description]>> was created!
7. Click SAVE.
8. Test the new automation by creating a new request.
9. Now check your email and see the generated response!
10. Return to editing the automation task, and change the Email Type to Embedded App view option.
11. Click SAVE.
12. Add a new request, and check your email again to observe the difference where a form is rendered in the email.
13. 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.
1. In AppSheet, click Security -> Security Filters
2. Set Security Filter: [USER] = USEREMAIL()
3. Click SAVE.
4. 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.
1. Click Manage -> Deploy
2. Click ‘Run Deployment check’
3. Review the deployment check report.
4. Click ‘Move app to deployed state’ to deploy the app.
Share the app with another developer.
5. Click +(people) to share the app.
6. Add a user’s email on your same domain.
7. Click the Advanced option.
8. Allow the new user to ‘Edit definition’ of the app.
9. Click Done!
That’s it! Let us know how it goes for you or if you have any questions in the comments below 👍
LinkedIn
Twitter
