AI-powered decentralized app generation with DappThat

GM, GM. Welcome to what's going to be another great episode of DevNTell. So if you didn't know, DevNTell is a 30-minute podcast held every week, allowing founders, hackers, and anyone in between to come on the show and showcase their product. And today I'm excited to welcome Jonathan Else, who's a core dev at DappThat. If you didn't know, DappThat is an AI-powered decentralized app generator for developers so they can innovate 1000 times faster. If you stick around for today's episode, you'll see Jonathan give us an overview of DappThat and show us how we can get started using it today. All right, let's get into it.

GM, GM. Welcome to the show, Jonny. Pleasure to have you on.

GM. Thanks for having me. It's a pleasure to be here. Been a part of the community for a while.

Awesome. We always love having community members come aboard the show. Um, that's actually how, um, the show was, uh, was started. It has deep roots. So, uh, excellent. We're still living up to that. Uh, I guess, uh, before we get into all the great content you have prepared for us, um, would you like to give a brief introduction about yourself?

Sure. Um, I've been a blockchain engineer for about six years. I didn't go to university. I, instead, I actually started a study group on Discord, um, entirely focused on Solidity. Went through the headache of, um, making tutorials, um, you know, having to go and learn and figure all that out, and every time I made something, I made the tutorial on it and I left a link to the study group and I surrounded myself with blockchain engineers for about three years. Um, got really good at micro, macro kind of design thinking, problem solving in, um, blockchain engineering. Um, and kind of eventually trans- translated that to automating the developer experience, um, at least semi-automating like, it's so each stage of the way it gives you suggestions, um, instead of, um, you know, giving AI full control. In such a high-stakes industry, you don't want to give AI full control.

Yeah, indeed. Uh, you want to rein it in a little bit, want it to be a companion instead of the, the decision maker so to speak. Um, and I guess, um, have you always been in the, in the tech industry or, or, um, before starting your journey in Web3 or?

Um, I was, I was in data analysis before I got into Solidity, um, and I got really bored of that role because, you know, they were, they were like, "Right, we all use Excel!" and I was like, "Okay..." as a programmer, I was like, taught myself some game development and, uh, some machine learning, so, um, like at that stage. So I was just, I was so bored with that. I was like, you know what, I want to, I want to go into a new space and I chose blockchain.

Awesome, man. Yeah, I, I can imagine how, um, monotonous it would get just working with Excel sheets every day. Um, so I think I, I think you made the right switch. Uh, so, uh, I guess, um, in terms of, um, starting with Solidity, was there a particular reason you chose that? Um, I imagine it was because of, of its popularity but, um, is there anything that particularly stood out, um, that's like, that was like, yeah, I need to go do this now.

Well, I always knew that, uh, I liked problem solving. Um, and I always knew that I wanted to start my own companies. So, when I seen the price of ETH go up skyrocketing, I was like, well, that is nothing but proof of demand. Um, and so I figured, well, I'm going to go and explore this space. Um, and yeah, met so many amazing people during this time. Uh, yeah, it's been phenomenal. Um, I've definitely, as you said, right, definitely the right choice.

Yeah, 100%. And I guess, um, of all those people that you met, um, were the co-founders of DappThat one of them? And how and, how did you basically, um, end up at DappThat? What's the origin story?

Okay. Um, so, by going through this journey, I networked with a lot of people. Um, actually one of the co-founders, um, is sitting right next to me. Um, we've been working together for almost six years. Um, two of the co-founders are over in Toronto. Um, this is actually a child product of our, um, one of our main company products, which is Spark Engine. Um, so, Jordan, the CEO of Spark, he came up with, um, this no-code platform for kind of connecting different AI models and responses to each other so we could automate large-scale thought. Um, and it was because of that that I was like, wow, this is, this is the thought engineering, right? And that eventually actually led to me starting the thought engineering network as well. Um, so kind of tying these all together. Um, I was like, I'm going to automate my intuition here with Spark and create DappThat.

Amazing, amazing. And, uh, you're, um, kind of, uh, not treading on the same social path in terms of the rest of crypto, where everybody is mostly on X. Uh, I, I hear that you had a recent big milestone on LinkedIn. Um, did you want to share that?

