Description Transcript
Prompt and build complete Retool apps—from a blank canvas to a fully functional, production-ready tool—using the Assist tab’s conversational AI interface.
When starting from a blank slate slows your momentum, Retool can help you spin up a full-stack app from a single prompt—wired up to your live production data (Postgres, Databricks, Salesforce, Airtable, and more). Use AI to scaffold the heavy lifting, then fine-tune with drag-and-drop editing in the Retool IDE so you can go from idea to production-ready app fast, without losing control over the details.
The future of enterprise software is being generated in Retool.
Read more 0:02 Welcome back everybody. My name is Angelik Laboy Torres. I'm a Developer Advocate here at Retool 0:07 and today I'll walk you through the best ways to prompt an app using the Assist tab. For context, 0:13 Retool can generate a full stack app from a prompt using your live data from Salesforce, Databricks, 0:20 Postgres and many more. So let's get started. 0:26 When you open up Retool IDE, if you go to the bottom left corner, you will see a new tab called the 0:31 Assist tab. Here, you can leverage a conversation interface where you can tell it exactly what you 0:36 want to build and have Retool instantly generated. The great thing is that you still have access to 0:41 100 plus components. So you can drag and drop exactly what you want your draft to look like. 0:47 And instead, if you decide to prompt, then Retool can build on top of that work, which is amazing. 0:52 so you can still edit or create queries in SQL, JavaScript, and even Python, 0:58 so your workflow can be met exactly based on your needs and preferences. 1:05 When it comes to prompting and Retool, I would think of these six main categories. 1:09 First, you have Generate, meaning that you will create something from scratch via a prompt, 1:14 spreadsheet, image, or PDF. These type of prompts allow you to get comprehensive functionalities like 1:19 components, clearing, code, and event handler. 1:23 It would also give you the scripted naming convention to all generated components. 1:27 So, for example, this would be build a support ticket tracker. 1:32 Next up, you have Edit, meaning that you will modify an existing app or component 1:37 using a prompt. 1:38 Something like this could be add a department filter. 1:41 Number three would be debugging. 1:43 So this is anything that is troubleshooting an issue inside your 1:47 a Retool app via a prompt. 1:48 An example here would be the query is broken. 1:52 Style. Style is the just the appearance of components 1:56 or your app. 1:56 An example here would be the app theme, 1:58 which can be automatically created and applied, 2:02 or even down to how every single component 2:04 individually looks. 2:05 An example here would be simplify the interface. 2:08 Number five. Understand, 2:11 which means answering any clarifying questions 2:13 about your app. 2:14 So the AI knows so much about Retool that it is great at answering any sort of questions 2:20 about like the purpose or even down to how things work. 2:23 So a great example here would be, what happens if I click this? 2:27 And lastly, you have Guides which offers general advice or best practices. 2:31 So again, because the AI knows too much, then is able to actually give you step by step 2:36 about how to implement something if you'd rather do it yourself. 2:40 Or it might actually provide useful links to documentation or the community forum. 2:44 So something here would be, how do I validate this form? 2:50 Here are some general best practices when prompting. 2:53 First up, you have bind data via the @Resources. 2:57 When developing queries in an app via prompts, 2:59 use the @ symbol in order to reference specific resources. 3:03 So an example of this can be create a read query using 3:08 Retool database. 3:10 that's where you use the ad and the delivery app table. 3:14 Okay? 3:15 However, sometimes we might want to work on something 3:17 more quickly because it's just a prototype 3:19 or you kind of just want to focus on the UI 3:21 or US capabilities for that, we can use mock data. 3:25 And the reason why is because real data can be 3:28 so interconnected and complex, 3:29 which can take longer to generate. 3:31 So for this case, you just have to tell it to use mock data. 3:35 An example of this can be create an inventory dashboard 3:40 with mock data, please do not use existing data in repo. 3:48 Comprehensive application definition. 3:50 Structure problems to demonstrate 3:52 complete functionality, not isolated components. 3:54 It makes it easier to have a success metric 3:57 and what the requirements are. 3:59 An example, using @hrdatabase, 4:02 employee table with columns, employee ID, 4:05 full name, department, start date manager, ID, 4:08 onboarding status, create an employee onboarding dashboard. 4:11 If you want more details about this, 4:12 I recommend that you actually check out my video 4:15 on the perfect prompt formula. 4:17 Number three would be demonstrate data integration. 4:20 So, should do the AI how multiple data sources 4:23 are supposed to be connected 4:24 in the relationships between them? 4:26 So, an example of this would be connect 4:28 at IT as a database. 4:30 So, the asset ID, asset type, serial number, 4:33 assigned to employee ID warranty, 4:35 with @Employee Directory to build an asset management system 4:40 featuring searchable inventory with filters for asset type, 4:44 assignment status, and warranty status. 4:47 Number four is known fees. 4:49 So if you have a well-known company name, 4:52 for example, let's say Coca-Cola, 4:54 then it could apply the company colors to the theme. 4:57 Number five would be Targeted Changes for an Assisting App. 5:00 In this case, the Assist app excels 5:02 making specific small edits to existing apps, especially when the specific element is referenced 5:09 with the @ symbol. So, for example, this would be in @ table, bold text for expenses over $500. 5:18 Number six would be identify components via label. As this works best when you provide labels or 5:25 clear names for existing components. So, an example here would be hide the ID column in customer 5:31 tape. When developing an app, use threads in order to capture the workstream specifically and name them 5:38 appropriately. Be specific and small with the changes. So keep the edX or the debock prompt 5:44 small in scope so changes can be versioned very easily. An example of this would be 5:49 change the submit order button color to dark. Number nine, use releases to capture state. 5:57 So as we progress, I would recommend that you actually use the create releases in order to 6:02 capture successfully with the updates that bid. Last one would be identifying scope. So be specific 6:08 about whether queries or variables are supposed to be globally scope or paint scope. So an example 6:13 of this would be create a query scope to the home page. So that's it for this video. Thank you so 6:21 much for watching. Now I want to invite you to actually start exploring the space and just try 6:25 something fun don't start overthinking it too much because you might try to make something 6:30 smart and then just never end up making anything so make something that you want to make make 6:34 something fun and share with the community forum so thank you and i'll see you next time