#2294 He Claude Code: Build Me a YouTube Replacement

0:28Hey there, Freedom Fighters. My name is Andrew Warner. I'm the founder of Mixergy where I interview be gone and so did he. And just when he was feeling like it was the end, he decided to have Claude Code build him a new video platform and the freaking thing just worked out. I didn't watch him, but I saw on Twitter as he was basically live tweeting his process. Anyway, I asked him how he used Claude Code and he said, you want to see it? And I said, hell yeah. So he did a screen share with me, which is what you're about to listen to. And he showed me step-by-step how he did it. Now, listening to a screen share is not that interesting, right?

1:04So why don't you come over to my new YouTube channel where I've got a collection of these types of show and tell videos and see it. All you have to do is go to thenextnewthing.ai slash YouTube. That's thenextnewthing.ai slash YouTube and you'll see it. And of course, if you're someone who just prefers to stick with audio, I think we do a good job describing what's on the screen, but I'll let you decide. And if you ever want to come back to YouTube, remember my new YouTube channel. It's the next new thing dot AI slash YouTube. And this interview, like the others in this AI series are presented by Zapier, the AI automation company that I've used for so long that I'm literally their first customer.

1:51All right, let's get to it. Last year we did over 2 million. Then YouTube comes in and says what to you? They essentially labeled our content as quote unquote, dangerous content. And I realized that my channel could be deleted and I actually wouldn't even be able to get my videos. And I basically rebuilt a small version of YouTube in an hour, a couple hours, the early versions of it. We'll do it from scratch and you can watch this video or this tutorial here and you could do it yourself. I'm gonna show you all the prompts. I'm gonna show you everything. Pat Walls is the founder of Starter Story, a platform where founders share how they bootstrap from zero to 100K per month.

2:31Presented by Zapier, the AI automation company. And he's got a killer YouTube channel that I've been following for a long time. And then he said on X that he was kind of booted off of YouTube and that he was vibe coding a replacement for YouTube. And it looked so beautiful that I wanted to find out how he did. Don't you think it looked beautiful? You laughing at me when I say that? Well, I appreciate that. I'm not a design expert by any means. I'm just sort of a scrappy programmer that uses Tailwind design patterns, so nothing special. It looked good, and it was smart. It got me hooked into watching a video, and then it said if you want to watch more, then you need to enter your contact information, like all the stuff that a smart marketer would put into it.

3:11But here's the beauty of it. I watched you do it on Twitter. Boom, boom, boom, boom, boom. You published, and you came out with it, and I wanted to find out how you did it. You said, Andrew, it's actually not as hard as people think. I can walk people through creating using AI tools. That's what we're going to do here today. Before we get into it, you always ask your people how much revenue they make. How much money are you making, let's say, with the YouTube channel? Then we talk about the business in general. You know, we're a pretty big channel in our space, and we probably do 1.5 to 2 million views per month.

3:40But as far as just the AdSense, that's the revenue that Google pays you just by showing ads. I think we're doing somewhere between$10 ,000 to$15 ,000 a month. But really that is just a small portion of our total revenue as a business. YouTube I see is like one, it's a way that people can find out about Starter Story. And then we have our own products. Like we have Starter Story Build, which is our education platform, which teaches you how to build products and apps with AI. And then we also have our Starter Story subscription product, which has our ideas database and things like that. So as a total business, that revenue really only makes up 5 % to 10 % of the total revenue of the business.

4:21I have to do the exact numbers on it. Meaning you're 10 % to 20x of what you had said earlier? Yeah. Maybe 10x, I think, would be of that. Yeah. $150K per month, maybe a little bit more than that. Last year we did over$2 million. So around there, yeah. Yeah, 5 % to 10%. But, you know, it's up and down. But, yeah. Okay. But the model is people discover you on TikTok. They discover you on YouTube. They come in and they watch this stuff. And then they say, I need an idea. They come in. They subscribe to the product that helps them learn and come up with ideas. Say, I need to know how to build. They come and subscribe to the service where you teach them how to do it.

5:02That's the model. And so then YouTube comes in and says what to you? Well, they say that we have dangerous content. I believe they have some sort of automated moderation system. And I know that Google as a whole is a very lean business. They like to automate everything. So I think they are going through a project right now over there where they are trying to figure out how to moderate content in this crazy AI faceless automated world. And they essentially labeled our content, some of our past content in our library as quote unquote dangerous content. and that is a policy that they have on their website of what entails dangerous content.

