Video ID: JybsMeYok2k
YouTube URL: https://www.youtube.com/watch?v=JybsMeYok2k
Added At: 13-06-25 21:18:53
Processed: No
Sentiment: Positive
Categories: Education, Tech
Tags: programming, AI-assisted development, ChatGPT, command-line app, project planning, requirements gathering, design solutions, user stories
Summary
The video demonstrates the use of AI development tools to create a command-line app. It uses ChatGPT to generate requirements, design solutions, project plans, and user stories. The video shows how to leverage AI throughout the project lifecycle to deliver projects faster and offload tedious work.
Transcript
in this video we'll be using AI development tools to create this app it's a command line tool that lets you select a Target shell environment Windows command prompt Powers shell or Linux bash you can ask for the exact command to accomplish some task in that shell for example how do I list the files in a given directory in Reverse date order the llm will give you the exact command for that shell environment and then the app will optionally allow you to just copy that command into your buffer so you can go and past and run it if you're familiar with GitHub co-pilot this is similar to its command line utility the app will be cool and useful and we'll certainly be doing coding in this video but we'll do a lot more I broken this video down into chapters as usual and you're certainly free to skip ahead to the sections that you find most interesting however I highly recommend that you watch this video in order while we will build a working app my intention here has more to do with getting you thinking about how you can leverage AI throughout your Project Life Cycle to not only deliver your projects way faster but also just to offload a bunch of the tedious boring work that you don't like doing in the first part we'll be using chat GPT to generate our requirements our design solution our project plan and our user stories and we'll get all of those into some nicely formatted documents that we can just download and place on our web server now that first section is only about 5 minutes and I think you'll find it well worth your time after that section we'll get right into our IDE and start using the ader AI coding assistant to build out our app the really cool part is that instead of Us coming up with all sorts of complex prompts to feed AER to generate our code we're going to have AER directly fetch those web pages that chat GPT generated for us and it will use those to easily create the code for our app let's get going we'll be using chat GPT for the first few steps before jumping over to our IDE for the real fund the coding these steps are necessary you'll see why as we go here's the general description of a project we have in mind we reviewed this earlier I'm asking chat GPT to use it to craft a better problem statement we do this for two reasons first and foremost to provide needed context for chat GPT and later our other AI tools and two to get some nicely formatted project documentation out of this at the end so using our basic project description chat GPT generates a better crafted and nicely formatted problem statement for us as you can see this problem St is much easier to understand and is more complete than our original informal description and this will remain in jat gpt's memory to guide it and helping us with the next tasks and our next task is generating a set of project requirements based on the problem statement here we're asking chat GPT to use the problem statement it just generated to create a document that lays out the requirements for our project we also give some constraints such as this is an MVP so keep it simple and now we have a nicely formatted set of requirements chat GPT has covered the functional requirements we provided and also offered some non-functional requirements such as performance and usability I looked these over and they seem very reasonable to me but I just thought of another feature I'd like to add to the app this is an app that runs in the user terminal to help the user out and just to make it a bit cooler the output should be colorized with different aspects of the output showing in different colors let's make that update to our requirements and here's our update just thought of another feature i' forgotten we want users to be able to make multiple requests of our app so we'll have chat GPT upd requirements to make sure the app Loops processing user request until the user opts to exit the app and we can see that chat GPT updates our requirements for looping now we often have a chosen text stack in mind maybe it's what our team knows maybe we have another reason to prefer a certain set of Technologies for our purposes I've created a very simple short list of Technology will prefer for this project python the cloud 3.5 Sonet llm and anthropics API library and I put this info into this text document now I'm going to drag this document into our chat GPT session now chat GPT is aware of our core technology preferences we'll ask it to use the problem statement and requirements which it has in its memory already along with our Target text stack to propose a technical solution to our requirements the proposed solution document provides an over overview of our Tex Tack and what the tool will do then it shows the main proposed software components and their responsibilities then it walks through the General application usage and flow and finally it wraps up by summarizing the benefits of the proposed solution this is an MVP to be completed over a 4-we period so we can probably make do with a very simple project plan chat gbt already knows what we're trying to accomplish as well as our high Lev technical approach we'll give it a bit more info on our team and let it know we work in onee Sprints let's get chat GPT to propose a project plan for us chat GPT laid out a tenative project plan based on our requirements technical approach and the guidance we gave it it's broken down task by team roll and a timeline for the 4-we period And it honored our request to have a start coding by day three now we and chat GPT have everything we need to start creating user stories we're using Jura so we'll have chat GPT start generating Jura tickets events happen and plans change so there's no need to plan in detail past the first Sprint we can always come back and ask for new user stories later here we're asking chat GPT to use all the knowledge of our project it has in memory to generate all the Jura tickets it thinks we should attack in the initial Sprint we see it generated a set of user stories for Sprint one it formatted them nicely for us and included titles descriptions acceptance criteria a set of tasks and even assigned a team member role for each ticket we have tickets for the developer for the product manager and for the tester it's great that we have all this information nicely formatted in chat GPT but we need to get this documentation into a knowledge base of some sort we'll start getting all these docs into web pages starting with our problem statement we ask chat GPT to put our problem statement into a downloadable web page for us chat GPT gives us a link we click to download our problem statement web page and there it is now we'll place this on our web server later to make it available next we'll do the same for our requirements and project plan documentation we'll end up with downloadable web pages that capture those as well and here's our requirements web page and now to generate the web page for our project plan and here's our project plan last step before we use all this great stuff to start building our out let let's get the juror tickets chat GPT created for us into a web page for now I'll just ask that the tickets assigned to the developer role be included in that document and this is the result a formatted web page with all the Sprint one jur tickets for the developer role just a note I'll be placing all the web pages we downloaded from chat GPT onto my local Dev machine and hosting them using a very simple python web server I start with this command okay we're done with chat GPT for the rest of this video from here out we'll be in our ID e actually building and testing our app I've launched vs code with an empty project and I'm going to start the AER AI coding assistant using the cloud 3.5 Sonet model it asks if we want to initialize the project forget and we say yes now the first thing we're going to do is going to let it know what we're going to provide to it to help it build our project what we're going to do is we're going to provide it the web pages for the problem statement the requirements the solution and the Jura tickets we want to just let it know that and say don't do anything just store this knowledge in your memory it says 104 we're good to go gotcha next steps so what we'll do next is we're going to use a/ web command and provide the URL to our problem statement hosted on our local python web server so now ader is going to download the contents of that page and store the contents in its working memory and it explains and summarizes that to us to let us know that it downloaded it and it understands next we're going to provide AER with the URL for our requirements web page so it's also going to consume that page it's going to add it to its working memory it confirms that it's now stored both the problem statement and our requirements in memory and summarizes our requirements very nicely for us now we'll provide AER with the web page for our design solution aer's going to download that as well add it to its context and then it's going to come back and confirm now I have your problem statement your requirements and your design solution in my working memory and ready to go the last project document we'll provide to ader is the one that contains all our developer user stories for the first Sprint once it's downloaded this AER has a complete picture of our project including our requirements our technical approach and the initial set of functionality we want to build this will save us from needing to explain all this to AER so we can just get going with building the app one thing that's often helpful in guiding coding assistance is up-to-date documentation on the Technologies you're using this is particularly true if you're using apis and Frameworks that are recent or get made major updates frequently one API we're using is anthropics API for cloud llm access here's the web page for that API that walks through various usage scenarios providing both code Snippets and explanations we'll have AER add this to its context as well I let AER know that I'm going to provide it a web page with some API information to add to its memory then I use the/ web command to have ader download that content now ader has up-to-date information on using anthropic API the CLA 3.5 signup model is fairly new at this time so to make sure AER has what it needs to Target the CLA 3.5 model I'm going to have it also add this web page I found that contains a short code snippet that uses that API to access Cloud 3.5 we tell AER about this new web page we're going to have it add to its context then we add that page to AER now AER has the knowledge it should need to start building our app we don't need to explain the details of what ader should do first it knows our requirements our text stack and our user stories so we'll just reference our first user story and tell AER to execute it as a reminder this is our first user story which only involves bootstrapping our project and installing our dependencies notice here that I instruct AER not to do anything beyond what stated in that user story AER analyzes that user story and begins generating a solution for us it explains the solution to us including the artifacts it plans to create AER then gives us instructions for the exact commands to run to install our dependencies then it asks for permission to create the new files that contain the code it generated we answer yes and AER creates those artifacts and commits them to get let's take a quick peek at the files aer's created so far we have a very simple main python script with minimal functionality we also have a doget ignore file to instruct get on the project artifacts that should ignore and a requirements.txt file that contains the libraries and versions our app will need ader gave us the commands we need to run to install our Tendencies let's go ahead and run those now first we create a new python virtual environment and then activate it then we run the PIP install command on our requirements.txt file to get our dependencies installed finally to confirm all is well we'll run the main.py script and it works as expected at this point now I happen to notice that ader missed a library dependency that was specified in our user story it's not in our requirements.txt file the story stated we needed the piper clip Library let's try getting ader to add this we tell it to review the story again for any Mis dependencies AER did pick up on one dependency will eventually need the click library but it still missed Piper clip let's give it another nudge we'll be more specific this time all right ader added our Piper clip library now to the dependencies list to get our two new libraries installed we'll need to reexecute the PIP install command for the requirements.txt file so now we're good to go let's move on to our second user story our jur ticket States the user should be prompted for the Target shell environment for which they'll request command assistance the option should be Windows command prom power shell and Bash we'll tell AER to go ahead and implement this user story notice that we're only providing the ID of the Jura ticket to AER and we're also instructing it not to generate anything beyond that ticket right now AER generates the code changes necessary to satisfy the ticket and then at the end it summarizes the changes that's made and looking at the main.py file we can see that it's using the python click library now to present three choices to the user command Powershell and Bash we'll go back to the terminal and run our main.py file again to see the changes we can see now we're being prompted for command Powershell or bash script and for a query so we're going to say hey I want to find out how to list files and it's echoing our query just as our ticket says it should so technically we satisfied the ticket however I don't know about you but I'd rather not have to type in bash command and Powershell I'd like to have a select list presented to me of my options and entered a number so let's go ahead and ask AER to fix that for us make it a little bit more user friendly and in reviewing the code changes AER just made it does look like we should should now be presented with a numbered list of options for each of the shells to choose from to test the changes we just made work we'll go and run the main.py file again and when we run that script we'll see that we're now presented with a numbered list of options for command Powershell and Bash we'll select option three for bash it's echoed back to us you selected bash and now we'll just make sure that the rest of the functionality hasn't broken we'll say we want to list files and our queries echoed back to us now our app isn't yet sending our queries to the cloud llm as you can see in this story CLI 6 adds integration with the llm so let's go ahead and have AER implement this user story next we go back to AER and just like with our previous J of tickets we'll just give the ticket ID to AER and ask it to add only the functionality for that ticket so ader now generates the code for that ticket and then summarizes the changes for us and we can see in the code some of the changes it implemented for integration with the anthropic API in the cloud 3.5 model okay let's go test out our integration with Claud we'll go back over to the terminal we'll run our main.py script now we select our shell bash in this case we're going to enter a query list the files in the current directory and reverse date order and oops we've got our first error looks like ader made a mistake with the anthropic API so to fix that we're going to copy that error go back over to AER we're going to give AER that error and ask it to try to correct it now ader makes some code updates so let's go back again and test to see if it fixed the bug we rerun the main.py script again and give it the same query as we did before oops another error this time I'm guessing it's on us because it's complaining it can't find an anthropic API key let's go ahead and see if we can get some more help from AER to fix this one we'll copy that error we'll go back over to AER terminal and we'll paste that error in and we'll ask for some help from AER after it does some analysis it comes back and says hey there's a EnV file that you need to set an anthropic API key environment variable in I'm going to go ahead and update m. AMV with my API key offscreen now we'll retest our app we'll provide the same user inputs as we did last time and this time we get a bash command that satisfies our query this means that our app is now integrated with the Claude 3.5 model now let's copy the command clog gave us and exit the app to see whether the llm gave us the right command for our query we paste the command in our terminal and that output looks correct we'll Implement one last user story together we're done with the developer stories for Sprint one so we'll choose the first developer story from Sprint two this story adds some color to our so far boring app output now our Sprint two stories are on a different web page than our Sprint one stories were we haven't yet had AER load the Sprint two stories into our context so first order of business is to have ader load that web page into its context we're going to start by informing AER what we're about to do we're going to give you the jro tickets for Sprint 2 then we'll use aers web command with the URL for the web page to have AER add the Sprint two ticket to its context and just as with the other jur tickets we ask ader to implement just that jur ticket without any other functionality and AER makes the changes for us AER summarizes the code changes it makes and it also tells us which colors it's going to use for different parts of the output now let's go over and test our application again and now we can see that our output's colorized with different parts of the output in different colors depending on the role of that particular part of the output let's have ader generate a unit test for the select shell function at the end it gives us a summary of the unit tests it created and some enhancements it's making to the main code to make the code more testable we'll go run these unit tests here's the unit test gript that AER generated we can run the tests and see they're passing of course we've only executed a portion of the Project's use cases in this video we sto development after adding color to the app's output but the developer also has a Sprint two story that allows the user to request the app to copy the generated command to the buffer and in Sprint three the developer has other stories such as optimization and later for enhanced error handling etc etc and the tester and project manager also have assigned work and even though we won't be directly addressing the use cases we've documented throughout the rest of this video stick around because there's several other cool things I want to share with you also in the description I'm going to provide the link for the GitHub repo where you can clone this project if you want to run it yourself it's a more complete project than the one that we've developed so far for instance that version of the project which you can clone has the copy command to clipboard functionality so here we can see we've run our application and it's asking us if we would like to copy it to the clipboard we'll say yes and I'll simply paste that into my terminal and you can see it's the same command that the llm generated here I'll run that command and we're good so now that represents the full functionality for our application again you can download that from GitHub repo now we can use AI to analyze our existing code for issues and improvements as well to demonstrate this I've added a function to our main.py file that's never called I'll ask AER to review our codebase to locate dead code and we can see AER finds that dead code so let's have AER go ahead and remove that for us when AER finishes we can see that that function no longer exists in our code our project needs a readme file AER can do a great job of creating one for us we ask ader to create one that describes what app does the Technologies it uses and how to run and use the app ader uses all the knowledge it has of our app to create our readme and we can see that did an outstanding job it's covered all the bases re requested app description Technologies used how it works how to set up and run the app app and how to run our unit tests but we're not quite done yet one last step we'll ask AER to generate a sequence diagram that shows the main flow between our apps components in plant uml format we tell AER to place the plant uml in a file named sequence. PML AER produces the plant uml and we can now see a file named sequence. PML in our project folder we can install a vs code extension named plant uml that will let us turn this text file into an image with this extens ition installed we can open the sequence. PML file then right click and select the preview current diagram option to view it as an image we then select the copy button to save this image as a PNG file to our workspace and just like that we have a really useful sequence diagram contained right within our codebase that we can embed into our external architecture docs or into our readme we could also generate other diagrams such as component or class using the same procedure I hope this video inspired you to explore more ways to use AI to get more done and have more fun there are other videos on this channel that show how to use AI to develop apps if you found the topics in this video interesting I think you'll find those videos enjoyable as well if you'd like to see more videos on this topic or similar topics please do let me know in the comments below and if you enjoyed this video please like And subscribe I'm Tim kitchens coding the future with you and I look forward to seeing you in future videos