Building a No Code STARTUP with AI in 1 Hour! (DeepSearch + Lovable)

0:00 in this video I'm setting myself a time 0:02 limit of 1 hour to build out a full 0:05 startup using a no code platform let's 0:07 get straight into it all righty so I'm 0:10 going to go to my timer we're setting 0:13 this for 1 hour and so you can see in 0:16 the top corner there we've got 1 hour to 0:18 build out a startup so what I'm going to 0:19 do is I'm going to go to deep search on 0:22 grock and I'm going to use Aqua voice I 0:26 want to build out a startup that I can 0:29 build in about an hour 0:30 so something simple it's something I 0:32 think that could be quite interesting 0:34 give me about 5 to 10 ideas that I could 0:38 build using a no code platform I'll be 0:41 using lovable and I want to build like a 0:43 software as a service and integrate 0:45 things such as authentication and 0:47 payments and so forth boom cool so let's 0:50 go deep search okay so grock's done so 0:53 let's go up over here and we've got a 0:55 little table of ideas so the first one 0:58 here digital product store ebooks 1:00 templates okay now subscription based 1:02 newsletter I've already got one of those 1:05 uh freelance gig platform Pet Care 1:08 tracker budgeting app language learning 1:12 flash cards event secting platform home 1:15 Inventory manager writing Community 1:18 platform okay so we're going to go ahead 1:19 with the language learning flashcards 1:22 and we're going to build out a full SAS 1:25 startup just by doing that so I'm going 1:26 to say I like the language learning 1:29 flash card let's go with that one I 1:33 going to just say give me actually let's 1:35 do this give me the starting prompt for 1:39 lovable lovable perfect Okay so we've 1:42 got a starting prompt here so let's copy 1:46 that out cool so we got that we're going 1:48 to come to lovable we're going to pop 1:50 that in and we're going to go okay so 1:54 lbl is pulling out all of our codee that 1:55 we need all the different pages and then 1:58 once we hit the preview we can then go 2:00 ahead and iterate that and add in things 2:02 like a back end to to you know old user 2:06 details for login and signups we can 2:08 integrate Stripes so we can monetize the 2:10 application and we'll go through all of 2:12 that but so far so good you can't see 2:14 the time at the top so I'll just keep 2:16 hovering as much as I can we got 53 2:18 minutes left so about 7 minutes to get 2:21 our idea off of grock and what I like 2:24 about grock is the Deep research or deep 2:27 search mode use that to you know kind of 2:30 brainstorm some ideas and then you can 2:32 use the think mode to get your first 2:33 prompt and pop that straight into loable 2:36 let it build out your your code and you 2:38 can go ahead and Vibe code the rest nice 2:40 thing about grock is this is free so 2:42 you're not paying for for any of this 2:44 and then lovable I've covered this in 2:45 previous videos but I've got like their 2:47 $20 a month it's like the next level up 2:51 from the free tier which just allows me 2:54 more prompts but if you want to do this 2:55 with a free tier you can just know that 2:57 you're going to be quite Limited in the 2:58 amount of prompts that you have okay 2:59 Okay so we've got our first landing page 3:02 this is the first edit from lovable and 3:04 it actually looks pretty decent so it's 3:06 called flash learn I actually like that 3:08 so maybe I should go and try and see if 3:10 ww. flash.com is available so I can get 3:12 the domain learn languages with 3:14 beautiful flashcards create your own 3:15 custom flashcard decks and study at your 3:17 own pace the interative interface 3:19 learning a new language has never been 3:20 any more enjoyable get started login 3:22 okay so there's already a login and SAA 3:24 button which is quite cool it's done 3:26 that intuitively I haven't actually 3:27 asked for that and then if we say 3:30 elegant learning try our intuitive card 3:32 system with a simple tap to flip okay so 3:35 back hello yeah I don't know that that 3:38 doesn't make sense to me but design for 3:41 Effective Learning Upgrade to premium 3:43 it's given us the option to integrate 3:45 monetization which is pretty cool um and 3:48 then we've got that all over here so a 3:50 nice landing page all one page so no 3:53 multiple Pages which I actually like I 3:54 like it when it's all in just one 3:56 complete page so I like the actual UI we 3:59 might change this slightly and do 4:01 something on the background but let's 4:03 get let's focus on this component here 4:06 first got 48 minutes left so if we go 4:10 ahead let's go back to flash learn if we 4:13 go ahead here and we say the actual 4:17 flash card example does flip around but 4:20 I'm trying to learn different languages 4:22 so when I flip it around it just flips 4:24 the whole card around ideally shouldn't 4:26 it be like the English is hello and like 4:29 the Spanish version is like hola maybe 4:32 we go Spanish so English and Spanish 4:34 let's just focus on one language at the 4:35 moment um that when you flip it it 4:37 changes and it gives you the the the 4:40 actual next word and that you can use 4:43 that to test yourself something like 4:44 that but maybe like do a little bit of 4:46 an additional Deep dive into that so 4:48 that we can kind of fix that okay so 4:50 I've asked lovable to fix that issue if 4:54 you guys don't know what I'm using I'm 4:55 using something called aqua voice 4:56 there'll be a link in the description 4:57 below this allows you to actually use 4:59 your voice rather than to text or to 5:01 typee out prompts which I like it's make 5:04 it makes things so much more intuitive 5:06 when I actually Vibe code I can just sit 5:08 there and kind of talk through it and it 5:09 uses AI to actually understand what you 5:11 want to say not just what you're saying 5:13 so it's not just transcribing it's 5:14 actually using AI to understand if you 5:16 correct yourself it will take that 5:17 correction into account pretty cool 5:19 anyway we've got 46 minutes so let's see 5:22 how this fixes this issue because I like 5:24 that it is flipping click to flip but 5:26 it's not giving us anything so let's fix 5:28 that first because that's the main we 5:30 want to achieve here and then we'll work 5:32 on our sign up page and monetization 5:34 okay I understand that you've made the 5:36 changes but I'm not seeing them under 5:38 the elegant learning experience section 5:40 of the page where there's that flash Cod 5:42 um it still looks the same as it was so 5:44 please integrate the changes that you've 5:48 made okay so it's actually updated now 5:51 so if we say English is hello click to 5:54 flip Spanish is Ola and I think it will 5:56 actually give us the audio 6:00 well it's supposed to but that's 6:01 actually pretty cool in terms of 6:02 pronunciation and actually even think of 6:04 that lovable dudes and it's also just 6:06 changed the color grading here from that 6:09 blue to Black 43 minutes and at least 6:11 this is working how it should okay so 6:14 let's improve our login and signups I 6:18 want users to be able to sign up um and 6:20 I can capture their details in super 6:23 base so I want to connect to superbase 6:25 and then allow them to log in and you 6:27 know have a profile where they can you 6:29 know maybe you know choose a language to 6:31 to learn and then we'll have cards that 6:33 are created for them to you know 6:36 actually learn English to whatever that 6:38 language is that they 6:41 choose okay so it says it's set up super 6:44 base but we need to replace the 6:46 placeholder superbase URL and Anonymous 6:48 key with ours so what we can do is go to 6:51 the superbase button in the top right 6:52 corner yeah top right corner and we can 6:55 connect over here so what we're going to 6:57 do is we're going to create a new 6:58 project um you can create M multiple 7:01 projects in super base after you create 7:03 an organization in super base you can do 7:04 this all for free superbase is your back 7:07 end think of it that way and it's 7:08 cloud-based so that there we're going to 7:10 create something called flash cards 7:13 flash card SAS password let's do 7:16 something basic okay cool create new 7:18 project I think I've got space for a 7:21 project yep I do okay cool project 7:24 status done now if you come to table 7:27 editor you'll be able to add tables but 7:28 it will create those dynamically for you 7:30 so you don't have to create like a 7:31 profile table or whatever table as long 7:33 as it's connected to super base loveable 7:36 will build your entire back end which is 7:38 pretty cool Okay so we've got flash Cod 7:40 SAS here now connect connect cool done 7:44 so that is sorted flash card test now 7:47 let's go back to our project okay so I 7:49 didn't even do anything now it just says 7:50 I'm now connecting to your superbase 7:52 project to gather your datao structure 7:54 tables yada yada yada and then it says 7:56 here your app is now connected we can 7:58 now do user account and login store and 8:00 use real time data add Advanced features 8:03 so forth so forth okay so we want to if 8:05 you plan to have the user login we 8:06 highly recommend setting up 8:07 authentication first okay so I'm going 8:09 to go here and say yes I would like to 8:12 set up authentication in super base 8:14 quick update on time we have 38 minutes 8:16 left okay I'll help set up 8:18 authentication using superbase let's 8:20 first create the necessary database 8:22 tables think that it asks you to approve 8:25 the changes apply changes here we should 8:27 see okay there you see user profiles 8:28 it's create did that table for us 8:30 without us doing anything so you can see 8:32 here we got user ID full name email 8:34 preferred language created that update 8:36 to that timestamps done cool so it's 8:39 going to update that once it's updated 8:40 that we can test it to see if we can 8:42 sign up and log in one quick little 8:44 trick when you're testing out your 8:45 software as a service and you've done 8:46 your authentication is come to the 8:48 authentication tab in superbase then go 8:51 down to go into signning sign up come 8:55 down to authentication providers you 8:56 know when you authenticate via email and 8:58 you sign up to an application and then 8:59 you have to confirm via email if we're 9:02 using test emails and we're not live yet 9:05 we can't do that so you want to come to 9:06 email and you want to untech confirm 9:08 email just for now while we test so that 9:11 you don't have to confirm email you'll 9:12 never be able to sign in because when 9:14 you sign up it says confirm your email 9:16 and it's not connected to the internet 9:17 so you won't be able to so once you 9:19 deploy you can come and enable this then 9:21 you'll be sorted so just go there save 9:23 that boom okay so now we can go ahead 9:26 and try and sign up so let's sign up 9:28 let's try my name is Jagger let's try my 9:32 surname do a password I mean email and 9:35 password create account okay that looks 9:38 like it worked now let's go to Jagger we 9:40 can actually check on super base over 9:41 here if we come back to database tables 9:44 user profiles oh sorry let's go table 9:47 editor the profiles oh there we go did 9:50 load there Jagger my email all that so 9:53 that's been that's working which is 9:55 great we come here and we sign in boom 9:58 We can sign in Okay so now this is our 10:00 main landing page it looks pretty decent 10:02 we've got an upgrade to premium button 10:04 already and we've got some decks up and 10:06 running already so we've got Spanish 10:08 Basics 24 cards French vocab Japanese 10:11 hirana I don't know if that is maybe 10:14 that's the word for vocab not too sure 10:16 okay let's do Spanish so we say study we 10:18 say English so Ola is hello next gracias 10:24 should be thank you yep it is okay cool 10:27 next Poore is my Spanish isn't too great 10:30 please yep there we go cool buas Diaz 10:34 isn't that good evening good morning my 10:36 bad and we come back to Ola right so we 10:38 got four we got cards three of four 10:41 there back to dashboard and maybe we'll 10:43 only get four only get three cards from 10:45 the Spanish from the French one here as 10:48 well okay let me stop embarrassing 10:51 myself okay so we' got three sets over 10:53 there we can create a new deck um we can 10:55 actually add in what all of our cards so 10:58 you can actually create your own deck so 11:00 it's like a study deck type of thing 11:02 which is not really what we want okay so 11:04 come back to home oh okay so let's go 11:07 profile dashboard dashboard subscription 11:11 okay so these are subscriptions that 11:13 lovable given us free plan up to five 11:15 flash card decks up to 50 cards per deck 11:18 study basic study features and then here 11:21 create unlimited flash card decks okay 11:25 so what I want to do here is we want to 11:28 come over here so we've got 11:29 authentication working we can sign up 11:31 users we can have them log into our 11:33 software as a service now let's work on 11:36 monetizing that and there's nothing 11:38 worse than what are we doing this all 11:40 for we going to Bild out a free 11:41 application we want to monetize it we 11:43 want people to pay us for it so easiest 11:45 way to do that is with stripe easiest 11:47 way to do that is just to come to 11:50 lovable awesome this is looking great 11:52 could we please integrate stripe for 11:56 monetization cool so I'm going to do 11:58 that I'm I'm just telling it I want to 12:00 integrate stripe we'll then have to go 12:02 and open up stripe and create a test 12:05 account on stripe and then link the two 12:07 with an API key so you'll see here let's 12:10 first get your stripe API keys please 12:12 provide them and I will jump back now 12:15 let's go to stripe this is the right 12:18 profile okay so we're going to go to 12:20 test mode once you're in test mode what 12:22 you want to do is you want to come down 12:23 to the developers tab yep developers Tab 12:28 and you want to go to API Keys okay so 12:32 what I did was I just I've jumped back 12:34 to Lev bable because I don't want to 12:35 show you guys my API Keys obviously and 12:38 what you want to do is Lally go and 12:39 click this button add API key it will 12:42 bring up this window and then you want 12:43 to paste in oh paste in your API key 12:47 that you'll copy from stripe you submit 12:50 that it will then link so I've now 12:52 updated my API Keys you asked for and 12:54 levo will then do all that integration 12:56 and hold those keys in super base in the 12:59 back end okay and two more things you 13:01 need to do from a stripe perspective is 13:02 set your stripe price ID and your stripe 13:05 where hook secrets so stripe ID price ID 13:08 is easy you going to come to payment 13:09 links you going to create a new payment 13:11 link which is just all you're doing is 13:13 creating your 13:15 $9.99 a month recurring Revenue so every 13:18 month it will take that amount off of 13:20 the debit card that the person or credit 13:22 card that the person uses or you can do 13:24 oneof payment but usually for SAS it's 13:26 going to be recurring you then get your 13:28 product and you set that so in this case 13:30 test one is $9.99 in my case and if you 13:33 click into that get to price and you 13:35 click into that you then have this price 13:36 Ide at the top you copy that ID you come 13:38 back here and you say here is my price 13:42 ID and here is my web hook secret web 13:47 hook web hook secret is easy it actually 13:50 gives you a link so if you go to your 13:51 dashboard you'll come to your where your 13:54 workbench where your web hooks are you 13:56 can create a new destination web hook 13:58 there all you want to do is literally go 14:01 in there and copy out the web hook 14:04 secret there we go you want to copy that 14:07 so you're going to copy your web hook 14:08 secret and once you've done that it then 14:11 links to your web hook secret as well as 14:15 your price ID so let's give it that 14:17 information and see how we go with that 14:19 okay we got 22 minutes left so what you 14:22 want to do now is that that is up and 14:24 running from a strip perspective you 14:25 want to then go and publish this is 14:27 important so you want to publish this 14:29 makes it live via a lovable link which 14:32 you can link to your own custom domain 14:34 but it's just going to give us a 14:35 playaround link that's larif flashcards 14:37 lovable. apppp that is updated then you 14:40 want to go and in my opinion it's the 14:42 best way to do this is copy that go to 14:46 your browser create a incognito window 14:50 and then what you want to do here is 14:52 we're going to log in boom we do and 14:54 then I want to say upgrade now I want to 14:55 say upgrade a premium and this should um 14:58 guess to our strip page over here we can 15:00 then use play around details so like a 15:03 play or test card is 42 42 42 15:07 424242 and then so let's go 15:10 0927 and your CVV I think can be 15:13 anything I think it's triple one full 15:15 name I'm just going to say Jagger that's 15:17 where I'm based subscribe so this is 15:20 just using like a test card because this 15:21 is all just a test scenario so it should 15:23 a processing it should be successful 15:27 okay it is successful it should take us 15:28 back back to our card over here okay so 15:31 our subscription is not working so the 15:34 main thing we have to do now is we have 15:35 to come back to lovable and we need to 15:38 say once I click upgrade to premium and 15:41 I pay using stripe uh I come back to 15:44 this page but I'm not logged in as a I'm 15:47 not upgraded to a premium user please 15:49 fix that okay so we have to create some 15:51 database structure so let's apply these 15:53 changes okay so we should have it 15:55 working now so I'm going to update the 15:57 URL we redeploy and we can try this 16:00 again I'm just thinking in terms of time 16:02 18 minutes I still want to do some UI 16:04 changes to make this look a little bit 16:05 nicer but this is our main hurdle we 16:08 want to get through so let's load up the 16:11 page over here let's log in O Let's 16:16 upgrade upgrade a premium okay and then 16:19 let's subscribe okay this subscription 16:22 successful you're now a premium 16:24 subscriber let's go back to our 16:26 dashboard it does still say to upgrade 16:29 to premium so it's giving us the option 16:33 it's not actually picking up the 16:36 subscription okay so we need to go back 16:38 to lovable so let's close that let's 16:40 come back here and we'll say I'm able to 16:42 complete my stripe setup but and my 16:45 subscription and it says I'm 16:47 successfully subscribed but then my 16:49 profile is still on the free plan and 16:51 not on the Premium plan so you know 16:53 there's still that ability to upgrade to 16:55 premium so that needs to be fixed all 16:57 righty so let's go through that we still 16:59 have 15 minutes okay so we might have 17:01 fixed this let's publish once again we 17:03 have 13 minutes it's going to be a tight 17:05 one strip's giving us a little bit of 17:07 issues today which is all part of the 17:09 the fun of this and and then the Journey 17:11 of figuring this out so once it's 17:13 updated we can then go over here let's 17:16 go profile oh wait subscription upgrades 17:19 premium 17:21 927 111 Jagger 17:24 subscribe all righty so we are a premium 17:27 user so we've got access all the premium 17:29 features the you can obviously see if we 17:32 got a subscription we've now got current 17:34 plan and then we can say down downgrade 17:36 not available that should be integrated 17:38 you should allow people to be able to 17:40 cancel their subscription so do keep 17:41 that in mind that is a little bit of a 17:43 hole given we have got 11 minutes left I 17:46 want to work on the user interface the 17:48 way we're going to do this is we're 17:50 going to be using my favorite 21st. deev 17:52 this is a free platform that allows and 17:54 gives you a whole bunch of UI components 17:57 one thing that I think is pretty cool is 17:59 this one over here which is this 18:01 beautiful like it moves with your cursor 18:04 and adds all this color all over the 18:06 screen what you can do here is you can 18:07 copy The Prompt so let's say open 18:09 component you can copy prompt and then 18:12 you can choose for which no code Builder 18:15 so in our case lovable and we can go 18:17 ahead and copy The Prompt exactly for 18:19 lovable so that being said let us 18:22 integrate this okay so I'm going to say 18:25 uh I want to change the homepage 18:28 background at the top to this beautiful 18:31 UI component I'm going to give you the 18:33 code below okay so let's do that paste 18:36 that in boom okay so if we come back to 18:40 our homepage hopefully the background 18:42 now changes where it says learn 18:44 languages with beautiful flash cards to 18:47 that background which will be pretty 18:48 cool and we've got 9 minutes so let's 18:51 actually go back to 21st. D in the 18:53 meantime while that loads and we can 18:54 look at some other things we want to do 18:56 um one of the things was the actual 18:58 cards so if we go and say features okay 19:02 display cards yeah like this so think 19:05 about our cards um if you could have the 19:08 cards like that something like that I 19:10 think okay so let us see if we come on 19:13 to our page look how beautiful that is 19:17 okay obviously across our entire page so 19:19 what we wouldd want to maybe do is only 19:20 put it in this section but it is pretty 19:23 cool so you can see like how reactive it 19:26 is and it just adds like a another 19:29 Dynamic which is pretty pretty cool 19:31 let's see we got 6 minutes let's see if 19:32 we can integrate this so let's copy our 19:34 prompt over here copy that let's come 19:36 back over there and let's say for the 19:39 actual cards in the dashboard I would 19:41 like them to be shown in the following 19:44 manner using the UI component I'm going 19:46 to paste below Co let's go over there 19:49 let's paste that in there cool so let's 19:52 see if we can do this as our last thing 19:54 we've got 5 minutes 28 seconds all 19:56 righty so we' got a bunch of errors that 19:58 that's caused we've got 4 minutes to go 20:01 so let's see if we can just get those 20:02 last piece complete before that okay and 20:05 with 1 minute 15 seconds left let us 20:08 just go to our dashboard and we can you 20:10 can see here that we've actually got our 20:11 Spanish Basics French vocab and then the 20:14 Japanese herana ping that but you can 20:17 see over there so if you click on that I 20:19 don't think you can even click on those 20:21 so you need to make them clickable but 20:22 you could line them up like that then 20:25 versus what we did have and that's using 20:27 21st Dev which is pretty cool that being 20:30 said guys this is our once it loads here 20:34 this was our SAS that we built in an 20:37 hour we've got 38 seconds to go so I'm 20:39 going to use the last 30 seconds just to 20:41 say I really hope it was beneficial to 20:42 show you how you can set up 20:43 authentication signups logins you can 20:45 set up stripe to you know start 20:47 monetizing your application and then you 20:49 know improve your UI using something 20:51 like 21st. those are really the only 20:53 three tools you need in order to build 20:55 something out and if you need some ideas 20:57 go to Gro use deep search get a list of 21:00 startup ideas build your startup using 21:02 lovable and all these extra little tools 21:05 not even that many extra little tools 21:06 it's like superbase and 21st. Dev and um 21:10 yeah you guys can get a SAS up and 21:11 running in an hour we're done all right 21:14 let me switch this off cool so after all 21:17 of that I'm just going to say one last 21:18 thing you found this beneficial please 21:20 do consider liking and subscribing it 21:22 does amazing things for the channel we 21:24 just hit over 4,000 subscribers I'm 21:27 thankful to each and every one of you if 21:29 you are watching this and you have not 21:30 liked have not subscribed I really ask 21:33 that you do so if you got some benefit 21:35 out of this it allows me to understand 21:37 this is the direction that people want 21:39 me to carry on going in and these are 21:41 the type of videos I should carry on 21:42 creating and double down help me out so 21:45 I can help you guys out and create 21:46 better and better content as I go 21:47 forward other than that I will see you 21:49 guys in the next video cheers