5:43And if you get enough warnings or strikes on your channel, they can delete the whole thing and then this whole thing that you built over years and feel like you own can just be obliterated overnight and vanish. And my understanding is that they probably made a mistake. They've undone it. And what they did though was put a fear in you that this could happen and also excitement in you that, you know what, maybe I could solve it. And so I watched you say, I'm going to build, what did you build? Um, what did you build it in? And then what are you going to show us when you do a screen share? Yep. Well, I was, I have, we had gotten the warnings of the strikes on the channel.

6:18It was like, it happened on like a Friday or something like that. And I was sitting and it just like, it just overtook me. The stress just overtook me. I'd like, I couldn't think about anything else. I've, I was at dinner with my wife and I got this email and then, you know, just like, Oh my God, like the whole business can vanish tomorrow. And it is like this immense, I don't know, you almost feel like it's like this, this physical feeling of like, wow, like everything I just built could be gone. So I was sitting there that weekend, going through the going through the emotions of like, what could happen?

6:49What do I need to do? And then I sort of got inspired. One piece of it, this rollercoaster ups and downs is I had this up of like, well, I could just rebuild it myself. and you know I have a software engineering background however I'm a really really bad software engineer so I'm going to be showing you guys today how we could build we can build it in just a few minutes we can rebuild YouTube but I said screw it I'm sitting here I got nothing better to do and I'm worried that everything is going to fall apart let's just distract myself by building something cool and I basically rebuilt a small version of YouTube in an hour a couple hours the early versions of it.

7:24And I can show you how it looks on the actual website right now. And we're going to do a demo, hopefully to rebuilding it. Let's see the finished product first. And then let's walk through how people are going to be able to do this quickly by just following what you're doing. Yep. I will show you first what we have. You can see something here that kind of looks like YouTube, you know, it has a thumbnail, it has views. And it has when it was uploaded, We can filter by how much revenue businesses are making and that sort of thing. I got a little description here and you can even click on a specific chapter and it'll jump to that spot.

8:00You can go to the transcript and you can see I got this automated transcripts thing going on. This basically costs nothing. There's a couple little streaming elements that I pay for, five bucks a month or something like that. But I was able to build this in essentially a couple hours. Let's go into how to do this. We'll do it from scratch. And you can watch this video or this tutorial here, and you could do it yourself. Okay, let's do it. Anyone can just go to code.clawed.com to get it. And what you're going to want to do is open your terminal. A terminal is a command line interface that allows you to interface with your computer.

8:36Typically, you click around and be able to do cool stuff. Terminal, you type things, and it does things for you. You should have terminal on your Mac. I use something called iTerm2. It's basically the same thing with a different skin on it. So you can sit right here in the terminal. Let's just make that clean. I'm going to maybe we'll even make it bigger just to show you what to do. Yep. And we're going to use a tool called Claude Code. I believe there's a free version of it, but I'm a big fan of I pay, I think,$100 a month or$200 a month for Claude Code. It does sound like a lot of money, but when you realize what it can do, it can replace the work of developers, designers.

9:15and an entire team of people for a hundred bucks a month and you can build anything you want pretty much i think that's probably worth it but i think there's a free version you can try i'm not going to go through the process of installing it because it's already installed on my computer so i'm just going to go through this though but before you do anything else hit i think it's command and then the plus sign a couple of times then we'll see the font a lot bigger oh yeah absolutely there you go yeah yeah yeah okay great am i supposed to type claude i just can't remember what to actually type so let's go to google and let's search that let's say like uh i don't know uh let's go to yeah how to use claude code um install the cli and this is this is what programmers do and like uh some people think like oh you're such a genius because you're a programmer no you just google stuff and now ai will even give you more of the answer so i'm using the ai overview here and i'm trying to see like okay how do i actually start it i think you just type claude to start right okay there's this one thing that i like to do that i would not recommend anyone watching this do but i'm going to go to the ai mode here and um ask it about one feature that i know i like to use called uh dangerous skip of permissions this is just going to make things go faster for us because claude likes to keep asking you can i do this and then can i do that can i do this can i do that yeah Right, right.

