Master 80% of Claude Code in 26 Minutes

Thanks to Hopspot for sponsoring this video. Cloud Code is probably the most powerful AI tool available today and most people are not using it because it has the word code in it. So people think they have to be super technical or a developer to use it. And if you open it for the first time, it could be really overwhelming. Most people really can't figure out how to get started with it. And I looked up some tutorials online on cloud code. Most of them actually required coding skills. they required the computer's terminal even to install it. And again, it's going to be really intimidating if you're not technical or not a developer. So, I wanted to make this video to show you exactly how to get started with Claude Code as a beginner and exactly how to think about it the right way for your use cases because Claude Code is way different than AI chatbots like Claude or Chat GPT. It can actually create and edit files on your computer and with that you could create websites, you could create apps, you could create tools of all kind, you could also do all kinds of automation. So what exactly is claude code? I think the simplest way to think about this is think of cloud code as an AI builder that could actually create things for you. And it does that by creating and editing files, software files and you do that by just giving a prompts in plain English. So if you need a website or a landing page, this could do that. If you need a simple internal tool, dashboard to visualize data, for example, this could do that. And then on top of it all, it also connects to your data. So you could connect it to your Google Drive, Slack, and it could have a lot of context already with the files you already have on other platforms. Now, if you've heard of the concept vibe coding, which is when you type in a prompt and different apps could create things for you. Well, Claude Code has that built in, but a lot of those other software are actually using Claude in the background. So, this is kind of like going to the source, which is a vibe coding app directly from Claude. And it could do again a lot more than just vibe code things. It could do automation and a lot that I want to cover in this video. Okay. So, how exactly do you use Claude code? So on this website, this is the claude. com website and I just went over here to the claude code page here. And you could install cloud code lots of different ways. Lot of tutorials online will show you how to do this with something called VS Code. We'll actually get to this in a little bit later. You could install it using your computer terminal. Again, technical for most people. And they recently also rolled out a version of it where you could just use it on the web. Just like the claw. ai AI chatbot website. You could also do it here. But my favorite option is actually using it with this desktop app that is available for Mac and it's available for Windows here. And as part of this, you also get Claude Co-work and the regular Claude chatbot too on your desktop. So you get all three in kind of one app and it's really easy to navigate that way. And we also talk about pricing, but to get access to claude code and also claude co-work, you do need this pro plan that starts at $17 a month. So once you install the app, you'll see three different tabs on top. So the chat right here, this is claw. ai. This is the same website, the competitor to chat GPT, and you basically get to use it on your computer. You could choose different models. You could upload files to it. You could chat with it. Then you have co-work. Now co-work is sort of like an AI agent that could do things for you. And I love this. This might be my favorite AI tool so far, right next to Cloud Code. And I've made a very detailed video on how to use Cloud Cowwork that I'll link below in the description of this video, worth watching. And this tab is Cloud Code. This is where I could actually create all kinds of different things. Again, having Claude Code write the code for us in the background. I just have to type in a plain English prompt here for it to get started. Okay, let me start with a simple example, then I'll show you more complex examples. We're also going to look at what are called claw skills. We're going to look at MCPs. creating agents and all kinds of different things as we go through this beginner's video. But if I type in a prompt like this, build me a landing page for marketing agency in the hospitality niche. Now, you have a few options here. The first one is you could click this right here, this dropdown, and this will change how this works in the background. So, first it could always ask you for permission before making changes. It could auto accept edits. This is for the most part what I recommend you have it on. But if you are doing a prompt like this, you could also set up plan mode. This creates a plan before making any changes. I'm going to show you this as an example coming up right now. I'm going to leave it to accept changes. Now, you could always press the plus sign and add files and photos. One of the best ways when it comes to creating landing pages or websites is taking a screenshot of a website you already like and then upload that and then Claude will have a reference. Right? When I work with developers and designers, I kind of do the same thing. I show them what I already like so they have some

