Web1Forever

Using the Virten Prompt Library and Daydal Sidekick AI To Update A Complex Codebase I

Using the Virten Prompt Library and Daydal Sidekick AI To Update A Complex Codebase I 00:00:01    Hello, Terren here, founder of Virten.app and producer of the Virten prompt library. In this episode, you're going to see how to update a code base that's complex. Uh, we're going to use our main IDE here, which is bolt new, and we're going to use the sidekick is going to be DAL. And you're going to see how the development session works. How a good practice for proceeding day by day or session by session while you work on your software application. And this one, what you're going to get out of it is a good process 00:00:45    for starting up your software development session when you wake up in the morning and whatever you sit down to work and you're going to see how to update a complex code base. Specifically, we're going to be updating a data file. We've updated data files and the application is designed to produce the pages of prompts in the virgin prompt library from the data files. And we just need to make sure it's smooth and goes well when we tell the AI to update the category index pages. So let's look at how what we're 00:01:29    talking about visually for a moment. This is the verten prompt library. Here we have the categories chat instructions combo prompts doc creation fun and marketing and so I've taken the these are generated these are link pages and these index pages and then this page is generated through a data file and I have polished and updated the data files and now I'm going and I've also reorganized the categories a little bit and so all that needs to be communicated to my main development environment and we're 00:02:10    going to go through the process of how to begin the working session and update those files. So here the ideal thing is to go into bolt new open the stack blitz and fork your project. This is how to begin the development session. Give it an updated name. I used this format that you see here at top of the screen. I'm going to add the updated prompt fi data files. Okay, so now we're updated. Hit save and we're going to open up the AI assisted development environment. So there's two ways to go about this. I could complicate the chat 00:03:10    history and just talk to the AI right here in the IDE. And instead of doing that, I'd like to use a sidekick assistant here. So I'm going to go to DAL. I'm going to import that updated prompts folder here. We're going to use datal to map out the implementation plan, bring that plan into bolt new and have a more uh make it more likely that the whole thing is solved in one shot. And our main job is to update the vertrompt libraries category pages with the new links. These are the category pages here with the new links 00:03:56    to the reorganized and updated prompt data. So, we've brought in our prompts folder to our sidekick and datal here. We're going to use a document creation prompt. And with this prompt, we're going to tell the AI which one do we want to use. There's so many choices, right? uh we'll create a no code information gathering session and so this lengthy prompt instructs the AI datal here to produce a document every time I talk to it. So I don't have to say write a document, write a document. Every prompt 00:04:40    in this case, it's going to automatically generate the documents, it's instructed to use uh to add certain features to the documents. Most of those features we don't really uh use in this simple job. Uh but one thing it does do here is automatically create ASKI diagrams which I find to help with the thought process. Uh AIs also tend to find ASKI diagrams easy to process. Now Datal tends to be pretty long- winded with Claude 3.7. So in between writing some of these files, I'll be hitting the pause button on my 00:05:25    recording session and we'll just be popping right back and forth. You won't even notice it. So let's tell the AI what we're trying to do here. We need to update the links for the prompt data. So I'm going to tell it to write a concise nigs log. The job is to search through the sub folders which organize the prompts by category. Then create a directory map for each category and its respective prompts. Also for each respective prompt.ts TS name the hyperlink that will be presented as the name of the specific prompt data 00:06:37    file. Okay, I'm going to send that one off. Let it write the All right. So, Datal produced the first nigs log in and response. It did a mapping where it looked through all the prompts in this web container and it created this document. Now, this isn't exactly what I'm looking for though. So, we'll just ask him to do the job again. Datal that is in a more clear way. So let's say giving it some details like I really don't need it to blame or list every prompt. So I'm asking here this is about mapping 00:08:06    the prompt data files to their respective categories in an elegant directory structure presentation. And the point of this is I'm going to bring this document over to the main development environment so I can update all of these category pages uh in one shot. It's the goal. So let's send this prompt off. While we wait for this to go, I want to let you know that there is a demo version of the VPL available. You can go to freedatal1.Virten.app and in the sidebar here, you could click free VPL demo. There's also more about more 00:08:53    information on these links. All right. So, it's produced a the list of information that I asked for. What we're not getting is the names of the pages. So, we're going to ask it to review the code snippet, which is just a copy paste from this content it just produced. And I'm going to ask it to reproduce the code snippet information with the addition of another line for each prompt.ts data file. Following the added arrow, we will provide the title information as the name of the hyperlink for each respective 00:10:24    products file. which hyperlink will be used to populate each respective categories index page. All right. So, basically, uh, if you can't if you're not following along exactly with that, which I wouldn't expect you to, we're we're talking to the bot. We're going back and forth with the N6 log, and we are we're we're refining what we're trying to do. We're getting down to exactly what I needed from the bot after building up some context with the bot. And so perhaps in this nigs log number four, I'll have exactly the directory 00:11:13    structure with the hyperlink titles that I need to bring over to the main development environment. And it looks like that's exactly what we're going to have here. Okay, so check this out. It gave us the link. We have a complete bit of information to provide the AI in the main environment. So you saw me at the beginning of the video update the prompt data files in the stack blitz and bring it into this bolt environment. And now I'm going to get the job done in one shot. What we're looking to do is we're 00:11:55    going to see these this organization of prompts change and we'll go with that. The updated information is in the following code snippet. Okay. So to affect this in one shot, we're going to want to use the combination prompt code name the implementation. This is going to tell the bot to make sure you review all the details. Um, and give the implementation a name so it knows what it's doing and we can talk about the implementation later if there's a bug to fix. Let's send that off. There's Bolt producing the 00:13:14    code. All right. So there, the AI just went through each of the four category pages the which are category indices, updated the hyperlinks. That's what it said it did. That's what I told it to do. I'm going to move that update into the GitHub, push it to my host. The application is going to build and we're going to refresh this and see some updates. For instance, uh this should change. Document creation organization should change and have some new names here so we can recognize whether this process worked or not. 00:13:51    Now, one thing I uh that's been going on with the AI and I think it has to do with how it's managing the context. Um but for some reason um for instance, I haven't there's a great order in the verten prompt library where after you use the code name implementation once the implementation is complete, the AI is then to uh create a final technical document that describes what it did, what files it modified. And that's what this file we see on the right side is. But one problem is that the AI keeps uh is not keeping up 00:14:24    with the current events for some reason. And in this case, it actually produced a final technical document for what was literally we forked the conversation and did a a totally new chat and it still produced a document from freaking basically outer space from a previous branch of of this. I don't know what's going on with that, but I will here ask the AI to update and do the final tech for Star 44. Do nothing else. And maybe that'll help the AI and keep up with where we actually are. All right, so that works like a 00:15:10    charm and it did update. It's a good thing that in the code name implementation prompt snippet, you can name the implementation. It's default to starski, but as you can see, I simply added a 55 in front or a 44 at the end or 1 2 3 ABC. So each implementation uh that I order has a unique reference point. And so I said, well, why don't you produce the final tech document for stars key 44 now? And it did. It send it to the chat for some reason. I put it into my application where I like it in the codebase. Anyhow, now it's time to 00:15:43    go through the steps to update the production environment, which is a preview distribution I have for the Virten prompt library, and see if the category pages hyperlinks are actually updated correctly. In this case, we know that only four files were updated. So, it's pretty easy to update the files in the main distribution application or in production by hand. So, let's see what we have. All right. So after pushing the update to GitHub, it automatically built the application over at my web host. And we 00:16:59    should now be able to refresh this page and see the updated application. Now, one good way and a good practice is when you're updating something where you have it live in the web browser is to clear your cache or so it resets and redownloads the whole website. So, you're not actually looking at an old version of your application even though you think it was updated. So, you can do that on most web browsers with Ctrl F5. So, we'll refresh the page and make sure we get a new website. There it is. 00:17:28    And let's see if some of these category links are changed. Interesting. So it did change then but it appears to have done uh something incorrect. So this is the case where most of the update is correct. Let's see some of the new links and the new names. So this is working correctly. And now this is pretty much standard software development. little bugs and things. And in this case, what's missing is the my general use prompt category. In fact, what it did is it gave it the wrong name. So, I'll simply update that 00:18:19    manually. And this session will be pretty quick, pretty effective way to update um all of the prompt data pages with new hyperlinks. New prompt data pages were introduced and some were removed. So the job was a little bit complex and now it will be complete with simply renaming this one link to general use which is my preferred name in this application for this category of prompts. And that's it. I hope you got some value out of this video. Understand a bit how to work in a complex codebase by taking 00:19:10    a slice out of it. In this case, I had to update the data files. So, I removed them. I updated them by hand because that's part of the actual work part that I have to do to produce the prompts for you guys. Uh, we took it uh and we wanted we went about it intelligently. We used the sidekick AI. In this case, we used free datal and asked him to use um create documentation each round through the no code information gathering prompt. And we worked it back and forth for four responses with data to get what 00:19:47    we wanted, which was a direct mapping of the job to do for the main AI in the main codebase. We brought that over, ran the code name implementation. Worked like a charm. I must have had one I had the one incorrect title and we fixed that at the end. Everything was oneshotted here. That's uh the power of a good workflow and using the Virten prompt library, building up plans and implementation plans and bringing those into the main code base. So, I hope you got something out of this video. Let me know in the 00:20:23    comments what your thoughts are. Check out the Virten prompt library demo. Go to free datal1.vertton.app. In the sidebar, you can use the demo for free. launch.Virten.app. You can get more details about the full product as well as a promotion code so you get a discount for your first three months. Uh please like, subscribe, and share. This is Terran for vertton.app and I'll see you on the next episode.
Decorative Separator
-T [email protected] Virten.App Founder & CEO https://virten.app https://x.com/VirtenApp Demonstration Videos at YT https://www.youtube.com/@VirtenApp P.S. Check out these AI Vibe Coding Demonstration Video Transcripts to learn more about AI-assisted coding techniques and best practices!