Um, sure. Um, I just got to 3,000 followers on LinkedIn. Um, yeah, I'm definitely much more active on LinkedIn than I am on, um, on X. Um, I'd prefer to kind of stay away from a lot of the hype and, um, and kind of that, um, yeah. I'm a just, I prefer focusing on like the fundamentals, and I find that a lot more common on LinkedIn than, um, than X. Don't get me wrong, I, I enjoy going to the Twitter spaces on X. Um, um, but in terms of just like general content, like, it's, it's much more focused on the fundamentals there.

Excellent. And, and I've dropped the link to Jonathan's LinkedIn, so definitely give him a follow there. Um, and congrats on crossing, uh, 3k. Uh, well done, well done. Uh, yeah, I guess, um, with that, uh, I'm very eager to see, uh, what you have prepped for us today. Um, I, I certainly would love to be thousand times, uh, uh, more efficient in my development day-to-day.

For sure, man. Well, I'm happy to, uh, happy to show.

All right. Uh, yeah, the floor is yours. Go for it.

Okay, perfect. Okay, so we have DappThat. Um, as I said, um, you know, it's, we've got a couple of networks that we've integrated with at the moment, um, and we're looking for more EVM chains to connect with, um, and do co-marketing with. Um, I do have, you know, if you do want to kind of go over things a bit slower, then there is a demo video here for you to go through, um, and there's also some example dApps here. These were made with an earlier version of the generator, um, so these are, um, you know, they're not as good as what's actually, um, coming out of the generator these days. Um, but I'll kind of get started on this. We do have, um, a thing right now, if you go on dappthat.com you can join the Discord, um, and, um, you can get some free credits to be able to use the generator. Um, and then, uh, if you run out of credits then you can just purchase some with ETH. We don't have our own token yet, um, but the reason that we would be looking to make our own token in the future is, um, because we'd look to decentralize the AI, um, kind of aspect of the generator, um, and kind of open up to that side of the market as well in different vertical. Um, if you have a Spark Engine account then you can use an API key for that, um, but most people in Web3 won't, so, um, here you can just connect your Web3 wallet. Um, it is in beta, right? So it is buggy sometimes. Um, I'd say like one out of every 10 to 20 times, um, it'll have an application error at some point. Um, but, uh, other than that it's good. It's going to ask you to sign a message. If you're on Mac, then that sometimes doesn't come up, um, with but you need to sign that message in order to actually log in to the application to use the credits. Um, today we're going to make like a tokenized fund, um, so I'm just going to say CryptoVentures as the name. Um, the purpose of the fund is to manage, um, investments across, um, across the Web3 industry, um, and, uh, manage investments across the Web3 industry, um, for a tokenized fund. Um, and who's going to be part of the community is going to be a fund manager. Um, really, um, I should have put investors there as well.

So this first of all is going to take this small amount of details we just gave and it's going to give a summary, um, kind of of what the name, the purpose, the target community, the requirements, um, and then you can either give some feedback and reiterate on that or you can accept and continue. Um, here I'm just going to for the purpose of this demo, I'm going to ask for a single-page application. Um, if you do want to kind of push those boundaries a bit and do a multi-page, I wouldn't recommend doing any more than four right now, um, just because it can really get, um, um, buggy, right, down the line. Um, but for that it's fine. Uh, for this, I'm just going to choose for the UI, um, black and two shades of gold, right? Kind of want a luxury feeling for the, um, the investor. Um, the features I like on the dApp, something kind of simple, let's say, um, uh, manage investments, um, investments, um, token allocations, um, and, uh, uh, investors into the fund. Um, should be fine and we'll just go ahead from here. Um, if you haven't got any credits in your wallet then you're going to get to this stage and it's going to, it's, it's not going to let you go forward and it'll push you to get credits. Um, but as I said, if you want to join the Discord then you can get a bunch of credits, it should be enough for you to go through the generator fully once.