understanding of where to go and this could follow things like color, brand, fonts, all kinds of things when it's creating things. The next thing you need to do is you need to set up a folder. Now, this works on your desktop. So it will create those files sitting on your desktop. So if I press select folder, I've created a folder here called claude code tutorial. So you just create a folder on your computer and it should be based on each project. So every time you create a new project for cloud code, create a new folder so that files in that folder are only related to that project. Now you could also choose a model here. So I recommend using Opus 4. 6 six. Usually for the very first one or if you're going to use the planning mode to plan it, this will do the best job. Now, new models come out all the time. So, if you watch this later, usually OP is going to be the best model, but it's most expensive model usually, and it's going to take the most credits. Sonnet is going to be good for regular things like doing any kind of revisions. I sometimes switch it to Sonnet after the first prompt. And Haiku, I almost hardly use. I'll only use that maybe inside of chat. Right now, I'll leave it to Opus and I'll go ahead and send this out. Now, it's going to ask you to trust the workspace because again, it's going to write and read files on your computer, but again, it's only having access to that one folder right now. Now, depending on how you set up your permissions, sometimes you do have to allow it here to actually do things. Okay, so in just a few minutes, it created this really nice looking website for us with different sections that I could navigate to. And let me just kind of scroll through because if you've tried to vibe code any website, you know, most websites don't really come out as nice as what this did. I mean, this looks really great. And then I could build out other pages. Right now, the links are not working because again, I asked for just one landing page and I'll have to do some follow-up prompts to build out this full website with a contact form and things like that which I can't build. Now, if you look at the URL here, if you've done vibe coding with other apps, like let's say you use lovable for example, well, those will give you a link that is on the web already. That is the one easy benefit the vibe coding apps have that create these type of websites and apps. Well, this is sitting on my desktop. That's why it looks like this. Now, if I show you the file, this folder right here is where that file is. It's a HTML file sitting on that folder. Now, here's the website here. I'm looking at it on Chrome, but again, it's just sitting on my desktop right now. It's not published on the web. If I decide to publish it, I'll have to do some other steps here that I'll show you towards the end of the video. So, hopefully you could already see what Cloud Code is capable of. And I have ton of more examples here, and I want to cover more advanced techniques, including how to publish things that you create on your desktop on the web, too. But I also wanted to share a free resource to help you get a lot more out of Claude Code. HubSpot created a guide called Cloud Code for Marketing, which includes four real marketing workflows and 12 prompts designed to help marketers actually build things with Cloud Code. You'll find readyto-use prompts that you could run inside of Cloud Code to create things like landing pages like my example, lead magnets, competitor research, and full marketing campaigns. And it's definitely not just a prompt list. These are entire workflows to show you how to combine prompts with cloud code so you could go from your idea to a working marketing asset much faster. My favorite section is workflow number two for creating lead magnets. It gives you the exact prompt for researching competitor lead magnets and then building your own lead magnet and landing page copy using claude code. You could grab your free copy using the link in the description below. And thanks for HubSpot for sponsoring this video and for creating this Claude resource. it fits perfectly for what we're covering in this video. Now, before I show you the next prompt, I also want to show you how to revise something you've already created because usually the very first prompt is not going to give you a perfectly working website or app or automation. So, right here, I'm going to ask it to make a change. Right now, maybe the background could actually be a little bit blurry, so the text pops a little bit more. I'm going to ask it to blur the top background here in the hero section. A lot of times when I'm doing revisions here, I'll use a lower model here to keep the credits down. And this is a really easy one. So cloth sonnet should be able to handle that. I don't have to use opus. I typically use opz when it's more challenging or when it's the very first prompt and it's helping me plan or create the first version. Okay. And just like that is blurred the background. Yeah, this looks a lot nicer. The other thing you have that you could do is couple of things on top. You could check this in different devices and see how it looks. So the desktop version is what it creates by default. And you could also select elements. So for example, if I wanted to make changes to any specific part of this, I could select it. So for example, I'll select

