How to Code Boring Internal Apps 10x Faster

Hi, my name is Chris Smith, and this is a talk on how to build boring internal tools 10 times faster. I am a developer advocate at Retool, which is the screenshot of the product you see here. And a little bit about me, I'm a hacker at heart, started playing around with QBasic when I was in middle school and messed around with Visual Basic and got really passionate about the visual abstractions of code. And that's really been the theme of my career. And what led me to Retool, and the Retool exists to help engineers create valuable software really fast. And I think that's a really fascinating vision for our company. And so our focus is on internal tools and building internal tools much more quickly. And you might be wondering what is an internal tool. And just think about all of the admin panels, the CRUD interfaces you've ever built, the custom internal apps. And these kind of exist in combination with all the software you'd write for your external customer base, say your marketing site, your products, if you're a SaaS company. And they're often slightly different from or extending off of your other internal apps like your CRM, your customer support tool, your marketing automation platforms. And pretty much every company ends up having to write a bunch of custom software for internal ops and processes. Some examples of these are things like contract renewals and loan approvals and DevOps and customer care. And they tend to be kind of cumbersome. But some things that define them is it tends to be a really well-defined problem you're trying to solve, some sort of business process that just needs to be done. And there's often a lot of time pressure. They need to be done yesterday because they're blocking some process or team. And they're used by internal people to your company, meaning not all the same requirements exist or the same stringent maybe design requirements. And so if you start doing this from scratch, you end up building a whole lot of boilerplate code. You got to find the right components. You end up with slow dev cycles, waiting on other teams to merge your code. And you end up needing a lot more expertise in CSS and back-end interfaces to make it all work. And so this is why Retool exists, is to solve this problem specifically. And the way we've gone about solving it is to build a drag-and-drop user interface that allows you to drag different components that are pre-built into this UI really quickly, a bunch of pre-built database and API connectors that allow you to quickly connect to those different services. And then the ability to write custom JavaScript anywhere across all of these different items to make all of the logic work together. And so in the interface itself, you can start with, say, a blank UI. And you can go and drag, say, a table in and say, then open the bottom panel for a query. I have Postgres here. I'll just say, select star from users. Do this. It looks good. Let's save it. And let's tell this table to reference the data from that query. So now this table is pulling in this user's table data. And I can also go in and start adding in some other things, like a container here, or maybe a button to take some action on that data. And maybe a header for that. Let's give it a name. And I can go in and inspect all of the data associated with this app, all the components on the left-hand side here, see the query values, see the individual tables, say, selected rows. And that hopefully gives you a quick idea of the app itself and how things are connected together. And since this is a really short talk, I'll just go through some of the things that I think are really cool about this. Because once you can start to compose these different components together, you can build pretty sophisticated internal tools, like this account dashboard, or this asset management interface for managing different files, or extend your current SaaS tools, like Salesforce, and build this really better note-taking interface on top of your CRM. And the focus of all this, really, is that it's a tool built by engineers for engineers. And so some of the things that we do to make that really easy for an engineer is expose all of the metadata, and context, and properties of these individual components, so that you can really quickly write the code you need to make all the components work to build the application you want to build. A whole lot of really easy-to-use database and API integrations, as well as the ability to connect to any open API endpoint. And so there's tons and tons of components that are pre-built. And you can also extend these and build your own custom React components if you want to. And as you're doing all this, you can really write JavaScript everywhere. We've tried to make it possible to have an escape hatch to just code whatever you need anywhere across the entire app, like using this math.round function, or setting table background colors using conditional operators. And we'll auto-suggest, as you're writing in curly braces, all the different objects or methods that we think are available to you. We'll also introspect the schema of your SQL databases or your GraphQL endpoints, and use autocomplete to show you which data to return. And as I mentioned a second ago, you can build your own custom React components if you want to, or pull in your own custom JavaScript libraries, which you can then reference anywhere in the app. And I mean, there's so much more here. You can do custom authentication support. You can deploy it locally into your own on-premise virtual private cloud if you need to, and sync it with your own GitHub instance. So I hope this is helpful for you as a potentially new, interesting tool. Let me know if you have any questions. You can find me at CLSSmitty on Twitter. And you can try it out at retool.com. Thanks. Thanks for watching.