Um, we have first of all the smart contract functional requirements generation. So this is going to come from two different levels. One, the global requirements, um, and then two the, um, the actual requirements of the smart contracts as well. Um, I'm going to, I'm going to remove the fee handler, right? Now I tell you now, right? Like you can near enough assume that most of these functional requirements are right but if you have any specific changes you'd like, you can always change them here. Um, delete functional requirements, delete contracts, add new contracts and functional requirements, um, before you proceed to the next stage and even as so you can rename the, um, the contracts as well. Um, but I'm I'm all good with this, I'm just going to for the purpose of the demo kind of fire through it. Um, now it's going to take about 90 seconds, right? Um, so what this is now doing is it's going to take these functional requirements and it's going to generate, um, an array of tasks. Each task doesn't need any information from the other task in order to complete the task and the task is like the general plan of a smart contract. Then it's going to generate some high-level details and some slightly lower-level details and then it's going to combine those high and low-level details and go and use these to actually generate the smart contract themselves. So this is why it takes about 90 seconds, um, for this stage.

Um, but during this, um, while it's going through that I can show you some of the example dApps. So I've been doing a build 30 dApps in 30 days challenge, um, something that I'd never seen anyone ever do before, so I thought, well, it's a good way to kind of stick out from the crowd. Um, some of these are open source, some are not, some are client requests, so they've been kind of behind closed doors. But, um, I can kind of show you, um, a little bit about these. So this one's, uh, one that I made which is an NFT loyalty app, um, where you're able to set up different rewards for different, um, NFT projects. Um, this is mostly the generated UI, I made some little changes, but, um, it made it very fast. Um, and I've got these deployed to the Avalanche Fuji testnet. So, thanks to, um, thanks to Avalanche for going ahead and giving me, um, way more testnet funds than I needed in order to go through that. Um, and if you as I said, you these are on my Twitter, these are on my LinkedIn, so if you kind of want to go over these then, um, and give me some feedback, you know they're open source, so if you want to contribute to them, go ahead. Um, all the smart contracts are tested, um, quite in-depth. Um, this one is TimestampDocs, so this is essentially being able to, uh, take any document, um, cryptographically hash it and store that on the, uh, the blockchain as a sort of like timestamp notary, um, for protecting IP and what-not. Um, so that's, yeah, that's one thing that, um, we've been working on, what I worked on here. Again, these were all made in, these were made in 24 hours. Um, you know, with some, uh, with the bulk of it being made by, uh, the generator, and then just whatever, uh, things I want to do after that.

Um, I have no idea why I have so little credits. Um, that's a, uh, that's an interesting one. Anyway, um, hopefully that doesn't cause any problems. Um, before once you get to this stage and you're generating your smart contracts, um, it's going to give you the option to compile your smart contracts. I have an API on the back end that boots up and destroys a Docker container on command, which essentially is a remote test execution environment where you can compile your smart contracts, remotely execute tests, um, flatten your smart contracts, and what-not. So, um, this will give, you know, either detailed error on what the, uh, error was of the compilation if there was any, um, and, uh, if not then, uh, you're kind of good to go.

Um, this is using, um, we use such a, a varied range of AI models in this, um, in this setup. Um, so as you see here, scroll the, the code there. I'm going to hit compile, um, I need to change that to say compiling once it's been pressed. Um, but this should come back in, uh, just a few seconds. Right, so it failed, that's fine. What's the error? Um, uh, identifier is not a library name, contracts, uh, it's on line 16. Um, address, yeah, address isn't even imported here. Okay. Well, some things happen. Um, but let me see one of the other ones. This one is not using address, so that should be fine. Um, obviously you can always edit these, so going back to like this first one, um, based on the compilation error, um, I can go in here. Um, we only support, uh, OpenZeppelin contracts at the moment, so but you can go in here and you can, uh, change the code, um, as you need it, um, before, um, you know, going to compile again, um, and again it'll show you the updates and what-not. So this one, compilation successful, so kind of continue. I'm just going to kind of skip past this last one for now.

We do have, um, we go and generate some tests here. Um, again, this takes about 90 seconds. Um, it's going to generate first of all the high-level test cases, so, um, not the code itself initially, um, just the high-level test cases. And we use about six, I think six different models here, um, to analyze the smart contracts from different points, um, and find out okay, well this is, and then we combine them all together, so we have a very comprehensive test coverage suite, um, at a high level, and then you can generate the test code as well. It's also going to find, uh, analyze the contract and find if it needs any mock contracts, in order to make sure that this contract standalone is being tested with these mock contracts, and then it'll generate those mock contracts as well if there are any that are needed. So this should, um, this shouldn't be a, uh, a massive amount of time.