it. And you could see it's brought in just that section here. And I'm going to ask it to rewrite it and get the point across in half the length. And I'm going to ask it to remove this scroll text here that's interfering with this button right here. And it should be able to remove that. Yep, it removed that. And now I got a pretty good-look website. So this is the first concept I really wanted to get across. When you're using cloud code or really any other vibe coding app, you're not trying to get everything perfect in the very first prompt. It usually requires a little bit of iteration. So it's building through iteration. You ask for a revision. You look at the output here. you make any changes with a follow-up prompt or selecting a section here and you keep refining it till you get what you want. And that's really one of the best ways to get started with VIP coding is especially with clawed code. So creating a landing page or a website is how I usually like to tell people as their very first prompt just to get comfortable with using claw code if they're completely new to it. Okay. Now for the second example, let me actually show you how to build little mini apps. I have ton of apps that I use internally for my team. Couple I've made public too. But I'm going to go to the chat mode here and I'm going to ask Claude to give me the prompt for claude code. Create a prompt for claude code is for a dashboard where I could compare the top 20 AI tools. Obviously, the more context you give it here, the better. I just want to show you even without a lot of context. Claude is going to give you a very comprehensive prompt here. And I'm just using the sonnet model here. Now, here's the prompt I got. It's got a little bit of technical details here. It has some design details. And I'm going to go ahead and copy this. I'll come back to claude code. Now, we want to create a new project. So, on this new account, I'll create a new project here. And we'll go ahead and paste this. And remember, we want to change the folder. So, we want to choose a different folder and create a new one. And this time, I'm going to show you the plan mode here just to show you what that looks like here. Now, when you use the planning mode here, Claude will actually create a super detailed plan. It'll have things about colors. You'll have things about animations, the dashboard architecture, everything that it's going to do. Some of it is going to be technical, but worth looking at just to kind of get an idea of what it's going to do. Sometimes you could pick up on things that you may not want, maybe the colors you don't want, and you could follow that up with a revision. But right now, I'm just going to say approve this plan and start coding. But that is one benefit of using the planning mode. It will lay out the entire plan both in plain English and also the technical aspects of it. Okay, we got ourselves a working dashboard over here and let me go ahead and stretch this out and it has different categories here. And the reason why cloud code actually may take longer than other vibe coding apps if you ever used other ones is because it tests its own work here. So it takes a screenshot, it does some testing. actually was testing the different uh search options, the filtering options down here. So, it has three different things that is selected. I could go ahead and compare them. It has a sideby-side comparison. So, pretty good for our first prompt to get our top 20 AI tools all in one place in this dashboard. Now, let me show you the files it created in the folder. So, the first example was just an index. html. It was a simple landing page. This one is a full app. So, it has a ton more files here that is created. Again, I've not looked at any code so far. This is just what is created for us without us doing any type of coding. Right? We just typed in the prompt and it created that. It tested that. Now, we have a version that's ready to go. Let's see if it's mobile optimized. Yeah, it looks pretty good on mobile, too. Now, for the next example, I want to show you how to create a real working app for my internal team here. And I want to introduce you to something called claude. md. Now this is going to be a file that is going to give a lot of context for our business here to claude. One tip that has helped me get a lot of work done with any type of AI tool is to create a document that has everything related to my business and two ways to do it. If you already use chat GPT or Gemini or Claude the chat bots, I recommend you ask those to create a document for you like a PDF with everything that it knows about your business. Now, it will already do that from its memory if you've been using it a long time. The other option you have is you could just jump into Claude here and you just simply ask it to interview you about your business and then turn that into a document. This is a great way to create this document if you don't have it already. Then you just tell it to create a clawed MD file. Now MD stands for markdown and is similar to let's say like a PDF or a HTML file except it's designed this markdown files are designed to work very well with applications like clawed code. And then