10:33So anyone watching this, I'm not endorsing to use that unless you know what you're doing. You don't have to use it, but we'll use it just to be faster so I can sort of talk as I go. Fair. I think that's right. Cool. So I'm just going to paste that right there, and it should start. Okay, so now I have Claude code open here. I can type things in here, and basically it will create apps for me. It'll create code for me. So we're going to create this YouTube thing. the first thing that I'm going to do is I'm just going to create a folder that will enclose all of my uh well I have my app in it so I'm just going to say hey in my code directory this is a spot and I can show you here just so that everything makes perfect sense move this over

11:24um in my directory i have here i have starter story and a couple other random apps that i've built i'm gonna say hey uh can you create a new folder called what are we gonna call our app um f youtube f youtube f you tube uh let's just have a try that this is like the most basic thing let's just you could just ask it something just like chat gpt or you could have it do something basic on your computer this is cool because it will do anything you essentially want this is kind of just one of the crazy ideas of ai is it could take over your computer and do stuff so now we got F YouTube in there. So let's actually, what's that?

12:17Fun YouTube, right? Fun YouTube. Yeah, we're going to call it fun YouTube. Let's actually start the app. And this is actually one thing that maybe is a little inside baseball on. One thing I recommend if you're new to AI coding is to use a proven framework that real coders use that is, you know, has a lot of documentation online so that when you ask it to do things, it's going to do it in its little opinionated way, which will just make your life easier. So when you ask it, can you add this feature or can you add, can you fix this bug? It's going to be looking at all the millions of documentation and code online and fix it in an efficient way.

12:54So there's something called Next.js, which is just a framework. I don't even use it for myself, but I wanted to prove that anybody can do this. So we'll use that one. It's very popular. And we'll use that. I'm going to say, I want to build a simple app with next JS. Can you put it in that directory for me and create a basic app and then start it up? So I have no idea this is going to work.

13:33but if it does it just shows how primal your prompts can really be like i i did have that little inside baseball on the next js thing but other than that i just really told it to just create an app essentially what it does is it gives you the framework for the front end design and then also for how all the data is going to be stored so you don't have to you don't have to make those decisions for it yeah okay exactly think of it like thousands and thousands of programmers have like argued and right updated code and like made it perfect so that it's really easy to create apps you're basically like channeling all that work and effort that they put into these open source platforms and you're like standing on the shoulders of giants as i like to say yeah so it'll make your life easier you don't even need to know why just trust me bro okay so it started the server here your next js app is ready and it started the server so let's go and actually uh try it here it's going to do localhost 3001 here we go this is our app it just says next.js uh you know i could deploy it probably we probably won't do that in this one because I don't have Vercel, but you could.

14:55That part's easy. Let's now, sometimes I think like, you could just ask it like, oh, let's just go recreate YouTube. I think that's probably the wrong way. I think maybe in like a year, it'll be able to do that. But right now you still got to kind of approach it like a programmer. And my sort of unique maybe skill that I can share is that I've been a programmer, a bad programmer. So I kind of know how to think a little bit, but also I build, you know, businesses. So I sort of have that sort of some of those trade-offs there of how to do that. So let's, one thing, one cool thing you can do is what I would do here is I'm just thinking of what do I want like to be the first part of my app?

15:35And when I think about that, I go, well, I actually want the YouTube show page, like just the video page. I want to, that's going to be the core thing and most people are going to be watching a video. So that's where I want to start. One feature, one page, not the whole app, not all the features, one feature, one page, that's it. So what you can do is, what I would do is I would go to YouTube. I would go to, you want to go to Mixergy? You want to do something Starter Story? Let's go to yours. Okay, let's go to Starter Story. And let's go to our most recent video. Why not? and what I'm going to do here is maybe I'll zoom out a little bit on the page.

16:15No, that didn't work. I'm just going to take a screenshot and I'm going to use command, control, shift, four. That's a little inside baseball too. And I'm going to copy the UI and that's it. And if I do a command, if I'm on a Mac, I do a command, control, shift, four. I think that's what it is. I can paste it here. and so i have to do ctrl v and you can see image number one is there i'm gonna say like here is the youtube interface i want you to recreate this on the page but instead of pixel perfect do it with place holder components so i can see the design and then one by one add the features i want like video embed and you know recommended videos or whatever this is i'm trying to like approach it like i'm almost like drawing it on a piece of paper.