But during this time, I'll go back to some of the other dApps. This was probably my favorite one that I made out of all of the dApps so far. Um, I made a DEX in 24 hours, um, where it kind of adds in a bunch of different, um, features, um, like, uh, whale protection, right? So dumping protection, when you're deploying the dApp DEX, you can set a percentage that, um, is the maximum percentage that a token can be impacted by on price on a purchase. Um, and then also MEV bot protection. So, for those that don't know, MEV is maximum extractable value bots, and they'll essentially front-run your transaction, so they'll put a higher transaction fee than your transaction, um, to buy before you buy, and then they'll sell right after you, or you know, the opposite way, they'll sell first and then they'll buy after. Um, but that way they're able to kind of sandwich your transaction and take a bunch of value out of you there. Um, and so this is, uh, resistant to that because purely because there's a four-second delay. Um, and for blockchains that have a lot of, um, a lot of transactions going through them but, um, that four-second delay is is enough to kind of stop your transaction, it'll be able to be front-run, because then just your transaction would fail, right? Um, and, uh, you can you can definitely get some interesting stuff here. So I can see that you know I've got one, um, and I could swap that now.

Let's check on here. Okay. So, this has now got the mock contracts it's required it's found that it needs to make. Um, I've never actually had, um, one which, uh, comes with so many, um, different mock contracts required. So here you have your test cases, it should successfully deposit tokens and update the balances correctly. You can see here that there's a number of different types of tests, so functional, security, stress type and, um, edge-case tests. You can edit these, it shows which smart contract's being tested. Um, you can delete them, you can add new ones, um, if they're not kind of meeting the requirements that you have. Um, and then you can generate the code here. It's running, um, for Hardhat, um, not Foundry support yet, um, but that is something that we are looking to add.

This should generate now. Um, so you've got your, uh, your expect from Chai, describe statement, your it statement, um, it's getting the contract factory, deploying it, um, getting the signers, doing everything that it needs to do in order to actually go ahead and generate the, uh, an execute the test. Um, I haven't seen okay, so it came up with the the mock contracts now. Um, and is there mock ERC20, just a mock ERC20? Yeah, this one, mock ERC20. So that should, um, ideally run first time. If not, it's going to give me a an option here to edit the code. I've got to say the testing of the smart contracts, um, and the integration of the smart contracts into the component, the area where needs the field in most work in the generator, um, to make it better. Um, but you know it's it's getting there.

Um, missing constructor argument, um, for what the, is this the ha, that must be the, um, the mock ERC20. Um, yeah, the initial supply. Okay. So let's add in here, let's edit this code, um, and let's add in here you know a million or whatever that is. Um, save that, um, run that test again. So we'll see here that ideally this works now. But it kind of goes through that, uh, that kind of process. Um, right now when I'm using the generator that it's like optimal speed, I'll completely skip past the tests, um, just because I know, uh, but you see here, insufficient allowance, now I just need to go in and add that kind of, um, part to the code.

Um, the reason I kind of skip past this when I'm using the generator in my build 30 dApps in 30 days, is because currently I haven't got it so that the tests actually download at the end. Um, but generally at the end you can download a a Next.js project with, um, a Next.js project with, uh, APIs and database. Uh, well SQL. Um, so this is the fund token, I'm not going to do that one, but I'm going to look at the investment vault. So I can compile this contract and you're about to see the entire ABI and bytecode on on the page because that's not beautiful yet, um, but it's it's getting there. Um, once that's happened, just kind of scroll all the way past that, um, and go down to deploy contract. Um, you can select the network here, so we have Sepolia testnet, IOTA EVM, um, testnet, Moonbeams, Moonbase, Alpha chain and then Avalanche Fuji. If you haven't got these in your wallet already, it's going to, uh, request that you connect to that chain.

So here if I want to do IOTA, it should ha, maybe it doesn't want to today. Um, but generally it asks me, um, to connect to that chain. Maybe because I've already done it before. Um, but yeah you can hit and deploy, um, and then you can go ahead and send that through. Um, I'm just going to for the purpose of this I'm not going to deploy for the speed. Um, but we're just going to go next and we're going to focus on the web application side. So this is now going to, uh, analyze the smart contracts first figure out what functions would need to be integrated into the front-end, um, and then, uh, it's going to bring up you know what the pages are, what the components are for each one. So, uh, a hero section, a fund overview, portfolio stats, recent transactions. And instead of recent transactions, I'm going to make this a fund management dashboard. Um, and then I'm going to be fine with that, so, if I wanted to rearrange these you can literally just drag and drop them to rearrange them before you confirm. Once you've confirmed it what is now going to generate context for each of the components, what's the primary function, user goals, um, and context, um, content even, um, functional requirements and some key elements.

