WEBVTT 00:01.960 --> 00:07.320 This lecture, we're going to take a look at how we can extract this code, extract our application 00:07.320 --> 00:12.640 that has been created by lovable and save the code somewhere else. 00:12.880 --> 00:16.840 So if you are taking a look here at the dev mode, you're going to see here that this is our application 00:16.840 --> 00:17.280 code. 00:17.600 --> 00:19.360 And of course it doesn't make sense to go here. 00:19.360 --> 00:21.080 Fireball file and copy all these files. 00:21.080 --> 00:23.240 And there's no download button or something like that. 00:23.440 --> 00:29.760 So in order to take this code and work on it independently of lovable, we need to copy it. 00:29.760 --> 00:35.880 And in order to do that, we're going to use a GitHub integration, because this is what allows us to 00:35.920 --> 00:39.120 take the code and store it in a GitHub repository. 00:39.440 --> 00:42.120 So let's go ahead and click here on this GitHub icon. 00:42.160 --> 00:45.240 It even says here sync your project with GitHub. 00:45.800 --> 00:51.600 And we're going to go through a process because again GitHub is a third party thing outside of lovable. 00:51.640 --> 00:54.600 We need to integrate it with lovable to get everything to work. 00:54.640 --> 00:57.520 I'm going to go ahead and click connect GitHub. 00:58.840 --> 01:01.320 Now this is going to open up this additional page. 01:01.320 --> 01:03.480 This is also something that's part of settings. 01:03.480 --> 01:06.520 And it's very similar to how we have configured Supabase. 01:06.520 --> 01:08.560 But let's go ahead and do this step by step. 01:08.560 --> 01:10.120 I'm going to click on connect GitHub. 01:10.640 --> 01:12.840 And in order to follow along you need a GitHub account. 01:12.840 --> 01:15.120 And you need to be logged in already. 01:16.160 --> 01:22.760 So in this case, GitHub is going to ask us if we allow lovable information about our account. 01:22.800 --> 01:25.640 So I'm going to say yes we authorize lovable. 01:26.760 --> 01:31.160 And then what we need to do is to link a new GitHub organization. 01:31.160 --> 01:32.720 So we're going to click on this. 01:33.920 --> 01:39.920 I'm going to leave here the option all repositories and select Install and Authorize. 01:41.160 --> 01:44.400 So now I have linked my GitHub account. 01:45.280 --> 01:47.560 All we need to do is click again here on link. 01:48.440 --> 01:52.800 And now it has been properly linked but we're still not done yet. 01:52.800 --> 01:54.320 I'm going to close this window. 01:54.840 --> 01:57.800 I'm going to see here it says not connected. 01:59.040 --> 02:08.520 And what we need to do is click here Transfer project select this organization and now it says Project 02:08.520 --> 02:09.120 Connected. 02:09.120 --> 02:11.520 We can actually view it on GitHub. 02:12.000 --> 02:15.240 This project has been automatically created. 02:15.480 --> 02:17.640 You notice here the name of the project. 02:17.640 --> 02:21.760 It is the exact same name as the project inside lovable. 02:21.800 --> 02:23.760 Here and now. 02:24.360 --> 02:29.570 Changes that we make to lovable are also going to be synced to GitHub. 02:30.210 --> 02:34.530 And if we make changes on GitHub, they're also going to be synced with lovable. 02:34.570 --> 02:39.850 So there's a two way integration which allows us to make changes outside of lovable. 02:39.890 --> 02:42.450 Meaning it doesn't cost us any credits. 02:42.730 --> 02:46.850 And we also have ownership over our application here. 02:46.970 --> 02:49.530 So this is again another important aspect. 02:49.890 --> 02:53.490 Apart from this, you also want to check the permissions of these repositories. 02:53.490 --> 03:00.050 If you want to keep everything private, make sure that this particular repository isn't a public repository. 03:00.890 --> 03:05.810 Now, just in case you're wondering, you can easily tell if this is a public repository or not. 03:05.850 --> 03:10.930 So if you see this lock here, it's going to tell you that this is actually a private repository. 03:11.290 --> 03:13.890 So the code that you have here is private. 03:13.930 --> 03:16.010 It's also being described here. 03:16.490 --> 03:23.250 So do check that if you don't want to have your code public that it is stored in a private repository. 03:23.770 --> 03:28.970 And we're going to see here very fast that every time we are making changes here those changes are going 03:28.970 --> 03:32.250 to be automatically synced with GitHub. 03:32.530 --> 03:38.330 So this is a nice and actually very useful integration that I recommend enabling as soon as possible.