“The Claude Code Desktop app is the absolute best way to build apps with AI ever, but only if you use it the right way.”
“We are going to create an army of AI agents to work for us.”
“If you learned anything at all, leave a like, subscribe, turn on notifications.”
“10 times speed increases might be under-selling what we've accomplished here.”
Alex Finn's video provides a comprehensive guide to utilizing the Claude Code Desktop app effectively, showcasing its capabilities and offering valuable insights into modern app development with AI. The structured workflow he presents can significantly benefit both novice and experienced developers seeking to streamline their processes and innovate their applications.
The Claude Code Desktop app is the absolute best way to build apps with AI ever, but only if you use it the right way. In this video, I'll cover the entire Claude Code Desktop app, give you a master workflow that will 10x the speed you produce apps with AI, even if you've never coded a day in your life. Let's get into it. So, this is the Claude Code desktop app. It is out on Mac now. Just go to claude.ai, AI download the desktop app and what you will see now is this new button right here. That is the claude code section. So this is the claw chat section where you see all your chats. This is the clawed code section and this is absolutely incredible. But there's a whole bunch of little hidden things you need to know about. What I'm going to cover is how the clawed chat, clawed code, as well as the cloud agents you can work to all tie together and how to get the most out of them inside this app, as well as all the small secrets and buttons they add that you can't really see. So, let's do this. Let's build an app out together. I'll show you my master workflow and I'll show you every single thing you can do. So, I'm going to start off in Claude Code and we are going to select the folder we're going to work in. We are going to build out a canvas app. So, if you've watched any of my videos before, you know I use this canvas app called Excal, which allows me to draw and type and add images to a canvas, which makes my organization and videos a lot more graphic and interactive. I'm just going to build my own version of this and you can do this with me. So, feel free to open up Claude Code Desktop and we'll build this together. So, I'm opening up a new folder in here and now we are good to go. We are ready to start working with Claude Code. Here is the prompt I'm going to use. So, we're in our new folder. We're in the local work tree, which means we are going to code locally just as you normally would with Claude Code. We're going to get into the cloud agents and all that, which are going to be amazing. I want to build an infinite canvas app where I can draw on it with my mouse, add text, add different shapes, change colors, add images, and use it as an infinite creative canvas. Let's use Nex.js and local storage for this and any other libraries you think are appropriate. First, let me know what libraries you think are appropriate. So, I'm going to put this prompt down below. Feel free to copy and paste it. If you follow along with me here, you'll have an awesome app you can use by yourself. First, I just wanted to know what libraries go into this infinite canvas app. These are like different technical libraries. You don't need to be technical to understand this. I'm just curious how Claude wants to approach this. I'm going to hit send. I'm going to use Opus 45 because it is the best coding model ever and it is also the same price as Sonnet 45 inside of Claude Code. So, we're getting the same limit. So, you might as well use the best model. I'm going to hit send on that. I'm going to trust this workspace and Claude Code Desktop is going to get to work. In a second, I'm going to show you some really amazing things that are only capable on Cloud Code Desktop, but it is going to get to work and it is going to first start planning this out. Here is one thing though that you need to know about Claude Code Desktop that is different than anywhere else. At the moment, there is no plan mode in Claude Code Desktop. I asked some people from Anthropic why this was. They said it's coming very, very soon. So, here is the workaround I figured out. What you're going to want to do is you see these two buttons down here, and we'll get into more depth around them in a second, but what you want to do is you actually want to open up the terminal. So what claude code desktop actually is is just a wrapper for your terminal. It literally takes your terminal, everything you do runs in it and then it just wraps it into this very nice UI inside of the claw desktop app. So what we want to do to get plan mode is open up the CLI there. I know it looks intimidating. Don't worry. Now that we're in here, we can do shift tab, shift tab. Now we're in plan mode. You also get a nice thinking mode as well, which is brand new here. You want to hit tab to turn thinking mode on. So, you're going to get a little extra juice out of your planning. And now we're just going to say, "Okay, that looks great. Please make me a plan." And I'm going to hit enter. And this is how we're going to get plan mode. This is just a temporary workaround. They'll have it native in the app soon. But if you want to use Cloud Code Desktop and you want to do plan mode, this is how you do it. Open up the CLI. Shift tab. Shift tab. We're going to get the plan here. We're going to accept it. And then we're going to transition back to the desktop app. So, we get that really nice user interface. And boom. Just like that in seconds. It really is mindblowing that Opus is significantly faster than Sonnet was. And it's 10 times smarter. It really blows my mind every time I see it. So, here's the plan. It's going to make the next.js app. It's going to install the dependencies. It's going to set up all the state management. Bunch of technical things you don't need to know about. Create the drawing tools. image upload features, everything we need. A build toolbar. I like it. Let's yes, and auto accept. And it is going to get to work. So, looks like it quickly finished V1 of the app. Let's see what this looks like here. And it looks a lot like Excalibur. Let's see if we can draw here. Yep, you can draw. Let's see if we can put rectangles. We can put rectangles. Excellent. So, now that we did that, let's switch back to the chat mode. What we're going to do is we're going to take our original prompt. I'm going to go into the chat mode. And anyone who knows me and has watched any of my videos, by the way, if this is your first video of mine, go down below, hit subscribe, turn on notifications, leave a like. I always make a co-pilot CEO with every app I'm building. Typically, what I'll have to do is I'm constantly switching back and forth between multiple windows. Claude Code, Visual Studio, the Claude Desktop app, Chat GPT app. Now, because of Claude Code desktop, we have the chat and Claude code in the same exact window, which makes this 100 times easier. So, what I'm going to do is I'm going to start a new chat in Claude. We're going to do it under Opus 45 because again, best model in the world. I'm working on a new app. It is an infinite canvas app. Here's the prompt I use with Claude code. I'm then going to go under it and I'm going to say, I want you to be my co-pilot CEO for this app. What do you think of the idea and what features would you add to it? Just going to put that in quotes and then I'm going to hit send. And we have set up our co-pilot CEO in the exact same window that we're coding in as well. So we have our entire team, all our employees in this one cloud desktop app, which is amazing. What I'm going to do here is we're going to get a bunch of ideas from the CEO. We're going to take those ideas and put it into cloud code and spin up agents on the web and spin up agents locally. This is a really sick workflow that makes everything 10 times easier that you need to be stealing. So again, number one, kick off your app and claude code. Number two, go over to the chat section and then kick off your co-pilot CEO to start developing ideas for your app. So, okay, let's go in here. What's your angle? So, we have to fi the CEO says we have to find an interesting angle with our canvas since there's a lot of other canvas apps out there. AI native canvas generate images, brainstorm and claw and auto layout ideas. That's actually a really smart idea. What if we built this out so that there's a new AI button in our canvas where we can generate images that go straight onto our canvas with like nano banana? I like that a lot. We're going to use nano banana in this. So, let's take that idea. We're going to switch back over to Claude Code. We're going to go in here and what I really want to do is I want to start spinning up cloud agents. So when you're in cloud code in the desktop app, you can you also have claude code for web built in, which means you can spin up agents in the cloud that do tasks for you on the internet while you're working locally and doing major tasks there. So I want to do some cloud tasks. The way you do this is by putting your code on GitHub. Real quick, here's how you do it. Go to github.com, sign up. If you haven't yet, set up a new repository. I'm going to call this canvas. We are going to make this private and I'm going to create the repository. We're going to take this URL. We are going to go back into cloud code for desktop. I'm going to go into that chat we just did that built out the canvas. I'm going to say, can you commit this code to GitHub, please? And this is going to allow us to start spinning up agents in the cloud to do work for us. We're going to like create an army of AI agents to work for us. I'm going to hit enter on that and Claude Code is going to get to work putting this on GitHub so we can spin up those cloud agents. So, it's going to run a bunch of commands. It's going to put your code in GitHub and we are going to be good to go. It is done. That's brilliant. Now, let's spin up some cloud agents to build out those new features we came up with with our Copilot CEO. So, I'm going to click on this dropown. We're going to go to default, which is the cloud environment. Then we're going to go in here and we're going to search for canvas. And there's our new GitHub with all our code that was just written. Now we can start spinning up cloud agents to do work for us. So I'm going to put in our prompt in this canvas app. Please implement AI functionality. I want an image generation button using nano banana that generates images for us on the campus canvas. I'm going to hit send. And now agents are being spin up on the clawed servers that are doing work for us. So while that's going, we can go back. Let's go back to our CEO, find a new feature we can implement, and we're going to start working on that locally. So, as you see here, we now have our CEO and a bunch of engineers all in one place rather than 10 different windows working with us on this app. Okay, export to PNG. I like that we can export our canvases to PNG. So, if we create a thumbnail or something, we could export that very easily. So, let's do that. Let's go back to Claude Code. We'll go to our local chat, right? So, we have our cloud chat working for us, working on the feature. Now, I can go to our local chat and I can say I want an export button. It should export the canvas to PNG for us. And I'm going to hit enter on that. And that's going to start work locally. So, we have agents in the cloud working for us. We have agents locally working for us. We have our co-pilot CEO. Couple other things that are really interesting to note here. You have our buttons down here. I showed you the CLI button before, but you also have the VS Code button here. If you click this, it opens up VS Code for you with Claude Code CLI opened up. So you can start working on your code directly. So if you want to see your code, you want it a more tangible experience inside VS Code, maybe you want to combine it with other tools, right? Maybe you want to open up other AI coding tools or use other extensions inside VS Code. You can quickly press this button and it will open up VS Code for you where exactly you left off in this workflow. One other thing I like to do here is you can rename conversations. So just for organization purposes, I like to rename this Canvas app local agent. And we're going to hit save on that. And what that's going to allow us to do is it will help us organize our agent so we know which apps they're working on, if they're local, if they're cloud, all of that makes it very, very organized. All right, so it looks like the PNG stuff is done. Let's pull this open and see and let's see if this worked here. So let's scroll over to the right. Oh, export PNG. Let's hit that. Oh, automatically downloads. Let's see what this PNG looks like. And boom, there it is. There's our canvas inside a PNG. So we have the export functionality done. See now you can start to see the power of this workflow. Let's go to our other AI agent that's working and it is building out the AI image generation functionality. So there is the power of the workflow in motion. Right now what we want to do is we can go back to our co-pilot CEO chat here and we can say okay we are currently implementing the AI image gen functionality and export functionality. Can you build us a marketing plan for this app? Right. And now our co-pilot CEO is building us a marketing plan for when we launch this. We can go on Twitter, write tweets for us, write newsletters. We have an entire marketing plan going out for us. This is the power of the workflow. 99% of people, this is how they use Claude Code. They spin up one agent, they sit there, they give it a command, it starts working, they go, they pick up their phone, they start doomcrolling, they go on Tik Tok and Instagram, maybe Twitter, they get nothing done, they come back an hour later, then give the second prompt. Not you, though. What you're going to do is you're going to use the entire power of Claude Code Desktop. You're going to spin up local agents to do big tasks. At the same time, you're going to have cloud agents build out the smaller tasks kind of as the intern. You're also going to have your co-pilot CEO working for you building out marketing, building out other ideas, road maps, things like that. While other people get one task done and doom scrolling Tik Tok all day, you have multiple developers working. You have a co-pilot CEO building out a marketing plan. And now you can come in here and as your cloud agents work, we can open up these changes. We can download these changes. Click create pro pull request and it's actually going to create the pull request. So all the code changes so that we can pull it down and review the code. If you do what I just showed you, 10 times speed increases might be underelling what we've accomplished here. Use the most out of cloud code desktop. Spin up cloud agents. Spin up local agents. And in the very same window, make sure your CEO is constantly working on marketing roadmap and other features. This is how you get the most out of Claude Code Desktop. If you learned anything at all, leave a like, subscribe, turn on notifications. All I do is create amazing videos on AI. I'm also launching the Vibe Coding Academy this Friday. Hit the weight list down below. You'll meet with me on a weekly basis. I'll help you build out your apps. It'll be awesome. I will see you in the next
Claude Code for Desktop makes building with AI so easy. Here's how to use it and my master workflow Join the Vibe Coding Academy: https://www.skool.com/vibe-coding-academy Sign up for my free newsletter: https://www.alexfinn.ai/subscribe Follow my X: https://x.com/AlexFinn My $300k/yr AI app: https://www.creatorbuddy.io/ Timestamps: 0:00 Intro 0:21 Walking through the app 1:40 First prompt 5:09 Combining chat with Claude Code 7:29 Spinning up cloud agents 11:21 Testing out our app