FULL FREE Lovable Dev Course 1: Why Lovable?

0:01 hello and welcome to this lovable course 0:04 I'm going to just get into things guys 0:06 I'm not going to explain too much here 0:08 but the idea behind this course is to 0:10 give you the basics and also all of the 0:12 things that I've learned so far using 0:15 lovable to develop apps to make websites 0:17 to rank on Google 0:20 Etc so the first episode which is this 0:23 episode that you're watching right now 0:24 is why lovable why do I like lovable 0:28 compared to other things like B on new 0:32 cursor 0:33 Etc the first thing that I really really 0:36 like about lovable is that it has 0:38 intelligent prompting and what what do I 0:41 mean by that you could also call this 0:43 intelligent model or just intelligence 0:46 lovable ability to take what you write 0:51 here and translate that not into just 0:55 code but also if you're using an AI 0:57 model into prompts 1:00 Etc is better than anything that I've 1:03 used now I suspect I don't know but I 1:05 suspect they're using anthropic 3.5 1:08 Sonic claw 3.5 Sonic but I'm not I I I 1:11 don't know if if that's actually true or 1:14 not uh it's the most intelligent system 1:16 I've used and it interprets what you're 1:20 asking it instead of giving you a base 1:24 level of whatever you're asking it right 1:27 something like bolt. new what it'll do 1:29 is it'll just give you a base level of 1:32 what what you've asked it right but it's 1:35 not going to give you a completely solid 1:36 version of that lovable will give you a 1:39 version of that that you actually 1:41 want so lovable can craft good prompts 1:44 right and when left to design systems 1:46 does a thorough job so when it designs 1:49 systems when it creates a system for you 1:52 whether that be Chain by uh Chain of 1:55 Thought prompting system whether that 1:57 be um just a completely different 2:00 function that doesn't use AI it doesn't 2:03 matter its ability to create and Design 2:07 Systems that are good is 2:11 unmatched the second thing that I really 2:14 really like about about lovable is 2:18 Integrations now if we just go on Google 2:24 here and we just write lovable 2:28 Integrations 2:31 now what this is this is the okay so 2:34 obviously bolt copi lovable and they 2:37 also have super base they also have 2:39 GitHub however there's other things here 2:43 okay that are very very 2:46 interesting so let's just take a 2:52 screenshot so what is this mean it means 2:55 that first of all I suspect I don't know 2:57 if this is true but I suspect that they 2:59 up date The Prompt that is responsible 3:03 for you know connecting to GitHub or 3:06 connecting to open 3:08 AI it will be updated with the latest 3:11 documentation okay so what that means is 3:14 you don't have to worry about finding 3:16 documentation you don't have to worry if 3:19 the implementation of the documentation 3:21 is correct because anything that is 3:24 integrated you basically just say so 3:28 superbase and GitHub are different they 3:29 have buttons on lovable that allow you 3:31 to connect to them that's why they say 3:34 native verified what happens is let's 3:36 say you want to add email to your SAS 3:40 right that you're making unlovable 3:42 resend you just say set up resend to 3:45 send emails to users when they make a 3:48 purchase when they do this when they do 3:50 that you know create a whole email 3:52 workflow for me Etc that is possible 3:55 with lovable right to do this on 3:57 something like um 4:00 bolt. DIY or bolt dodev 4:04 or cursor will be complicated it'll be 4:08 difficult you'll have you'll struggle 4:09 with this right you have to learn resend 4:12 and understand it understand how it 4:13 works but because it's both intelligent 4:18 and has a resend integration you can 4:21 literally just say to it make me a sass 4:24 right that does this that and the other 4:25 so you create the Sass then you say 4:27 please add stripe to it and with three 4:30 different pricing levels let's say and a 4:32 free trial it will do that it will tell 4:34 you how to set up stripe it'll explain 4:37 everything then you say okay now that 4:39 I've done that I want to send emails 4:41 when someone makes a purchase and then 4:43 we say oh I want to add a uh a chat bot 4:46 uh for help uh support you know whatever 4:49 and then you want to power the SAS like 4:52 the the SAS itself let's say it's a 4:53 keyword tool that uses Claude you can 4:56 say Okay I want to add Claude to the 4:58 keyword tool 5:00 and you basically can make I would say 5:02 right with lovable you could make a 5:04 fully functioning SAS in an 5:07 hour right which is completely 5:10 completely 5:11 insane Integrations huge part of the 5:14 reason that I really like lovable it 5:16 just makes things easier you don't have 5:18 to worry you don't have to even have a m 5:22 file or create a m file you can 5:23 literally it will pop up and you just 5:26 click and say add my API key and you you 5:29 can add your API key it's that easy now 5:32 just saying no how to use Integrations 5:35 is pretty easy you just say um let's go 5:39 to a project that I already 5:41 have oh wait I can't change that project 5:44 it's connected to a live 5:46 website let's say let's add stripe to 5:50 tape payment right and then what this is 5:54 going to do is it will code stripe for 5:57 us and then tell us how to 6:00 add our API key Etc right so we have a 6:04 super base set up stripe account add 6:07 secret key create the checkout 6:09 functionality implement the payment UI 6:11 it will do all of that for us but we 6:14 just need to do um these things here 6:18 right because it can't do these for us 6:20 yet I suspect that Lev will be able to 6:23 eventually so you click here you click 6:25 here you get all this information you 6:26 give it all of that information here it 6:28 will add it to the m it will then do the 6:31 rest of these steps and you have stripe 6:33 added to your project it's that easy 6:35 it's never been that easy before in the 6:36 history of of time right this took me 6:39 that took me like eight hours to learn 6:41 how to do that um without lovable when I 6:44 just did it 6:45 myself okay so the next reason I really 6:47 really like loveable and why I recommend 6:50 it is the super base integration now I 6:53 know bolt has since I don't want to say 6:56 copied again but like since done this 6:58 themselves 7:00 um yeah it's not the only one that does 7:03 this 7:04 but the huge advantage of this is that 7:07 you don't have to set up a backend right 7:12 ordinarily you can do an open Ai call 7:17 right using uh no 7:21 backend but you need to use you know 7:24 specific thing called um allow with 7:27 browsing and it's just not it's not very 7:30 easy right and that's just with open AI 7:32 if you want to do anything more 7:33 complicated that requires a third party 7:36 API or a back end the cool thing with 7:40 lovable is that you only need to have a 7:43 front end and then you use super base to 7:48 call functions for 7:51 you so what what does that actually mean 7:53 like what the hell am I talking about 7:54 let's just click edit code 7:56 here um 8:02 just want to I just want to see the code 8:03 and I'll 8:05 explain so ordinarily right so this this 8:09 is our craft this is this website here 8:12 right what this website is is it's a 8:15 lead gen website for our agency okay in 8:18 the United 8:20 States and this content here is 8:22 generated by chat upt right at the point 8:27 of when someone clicks clicked this page 8:30 this content was generated and then it 8:32 was stored dynamically it was it was 8:34 created dynamically at the time as 8:37 someone clicking it in this case go 8:39 Google's crawl is clicking it and then 8:42 it 8:43 um cach AED that content right that's 8:46 not important but so somewhere here 8:49 there is a if I go on super base 8:53 functions uh generate SEO content 8:56 index.ts right so here there are 9:01 there's something in here that is 9:02 creating the content right yeah so it's 9:06 it's content generation. TS inside utils 9:08 file right so ordinarily what you would 9:11 have to do is you'd have to have this as 9:12 a 9:13 separate uh backend in order to run this 9:17 but in this case that's not true 9:21 because we're using superbase in order 9:24 to call this function in the cloud now 9:28 I'm not a developer I don't want people 9:30 to get the wrong idea that's not what 9:32 I'm trying to say here I'm trying to 9:33 explain this in simple terms um and I 9:36 might even be wrong about the whole 9:37 backend thing but in my experience you 9:41 either have to set up a backend or some 9:44 kind of uh server to call the function 9:49 right but with super base you don't have 9:51 to do that and you can just use 9:53 something called uh superbase functions 9:56 or Edge functions I think they're called 9:58 and effectively you call the function in 10:01 the cloud instead of um on your own 10:06 server now one of the other things I 10:08 really really like about lovable the 10:11 fourth thing I love about lovable is the 10:13 select and change right this 10:16 is this little button here select right 10:20 this is a live website just so you know 10:23 so craft agency us.com if I wanted to 10:26 using bolt for example okay or even 10:29 using cursor if I wanted to I don't know 10:33 change this to have an underline under 10:38 it bolt would be at risk of deleting 10:42 code or whatever it might change it it 10:45 might change other things cursor is the 10:48 same it always tries to rewrite things 10:49 that you haven't asked it to rewrite 10:51 okay but if I just click the little 10:54 select button here and then you can 10:56 select any div anything any p any 10:59 whatever you want right you can swap 11:01 pictures out like this um you can change 11:06 anything right it's like having the 11:07 power of something like Elemental or 11:10 divy but on nextjs 11:13 which is crazy when you think about it 11:17 so let's just say make this title 11:21 underline right it will only change that 11:24 it will change nothing else and that is 11:26 how me as a complete n designer 11:32 took craft 11:36 agency. which is this beautifully 11:38 designed website on uh WordPress right 11:42 and made this which although is not 11:46 exactly the same 11:49 it's pretty good as a as a version of of 11:52 this right it's not the same I 11:54 understand that but it's it's pretty 11:56 close right there we go that's now 11:58 underlined 12:00 and then another thing that I do love 12:01 about lovable which I didn't actually 12:03 have written down just because it's it's 12:06 kind of like standard these days to have 12:08 this feature but now I've made this 12:10 change right I I don't know if you guys 12:12 saw but the last change that I did was 12:13 18 days ago right this website's just 12:16 been sitting here since the 5th of 12:19 January the website no I haven't changed 12:22 I haven't touched anything this is like 12:24 my instance of this website unlovable 12:27 but it's also connected to GitHub so if 12:29 I go back now to the homepage you'll see 12:32 that there should be okay there's not an 12:35 underline yet but oh there is so that's 12:39 another really really cool thing about 12:40 lovable is like this is my it's almost 12:44 like my WordPress backend where it's 12:46 stored and I can edit anything I want at 12:49 any time within here now you can also 12:51 edit code and download it and use cursor 12:53 or whatever but I just love the fact 12:55 that like you can just change something 12:56 here and it's just automatically on the 12:59 site I will be talking about that in 13:00 future uh future episodes of this 13:03 course now one special mention that I I 13:06 do want to just quickly talk about is um 13:10 the fact that you can it's a new feature 13:12 I haven't tested it yet but it says here 13:15 and if this does work and it does seem 13:17 to work um from what I've 13:21 seen you can now 13:25 do figma 13:27 into love 13:31 which is completely nuts right if you 13:34 know a good designer like I 13:36 do they can design you both can design 13:41 right in writing like everything so 13:46 like it's kind of hard to explain like 13:48 let's say you wanted to make a SAS where 13:50 like they I'm just going to use harbor 13:52 an example someone puts their s map and 13:56 it generates keyword ideas right 14:00 and they can select a keyword idea that 14:01 they like they click it and it takes it 14:04 to the writer just like Harper does 14:08 right what the way that we did this was 14:10 Rowan designed everything on 14:13 figma and then a team took that and put 14:17 it on uh vanilla react which was 14:20 a yeah a terrible idea um so we're 14:23 actually on vanilla react do not 14:25 recommend guys do not recommend that um 14:28 but yeah 14:30 it like if I could go back in time now I 14:32 would start this whole process again and 14:33 I would just do this myself with uh a 14:35 lovable because I would take this figma 14:38 design that Rowan has that we have and I 14:41 would just run it through lovable and 14:43 just make everything exactly as I want 14:46 it and the really cool thing is like you 14:48 can write 14:50 like open Ai call to do X right here 14:59 and then lovable I suspect I don't know 15:02 for a fact I I haven't tested it would 15:04 then 15:06 prompt what needs to be inside this 15:09 specific open Ai call which is very very 15:12 interesting to me you can basically 15:14 design a whole SAS step by step every 15:17 prompt everything put that in 15:20 figma and then run that through lovable 15:23 which is yeah completely insane I do 15:25 need to test it though so I don't want 15:26 to spend any more time on that but yeah 15:29 I just wanted to quickly mention that so 15:31 they are all the positives let's just 15:33 talk about the negatives quickly just 15:35 because you know I'm fair I'm balanced 15:37 there are some negatives here for sure 15:40 it's expensive it's very expensive for 15:43 um the amount of calls you get but I I I 15:48 don't mind paying for something that can 15:50 do what um lovable can do that's me 15:53 personally obviously I have maybe a 15:56 larger budget than some people so I do 15:59 understand um like I I am part of a 16:03 business so obviously I'm just using 16:05 business funds to do a lot of my 16:07 experiments so I do understand that it's 16:10 expensive so just be wary of 16:12 that um it has lowish limits uh although 16:16 these two thing the these are kind of 16:17 connected 16:19 because um It's relatively expensive 16:23 right it's only $50 a month for higher 16:26 limits so it's relatively expensive 16:29 compared to something like bolt which 16:31 will give you you can make more things 16:32 on bolt than you could on uh lovable 16:37 there's no automation I'd be interested 16:39 to see if they do go down the route of 16:42 like you just describing what you want 16:44 and then it just doing several steps for 16:47 you um and then just gives you a 16:50 finished app rather than 16:52 you you know struggling and working away 16:55 and trying to get what you want out of 16:57 the app this would be cool if if they do 16:59 do automation I would love that but yeah 17:02 so it uses Vite I don't this isn't 17:05 necessarily a disadvantage it's just I 17:07 don't have that much experience with 17:09 Vite the one thing that I don't like is 17:11 that it's limited to one text stack 17:14 right it's annoying 17:19 that it's limited to one text stack I 17:21 believe you can't even use an xjs as far 17:23 as I understand it you have to use their 17:26 exact text stack 17:29 which yeah I'm just I I personally don't 17:33 I personally don't like 17:34 that okay I think we'll wrap up the 17:37 first episode there that is the kind of 17:39 basics of why I think lovable is the 17:42 best I'm going to say no code but it's 17:44 not really no code but best no code um 17:47 AI development software available right 17:50 now very very interested to see what 17:52 people think of this video If people 17:54 want to help me direct this course that 17:58 that would be 17:59 amazing um I'll just give you my ideas 18:02 right now and then if anyone wants to 18:03 add anything feel free so second episode 18:07 will be prompting third episode will be 18:10 building but I was thinking of splitting 18:12 that into several episodes where I just 18:15 build different things like build a 18:18 Blog build a SAS you know whatever Etc 18:23 um and then fourth episode is launching 18:26 SL maintaining right so yeah I'll leave 18:29 the first episode of this there guys 18:31 thank you so much for watching if you're 18:32 watching all the way to the end of this 18:33 video You're an absolute Legend and I'll 18:35 see you very very soon with some more 18:37 content peace out