You are able to again, you're able to change these as you go, um, as you go through it but for the point of speed, I'm just going to go on to the next stage. So this is where it starts mapping the smart contract functions to the components, um, kind of getting ready for before we go and generate everything up. Um, after it's done that it's then going to generate the styling, so a primary, secondary and accent color. Um, if you remember at the start I asked for black and two different colors of gold, but it brought up one of these. You can just click on here and you can go ahead and change that up, so, um, now we have those there. I'm just going to hit next here, um, and this is going to focus on creating the high-level plan for the APIs. So these are Vercel serverless APIs, um, it's generally made so it can be deployed on Vercel. I know, um, centralized provider, but we're in beta. We will get to decentralized tech as fast as possible. Um, this will then give you the API name, endpoint, method, description. You can go through, you can regenerate, you can add new ones, you can go through all these different stages, um, before you actually go to the generation.

For the purpose of this, I'm just going to kind of skip over them. Um, and then it's going to use all of the information it's kind of got so far in order to generate a database schema. So, you know, what's the table name, what's the column names, what's the types, what's the primary key, is it required or can it be null, is there a foreign key restraint. You can delete these, it's so essentially CRUD operations on here, um, and then it would go to the next one. So this is where it gets to the final dashboard before, um, the components, this is like review section, it's going to set uh show you what the, um, uh, what components there are for the pages, the context, the, um, smart contract functions and APIs that are integrated into what components, what environmental variables are required for the APIs, what's the data format going to and from the API from the front-end components, um, and then again the database schema, just so you can kind of review it all before it goes into this, uh, next stage.

Um, that's funny, there's a login and logout function for the smart contracts that I never noticed. Um, but you see here it has like the APIs up here and then it's got the smart contract functions, it'll tell you what smart contract's being integrated, the color scheme, the environmental variables required for it, um, data formats and then into the schema again, one more time, before kind of go through save and submit. This is probably the part where it actually has the best user experience and showing you what the hell is going on. Um, so we've got, uh, the components. The components here take the longest to generate, right? Uh, the reason for that is because we just upgraded it from, uh, I think it was GPT or Claude 3.5 to Claude 3.7. Um, and the components come out so much better than they did before. Um, so, you know, taking that little bit extra time is, um, it's not it's not terrible at least. Um, if they do fail it retries generating that component up to three times before it gives up on it. Um, and the APIs and the SQL way quicker at generating than the components. Um, it'll generate the the components first, um, just wanting to make sure that we don't get like rate limited, um, on these.

While that's kind of going through we're going to go through one more of these, uh, dApps that I made. So, oh this is the procrastination pool. Um, essentially you would, um, stake tokens and the longer you take to unstake the more you, um, are rewarded, but you have a fixed amount of time. So if you procrastinate so long that you miss the deadline you lose the tokens that you staked, right? So it's just like a funny kind of joke kind of DeFi thing that I made here. Um, and, uh, yeah, it was it it didn't take, um, long this one. Um, but, uh, you can see like how much you're you're able to stake here and what-not. Um, and uh calculator as well. Um, for the purpose of this I'm not going to go into the actual, um, outcome. Ah, come on. Anyway, so it's retrying these.

Um, that's a shame that, uh, that those fail to generate. Um, you can always kind of go back and restart the, um, the process. Um, this was actually go back to the start of, um, of the web application design. So, um, I'm just going to kind of go off of that now. Um, but you kind of get the idea, right? Like, yes it's buggy sometimes, these things happen, um, as we're in early stage. But, um, I mean I've been doing a dApp a day using this, right? So I use this to get like 98% towards the end of the project and kind of just like top it off, change a little some things here and there, um, and then push it forward into, uh, live. So sometimes it crashes, sometimes it's great, um, but yeah. I'll figure out why that bugged out today.