17:29Like I had a piece of paper in front of me and I'm drawing boxes. I like the logic of it. I like watching how you think this through. Essentially what you're saying is give me all the elements and just kind of name them and let me fill them in with what I want. Yep, exactly. Cause I don't want it to recreate YouTube. Exactly. I might want to change one thing. I may want to put something cool on the right side sidebar instead of recommended videos. And I like to take things step by step. I don't want it to do it all for me. I like to sort of like build and iterate as I go. And I think that's how someone who's building like a real product will do things.

18:04But there's no right or wrong way to do it. I think this way is like a fun way to be a little intentional about how you build it. So it's going to take a little time here. So what you're probably doing is just going to keep going back and forth between the browser to see what it made and the terminal to see what you're asking for. I usually do like two screens. So I use like the max spaces. So I'll go back and forth. Yeah, I noticed you do that. Okay. That's what some people do. You know, there's a lot of ways that people do it, but it's already done here. So what I'm doing here, as you can see, is I'm just going back and forth between terminal and here.

18:43So you can even see it behind. So let's go back to our app and let's reload and see what happened. So there it is. There it is. That's pretty good. Yeah. I thought it was going to do something a little bit more. You never know what you're going to get with AI. I thought it was going to do something a little bit more like templates. Placesholders, yes. Placesholders, but you didn't do that. But it doesn't look bad, right? Nothing works, obviously. I can play this. Nothing actually works. I click this, but it created what I like about this, even though it didn't do exactly what I wanted. The search is there, but nothing actually works when you search it.

19:19So we're going to go through. We're going to build these features. as long as much time as we have today and actually build build out maybe one or two things or however long you want to go for let's pick a couple of things to do and and get rid of the rest but before you even do that take me into finder and just see what it actually put in there because essentially what it's doing is it's listening to your request and in that folder that you did earlier it's putting in all the um yep you have a file that do that what i said earlier uh is that I didn't want to look at any code. Like I think this is, uh-huh.

19:53I basically said like, we're not even going to look at code. Like obviously it's showing code here, but I'm not actually looking at an editing code. So yes, it is putting everything. Typically it's not the way that I would recommend doing things, but I just want to show you that you don't need to look at code to do this. But yes, if you go here and you look at all these packages and all this code, it's editing all these code files. And if you're building something truly, you want to be able to look at the files and edit them. For this demo, I want to prove that you don't need to do it. You don't need to be able to read code.

20:25But yes, if you were to go in here and you were to go to... See, I don't even know that much about how Next.js works. You could see that. Oh, I didn't even mean for you to have to open that up. But yes, I see. Yeah, it's created all those files and it's editing all those files. Every time I tell it to do something, it's making edits and making changes. And then the images are being put into the folders for you. uh the images i'm not sure how the images work specifically for this app um it probably just find her for a second and just take a look at where the images are yep um but i could prompt it and say hey use uh you know use an image here and you can give it to it and you can tell it okay all right i say you go find andrew from mixer g's face online it'll search for that and it can put your your face right in there if you wanted to you know it could do anything which is cool.

21:17Do you have a sense of what you want to do next or do you want me to suggest something for what this page could look like? Sure. I mean, if you want, we can actually put the video in there to show that, you know, like the most important thing about YouTube is having an actual video that is playing, right? Because right now there's no video. It's just a placeholder, which is cool. So if you think about this as like a canvas, this is our canvas. Let's go and work on this part of the canvas right here, which is the video. And once that works, then we can do another, then maybe you can tell me another feature to add.

21:48Okay. Let's do it. Okay. So here's another inside baseball tip is that, yeah, we could tell it to go and rebuild streaming and quality and compression and encoding and all these things. But no, when you look at any successful app, they use something called a wrapper. And whether it's an AI app that's using chat GPT as a wrapper, like Claude Code is technically a wrapper for an LLM. We want to use a wrapper for streaming. So there's an app that we use called bunny.net and think of it as like AWS for YouTube, kind of. It's a place that's going to host our videos. It's going to manage streaming. It's going to manage compression.

