How do I use iOS shortcuts to send data to my app?
Hello, Tadabase Users! In this week's episode of Build It with Tim, we have something unique to share with you. Instead of teaching you how to build an app from scratch, Tim will be showcasing an app he has already built and explaining how he did it.
Tim had an idea to manage audio recordings he makes on his iPhone using a voice memo application. He wanted to make these recordings actionable and process them further by storing them in a database app, allowing him to manipulate the data freely. To achieve this, Tim used iOS shortcuts, a native feature of iPhones, along with Tadabase's custom component and the REST API.
The finished application Tim built looks different from a regular database app. It includes a search box and displays both the audio recordings and their transcripts. Tim utilized the custom component to add interactive features like a clickable dropdown for the transcript and a customized audio playback component. The backend structure of the app is simple, with fields for audio recordings, transcripts, and a date-time field to track uploads.
The main action takes place within the iOS shortcut. Tim demonstrates how to set it up, although he admits he's not an expert. The shortcut starts by receiving the audio recording and transcript files from the share sheet of the voice memo application. Then, it uses the Tadabase REST API endpoints, along with variables stored in a dictionary, to upload the files to the Tadabase app.
After running the shortcut, the audio recording and transcript are sent to the Tadabase app, creating a new record. Tim shares the link to the iOS shortcut and provides the code for the custom component's HTML, CSS, and JavaScript. He also explains the difference between using the custom component and other standard components like the table or list.
By using the custom component, Tim was able to enhance the visual presentation of the audio recordings and add interactive elements. Without it, the recordings would have been displayed as simple links. He demonstrates how to set up the custom component for a list of records from the chosen table and how to customize its functionality.
In conclusion, Tim shows how iOS shortcuts, Tadabase's custom component, and the REST API can be used together to send audio recordings and their transcripts from an iPhone to a Tadabase app. This functionality allows users to manage and process their recordings effectively. Tim shares all the necessary resources for you to try it out yourself.
That's it for this week's episode of Build It with Tim. Stay tuned for more exciting app-building tutorials and tips. Happy building!
Features Discussed:
-
iOS Shortcut (Time: 5:00)
Learn how to create and use iOS Shortcuts to automate tasks and streamline processes on your iPhone or iPad. -
Custom Component (Time: 12:53)
Learn how to build and integrate custom components to extend functionality and enhance your project's capabilities.
Transcript Summary
Introduction
I had an idea last week where I wanted a way to manage some audio recordings that I make on my iPhone. I use a voice memo application or audio recording app on my phone to quickly get ideas out of my head—ideas, thoughts, tasks, whatever it might be. I just record them with the app, and they’re saved there. However, they just live on my phone, and I can’t really do anything with them.
My idea was: how do I make them actionable? How do I process these thoughts further and actually do something with them? Whether I need to have it become a task or share that idea with someone else, I didn’t want them to stay on the app on my phone. I wanted to get them into a database application so I could manipulate the data however I want.
What I Built
I’ve already built this app, and today I’m going to show you how I built it or at least give you a general overview. To do so, I used iOS Shortcuts, which is a native feature of iPhones or iOS devices. The Shortcuts app is kind of like an automation tool. If you have an Android device, this video may not be super applicable to you, but you might be able to find something similar in the Android market.
We’re also going to be using the custom component available inside of Tadabase, which allows us to custom code a component to look and behave how we want. Finally, we're using the Tadabase REST API to communicate from the iOS Shortcut to the database application that I built.
The Finished Application
Here's the finished application. It looks quite different from a regular Tadabase app:
- We have a search box on the top, which works with a transcript generated on my phone through the voice memo app.
- The audio recording and transcript are sent to the Tadabase app. With the custom component, I can do some fancy stuff, like making the transcript a clickable dropdown.
- The audio recording is simply a file in a file field, but I've manipulated it using the custom component to display as a nice audio playback component.
Building the Backend
Data Structure
Inside the Tadabase builder, I created a blank app. For the data structure, all I needed was a place to hold the audio recording, the transcript, and a date-time field to know when something was uploaded.
I created a table called "Audio Recordings" with the following fields:
- Date-time field for "Uploaded"
- File field for "Audio"
- Long text field for "Transcript"
That’s all we need in the builder. Most of the action happens inside the iOS Shortcut.
Setting Up the iOS Shortcut
Overview
In the iOS Shortcut that I built, I’m far from an expert, but I figured this out as I went. The shortcut starts by receiving any input from the share sheet. I’m using an application called "Just Press Record" to record audio and generate a transcript. Within that app, I can share the audio recording and transcript, which triggers the shortcut.
Shortcut Actions
- The shortcut loops through the files (audio and transcript) and processes them.
- It uses a dictionary to store variables like the table ID, app ID, app key, and field IDs for the API requests.
- The shortcut makes a POST request to the Tadabase REST API to create a record and upload the files.
Demonstration
Once the shortcut is set up, I can record a new audio clip, generate a transcript, and share it with the shortcut. The shortcut runs and sends the data to Tadabase, creating a new record with the audio and transcript.
Custom Component and Page Setup
Custom Component
I used a custom component to create a more polished UI for the audio playback and transcript display:
- HTML and CSS were used to create a container for the audio file and transcript.
- JavaScript was added to hide the transcript by default and show it when the "Show Details" button is clicked.
Final Steps
I added a search box and linked the audio and transcript fields to the custom component. The final result is a clean, functional page where the audio recordings are displayed with a custom audio player and expandable transcript.
Conclusion
That’s it for the application. The key part is the iOS Shortcut, which I'll include as a link in this video. This week’s episode was a bit different, more conceptual, and not so much of a tutorial, but I hope you enjoyed it. I’ll see you next week. Take care, everybody. Bye-bye!
We'd love to hear your feedback.