It's all, it's all part of the, of being in beta, right? You got to, you got to fix the bugs that, that come out. Um, but yeah, I mean, the, it looked amazing like even those, um, those ones that you had generated beforehand and were showing, um, in between, they looked like pretty full-featured, full-featured dApps, um, which is pretty neat to see, um, only going through like a single tool that, um, basically guided you through requirements and like helped you test, and generate components at the same time. I guess, um, like once, once the app is created, um, and I'm assuming it's deployed to Vercel like you, like you mentioned, and then, um, is it possible for the, the end user to obtain the code that's generated? Or is that, um, like hosted by yourselves?

You download, no we don't host it. Um, this is a bit more of like a, uh, anarchist point of view, right? It's like, we don't want that responsibility, you take it, you have it, right? Here's there's the code, you download it. It's a Next.js project. Um, and, yeah, you'll have your APIs, your SQL, your, um, all your Next.js project. Um, and you're able to quite easily deploy that to Vercel or change it up to whatever tech stack it is that you're looking to kind of change it to. Um, but yeah it gets you the bulk of the way there and we'll add more, uh, support for different, um, technologies as we go. Um, this isn't something that, um, we got any investment for. This is entirely bootstrapped. Um, so, yeah, we've had a it's been a lot of, um, headaches but a lot of, you know, really fun times with this and it's just kind of crazy how, um, how far we can really push this now.

Yeah, and I mean you're, you're trying to basically automate the development lifecycle so that's, that's no easy feat. Uh, so that's amazing, um, how how much progress you all have made, uh, up to this point. And I guess, um, you kind of teased at some of the things, um, but is there anything in particular you'd like to share about the roadmap for DappThat coming up?

Yeah, yeah, there are. Um, I've got some, I've got some really cool ideas for, um, for DappThat. So, um, on Spark currently we have text-to-3D model, um, and we're kind of looking at different, kind of gaming, um, style AI models we can integrate there. Um, so we'd be looking kind of trying to convert this into a play-to-earn game generator, um, and then from there into I don't know if I should say yeah well, um, I want to I want to convert into a metaverse generator, right? So, um, you know, people would be able to generate their own games, um, their own characters and assets and kind of be able to take them across different, um, all those different platforms. Um, so yeah, there's, um, there's quite a few, uh, quite a bit of the roadmap to go. Um, but, uh, yeah, thanks for asking.

Yeah, yeah of course. We we always love the alpha on this show. Um, and, and yeah, looking forward to all the all the all the features you guys are cooking up there. Um, and I guess, um, seeing as we're, um, pretty much at time, um, what's, um, what would you say is the best way for people to, um, get started with DappThat? Um, it seems like it's just as easy as signing up, joining the Discord and getting credits. Um, but if people are looking for support or want to reach out or have feature requests, what's what's the best way to do that?

Um, you can either message me directly or you can, um, contact us on the Discord. Um, we're we've got people around the world, so two of us are currently in Germany, two of us are currently in Canada, um, so we've got quite a good amount of uptime, so we can respond generally fast. Um, and, uh, we'd be we'd love to hear your feedback on where you think that we could improve, um, and which kind of direction we want we should go in, um, because after all like yes, I built the bulk of this because, um, because I wanted it, right, for one, um, but at the same time like whatever you guys are wanting it to become, um, we'd love to kind of hear about that because obviously we want to build the best tool for the community.

Amazing, love to hear that. Um, and, uh, yeah, just thank you again so much, Jonny, for taking the time out of your day to to come on the show. I really appreciate it. Um, DappThat looks like, um, it's well on its way to automating, uh, a lot of the a lot of the headaches us devs go through um just wanting to build build cool stuff. So I want to get rid of that headache. I feel you, man. I feel you. But thank you, thank you so much for having me, Narb. It's been a pleasure. I really appreciate it. My pleasure as well. It's been it's been great. Um, and for folks that have been watching us live, um, I'm dropping a link for you to be able to claim your bit badges, um, attendance badge. Um, so if collectibles are your thing, definitely check that out. Um, I believe you'll have an hour from now to be able to claim that if you are interested. And with that, just want to wish everybody a very happy Friday, happy weekend, wherever you may be, and we will catch you back here next week for another episode of DevNTell. All right y'all. Cheers.