22:31And we're going to interface with it through an API. And that's where everything will host. So we don't have to handle that nasty stuff that we're trying to operate a business. That's what we're going to do. So you could ask it to go and rebuild YouTube, you know, at the bare metal, but you don't want to do that. So let's prompt it. Let's say, okay, okay, I want to get the video working. And I am using bunny.net for streaming. Can you go online and see how, maybe I want to say like just go online and, check out the documentation for this and then implement a video and then i would say like get the video player working with these credentials and just to save us time for this demo i have my bunny credentials right here um this is like how it you know the keys for the API and stuff like that.

23:41Do you need me to black that out before we publish? No, it should be fine. I'll let you know. Um, I can, I should be able to just delete it and then it's totally fine, but I will let you know that. Then, uh, one quick thing I'm going to also have it do is just take the, um, an example video that I have here. Um, please, please use this video for the demo let's see if this works that's pretty kind of

24:17not overly specific on how to do it i just said figure it out and let's see if it figures out this one might take a little bit of time are you typing usually or do you do audio dictation You know, I just heard about this awesome tool called, I typically type when I'm programming. But I just heard about this awesome tool called, I think it was called Whisper Notes or something like that. I'm not sure the exact name. Because I don't like the dictation on Mac. I don't think it's very good. It sucks. Yeah. You know what? I've been using, I had to look it up, Voice Inc. Because it's still all run on my desktop, it's super fast.

24:54and because it's on my desktop, they just charge me once and never again. It's not a subscription. Right, right. But I love dictation. Yeah, I watch something that's fast, and I've been hearing about a couple that are good. I'm going to get into that soon. I use dictation all the time, just not necessarily for programming, but I should. Okay, it says it's already done, so that was pretty fast. Let's take a look. Let's see. And it works. There it is. Yeah. It works, right? Right. Um, so that was way easier than I thought. Obviously I had already done some of the work by getting the keys ready and everything, but, um, that's the power of using a wrapper or, you know, like a third party API.

25:36You'll use it for lots of things, like just to even have login working for your app. A lot of people use something called Firebase. Uh, so that's a little kind of inside baseball for anytime you're building stuff, don't reinvent the wheel. How do you find all these how do you know that obviously we see everyone using firebase but if you were looking for video provider i never heard of bunny.net if you're looking for something else how do you find all these tools right well uh i think llms are pretty good i was like going i asked twitter because i didn't really know a whole lot about this space and i had a few options and i ran those through llms and i i said like what do you think i should use based on like my preferences i said Like, I don't really want to have to deal with encoding.

26:18And it was like, you should use Bunny. And although I didn't really like how their website looked, it kind of turned me off a little bit. I trusted the LLM there. And I'm, like, very happy with that decision now. It's so good. So I try to trust AI more than my own vibes sometimes. Yeah, it's weird. When I don't hear of a site and still on the bottom of their site, their copyright is out of date. They haven't changed it yet. It makes me wonder, are they really paying attention to the site? But it's working for you. Okay, I get it. Why don't we do this? Do you want to just eliminate everything from the page except maybe a box on the right?

26:53I don't know if it'll do a transcription service, but how about chapters? Or is there something else that we want to do? Yeah, yeah. We could try chapters. That could be fun. Let's do it. All right. Where do you want to put the chapters? How about where on the right side, like you did it in place of the recommended videos? The recommended videos. Okay. So, yeah, this would be kind of a cool way to show it. I'm going to take another screenshot again and just remind the app, hey, this is what it looks like. Because sometimes these apps, they're only seeing code. They're not seeing visuals. So I'm going to take a screenshot here.

27:27I'm going to say, hey, here's what it looks like right now. Great job. Sometimes. You are very kind to it. you've said please multiple times you're showing appreciation you're nicer than i am to people in my life i think that sam altman one time said that even if you add a nice little thing at the end it costs them all this they're spending billions just because people are being nice random but okay let's talk about the right sidebar i don't want recommended videos videos. I want, uh, chapter timestamps. And now here's the thing you also have to think about too, is like, well, I don't actually have the timestamps and I probably don't want it to like go and like transcribe the video and find them.

28:23Cause that would just take too long. I'm just going to, because I just want to get it working first. I'm going to say just to make them up. Yeah. just make them up and say, I don't have the actual chapters on me right now. So just make them up for this, you know, for this exercise. And so we can make them look nice before what's called we figure out state, state meaning database. Okay. And maybe another thing we can do too is like, let's, let's actually, what do we want our chapters to look like? We don't really know. So let's go and just go to google.com and search inspiration for timestamp chapters.