this clawed code document, this claw. md file will sit at the project level or at the account level of any project you create where it needs business context about your business. Okay. So once you get that claw. md file again from the interview or from other chatbots like chatgpt, I actually got mine from chatgpt. Move that document, download it from the chatbot and move it into a new folder for the new app that you're going to create. Each app will have claw. md with the context that you want about that app. In this case, it's general content about my business. And they basically this MD file is a text file, but it has these markdowns, these little hashtags to talk about the different sections, the core positioning. So, this is going to tell it all about our team here and about our company in general and everything that we cover there. And then again I went to claw chat here and I asked it to create a prompt for what I was trying to create which is fetch the latest AI news practical AI news and turn that into content ideas content pillars for our business and use the context from claude. md. This is our business context that I created. So this is going to be what I'm going to copy and paste into claude code. Again make sure you change the folder here to the new folder here. I'll press autoac accept edits and we'll go ahead and send this out this time. And while that's going to work, I want to just talk about prompting for beginners. When it comes to prompting cloud code specifically, your prompt doesn't actually have to be super detailed and doesn't need to be technical at all. What I did was every time I got my prompt directly from chat by just having a back and forth or you could use the planning mode. You could do it in cloud code, too. I just prefer to do it with claw chat. But these are the few things that you got to keep in mind if you want to create something that actually looks good in the first time. And it just has really five parts to it. What do you want to build? Who is it for? What it should do? What it should look like? And what you want to change next, which comes usually in the iteration in the follow-up prompt. And that's it. That's typically the structure of any prompt you give to Claude Code. Okay, here is the app that has created for us here. So, it's pulled in the latest AI news here from different sources that it picked automatically for us. and tell it what sources to use. But it looks like it's used things like TechCrunch over here. And it's given us ideas here for what a YouTube title could look like, what a social post could look like, even things for our newsletter. And he also has those in different categories if I want to specifically look at them through there. Just off one prompt has created something that I could share with my team. And I'll show you how to publish this here at the end of the video, too. Now, let me show you clot skills and how to customize your claude here. So if you click on customize on the left panel, there are a few different things you could do here. You could connect this to your tools. You could give it new skills and you could also use what are called plugins. Now connecting to tools is pretty straightforward. You just connect it to other apps. So if you want claw to work with Slack, for example, or to Figma, things like this, you could just use these connectors. And again, I'm going to cover this in more advanced in-depth videos. This is a general broad overview of what claude code is. But skills, I want to show you exactly how this works. Now, skills are actually different MD files that tell Claude Code how to do something. They're almost like custom instructions for different things that are very specific. This skill is actually created by Anthropic, and this is what it tells it to do. The descriptions on top, and you'll see some off-the-shelf skills here that they already have by default, but you could actually give it different skills. If you press the plus sign here, you could create with Claude, you could create your own skills. I have a video coming up in exactly how to create skills from scratch. You could write it in a set of instructions or you could upload it. But if you use Claude code, you could actually just take it from what are marketplaces that are all designed to give you different skills that you could just copy and paste. So here's a website, for example, that I'll link in the description below this video. This one has hundreds of different skills here for all kinds of different categories and some are for development, some are for marketing, for writing. So you could see if any of these skills make sense. So let's say this brainstorming one, I could click on it here and this is basically the markdown file. So I could copy this, create a markdown file or I could just copy it from here and then tell Claude code to install that skill for me and it will install it. Now it will install it usually at the local level. So, if you're creating a project, it will install it to that project. But you could also ask it to install it at your account level if it's something you use all the time. I usually do this per project because most of my projects don't need a skill unless it's one that Claude already has that needs it at the account level. So, you install these again per project. So, as you're having a chat, as you're building a project, just say add the skill. Again, I have an entirely new video coming up all about skills and installing skills and using skills and creating skills. So I'll save that for later. But skills will unlock

new capabilities for claude and claude code and even cloud code work. Then you also have plugins. So plugins actually work similar to skills but they're ready to use workflows here and you could customize these two. So these are the ones by Anthropic for example and you could install these two on top of installing skills and they kind of go hand in hand. So front-end design is actually a good one. This is already created by Anthropic, but you can install it. So, this is helpful if you want to create different landing pages, different dashboards, things like that. This has UI and UX skills here to make your designs even better. So, I recommend looking at these connectors, looking at these skills, looking at these plugins, and installed a few here. Especially if you want to connect things and do automations, that's going to help you automate things in Gmail or your Google calendar, your Google Drive. You could bring things into it and those are connectors here that I recommend you connect. And GitHub is more for developers. But if you want to take your code from cloud code and put it on the web, that will give you version control and it makes it really easy. Almost every developer puts their code on GitHub here using this connector. Now I had also mentioned VS Code. So let me show you what VS Code is. Let me go to their website. So VS Code is a code editor. So this is what it ends up looking like, but it's another way to use clawed code. A lot of people that are more advanced prefer to use it this way because you could easily see the actual code, but you could also see the folder structure, all the different files, jump between them. This is again much more advanced than for a beginner. But I wanted to show you what this ends up looking like once you do install the app. You get this little icon down here, open in VS Code. So if I click on this, it looks like this. But you could see I could see the folder structure. That's the same folder I have on my desktop. I showed you that already. But it shows you the files this way. So you could quickly jump between the different files is created for you. This way you could view things a little bit easier. But again, it's much more advanced. But to install it here, all you have to do is go to this tab right over here. And then you look for Claude Code. It's an extension. And then you just go ahead and install that. And then it will appear on your claude code as that little icon I showed you, which is this little icon to open in VS Code. And you could do the same thing there. You just use claude code in VS Code. So back in VS Code, you'll see this little icon. If you open that, you get claude code like this. So you'll chat with it same way as before. But again, you'll see your folder structure. You'll see the code. As you get more advanced, you may want to look at what it's doing under the hood. And that is another way most professional end up using cloud code is through VS code. Now I'm going to show you how to actually publish something you created with cloud code. It's a great automation and internal tool. So you could use this without publishing anything but it's sitting on your computer so it's hard to share it with my team. The one example I showed you is what I created for my team. Well, if you come to the customize section here, you need to first connect it to something called GitHub, which was one of the options here. I've already connected it. If you don't have a GitHub account, this is just a website where your code then gets published to the web. You could save it privately, too. So, it doesn't have to be public information. And then the GitHub code then could be deployed with a link with another tool. So, it's going to take a couple of tools. Now, other vibe coding apps really do this by default, but this will take you a couple of steps here with this version. Okay. Then I go back to any claw code project that I want to publish online. And I'm going to ask you to post this to GitHub. This is going to just push the code here from what's sitting on my computer to the GitHub that I connected it with, which is the first step. So, connect it to your GitHub or create a new one. Once it has that connection, you could just ask Cloud Code to push that code out on the web here. Then it's going to ask you to kind of authenticate that so it's able to do it. And then it's going to give you a link here. And if you click this link, it's already uploaded that project which only had a couple of different files. So it was a pretty quick upload. And now all I have to do is take the link here. So it's created a GitHub link for us. And then I'll use another app. This is called Versel at versel. com. This is probably the easiest way to deploy anything that you create with cloud code. But it still has to sit on GitHub and then this will help you deploy it. So press start deploying. It asks you to create an account here. It's going to bring you to this page and I just have to paste that URL over here and press deploy. And then it's going to take that code from GitHub which came from cloud co-work and then put it on the web for us. And I could press continue to dashboard. And then it's going to bring us to this link here which is a web link. Now, this is not something sitting on my desktop, but it did take a couple of different steps to get it there, but now I could give this link to my team for this information or customize it from there. So, hopefully

you have a much better idea at this point of what cloud code is, how to actually use it if you're a beginner. Hopefully, I give you a step-by-step guide here and not made it too complicated. But always start small, maybe with a simple tool or a simple website. Use the plan mode here. Use claw chat to get information and prompts. Give it a lot of context. Create that. claw. md so it has information about your business that you could create different projects with. Make sure you preview everything, iterate, and then publish if you want to share it publicly or with your teammates or just keep it private for your own automation and internal tools. I'm also working on a very comprehensive claude course for our platform. Our platform is called Skillap. There we have all kinds of different courses on the top AI tools. Claude is one. you haven't made a course about, but now with Claude Co-work, one of my favorites with Cloud Code, one of the best AI tools of all time, we're working on a really comprehensive course. You'll get access to that when it gets released. But if you subscribe right now, you also get access to everything and all our new courses that come out all the time, and he has a free 7-day trial. So, you'll get access to over 20 courses right now. You'll have access to our community, our resources, our discounted deals with different AI toolmakers. All that for one low subscription price that you could pay monthly and cancel anytime. I'll put a link in the description to that trial along with everything else I mentioned in the video. And I'll have more videos on claude code, on cloud code work, on cloud skills coming up on YouTube as well. Thanks for watching. I'll see you next time.