Let's build a BeeWare app that uses Django

Hey, hello. So um it's a thank you for all the like housekeeping stuff. So if you have question please come at the front. Um for the folks online. I'm sorry, but I would check. Like this is the most important slides because you would get the whole slide deck. Uh the thing is this talk is gonna be a little bit chaotic because there's a lot of live demo, there's a lot of uh things that I'll be showing you Um originally this talk is a tutorial, that's why it's very important to get the slide deck and then there will be link to some information, some um you know tutorial instructions that if you have ah didn't catch it I was too fast then like you can check it out um

when you have time uh later or You know, so you you can follow it yourself and then you will get it ah a better idea. Um so uh We are going to view something today. Hopefully you feel feel free to to play along. Like if you have a laptop or you have home then you can also play along and try to um do that together. Um again it's gonna be a little bit chaotic. So sorry about that in advance. So um first of all before we jump into the chaos I'm Chuck. I'll contribute to open source. Uh so It again, like uh I I love open source. I've contributed to Django things for attending Django Corn Europe earlier this year It was really fun. Also, I organized a lot of events. I love the Python community. I'm right now the

PSF director and fellow. My day job is a community manager at OpenSSF. So what is OpenSSF? OpenSSF is part of Linux Foundation. We're a nonprofit. We are not trying to sell you anything. Um but what we want to do is to tell you to um be more aware of open source security. Um so we have newsletter and blog, so feel free to sign up if you really care about open source security. We also have free courses. If you are not really sure what is open source security yet and you want to learn more. So who has heard of VWAR? Yay, some of you. Okay, so actually quite a lot of you, so I don't know why I'm here. But anyway, I want to show off a little bit because I've got this BWA coin.

Who knows what this is? Keep your hands up if you have it. Ooh, okay, so if you have and then like yeah uh go to contribute to VWAR. That's like you get a chance to win a V-Ware coin But I don't have any with me today, so sorry about that. We can only look at the picture right now. So um so what is V-Ware in case you are the view people or maybe you're at home and then you're like, oh, what is beware? Um It's actually a very cool tool because it allows you to build an application and you can use it to deploy it to a lot of different platforms. So the The philosophy of BWAR is write once deploy everywhere. Sounds really cool. So uh BWAR is a framework actually, got a lot of tools in it.

We'll be looking at some of them. Um so you can write your app in Python. That's the key point. We love Python. We want to write in Python. So this is a tool that would let you to do that. And it can be released on multiple platforms, so uh including this list, uh which is Mac, Windows, Linux, iPhone, iPad, Android Using briefcase, so uh again we'll we'll be using it in a bit, so uh get your hands ready to um to deploy your first application So uh quick demo now. Although I told you it's gonna be a lot of demo. So um here, so uh this is the link. If you click on it, it will show you uh to the beware. Um uh tutorial that actually you can uh follow along so let's jump into it so let's have a look

so We'll open it. So you you will see this. But actually, if you haven't uh you use BUI before, you haven't installed it before, then uh you may want to have a look at the Tutorial zero which uh kind of guides you to create a new environment so you can um start your viewer journey there. Um but otherwise in uh Imagine like I already assume that you already set up a new environment, then now you can install a briefcase. So the first tool that we will be using actually is briefcase. So um So uh this is how you do it with macOS. If you are using Linux or Windows, I think Windows would be slightly different. Yeah, so sorry, it's too small. Let me zoom in. Yeah, so Windows will be slightly deferenced the command, but you will see it in that page.

Um so For me, uh let me the order is a bit different now. So uh for me, I already have done it. So I have a virtual environment, BWE VM there, that's already got the briefcase installed. So what I'm gonna do, I'm gonna activate it. So uh Uh source, beware. Um who know how to use VM? You you know? Yeah, okay, good. So I I I hope I don't have to explain. So what I'm doing now is to enter the environment that I've created and I have a rift case here. Well, there's a lot of things, but I do have I do have briefcase installed. So this is the first step. So install your environment with briefcase there. So that's the first thing. So

next thing is To create a new project. So I think since we are Django community, we're not unfamiliar with how to start a project. So there is a command that you can use to start a project. So it's called briefcase news in this case. So I'll just Use it to start a new project. So I need to give out some like information for this project to start. Um you will see something similar again. So um I can So spoiler alert, this is actually behind the hood we are using something like Cookie Cutter. There's a template of building it, but we'll dive into this more in the later part of the talk. So now you can just use the default. It doesn't matter because this is just an example. So you can just use all the default things. So I'm Jane now. That's my name and that's my email.

Example. com. That's a very good domain name. So okay Now uh license again choose your license but again this is a demo I'm not going to release it so it doesn't matter at the moment. Uh I'm using toga, so I'm because toga is kind of the um the the the base of doing it. I'll show you a little bit of what toga is and what toca can do in a bitch. But let's just use toga as if you only use toga. So now we have a project generator. So let me clear this up a little bit and then have a look. Now we have Hello World. So this is our new application that we have built, uh let's have a look at what is in Hello World. Right? So mmm, there's uh all these things that we are familiar with. We have a lot of things that Python project, we have for example

pyproject. como, we have the source, we have the test. Cool, we have uh all the uh um infrastructure kind of in place. So uh so yes just say yes to everything of them and then uh this is a more detailed look of what is inside your directory. So you now you have hello world, there's like uh So within the resources, these are the pictures that's actually for your splash screen. So those of you who kind of have tried a little bit of web application development, you know there's a splash screen. So those are the resources that we'll be using, the icon as well. And then there will be some place you can write your test. So okay. And app. py uh app. py is actually where most of your um your coding will be done there So

uh let's just try to run uh the the default to see to see how it is. So we will go into Hello World and then we will just run the uh briefcase dev. So let's do that. I will you uh go into other world and then we will run the case. It's kind of difficult to say for me briefcase, right? So , something's happening. Oh, what is this? I have a new window. Yeah, I'm using a Mac, so it's a bit funny. Um, so I have a window, but there's nothing inside. There's nothing because this is the the the the the default is a blank canvas is now for you to add something in there so let's close it because it's now not interesting um

You just see something blank. I have a I have a dark mode, so that's why it's you know it's not like this, but it's okay. Uh because again we have nothing there yet, so it's okay. So let's go to the second uh tutorial which is trying to build something. uh out of it. So now it's kind of explain a little bit of the architecture. I won't spend too much time in it because you can follow the tutorial and read it yourself. Uh I would just briefly go over it. So let's have a look at what's inside. If I can open my uh IDE here. So I'm opening this, not this one. Let's close it. I'm not talking about that. Okay, so where are we looking at? It's super small for me, but you don't have to worry about that. Um so I just need to find a page

Um here. So appdopy. So like this is what I said. Like most of your coding will be done here. Now you only have the um the kind of what 's the default is the the starting point. So you as you can see it's using Toga. So Toga doc box is just kind of create a box which is uh the the blank thing that you see. There's also a main window. It's like the window that pops up. So you use uh oh so you use the show to show that window so it will pops up Um there's nothing there. It's just a box, a window, nothing. But uh you also have to put it in main so that it will run Hello World, which is this application here. So okay, uh let's try to make it more interesting, as it says here, as some content.

Now we want to build uh some something. So uh before we look into it, let's just copy and paste and um And then we'll explain it later. So let's just paste it here. Oh, sorry, I messed up because you need to keep the main. So I should not replace the main here. So maybe I have to do this. Oh sorry, I messed up again. So we just replaced the class. I kind of forget what I'm doing. Okay. So we place the class here. Um keep the main because it's important. Uh keep all this import because you need it. Uh do we have some we have something new? We have labels and box and stuff, so maybe I have to change my import as well. Um

Maybe it's okay. I will change it later if it doesn't work. So okay, so um now let's look at this more advanced um things. So what's going on here is that uh now we have more things that we add to our blank canvas. So instead of just the box, uh we can also put something inside. Um so what are these things? So you can put a label And then have a text box. You can input some some more interactive elements there. These are all again, these are all the elements that live in Toga. And then there's also a button that you can say hello. So what is this? So this this is we have seen this, right? We also need a window, of course, and I need a box that everything comes out. But yeah, anyway, let's see how it works.

Um so now we what we can do is to oh look at the label, yeah. So these are the explanations. So now we have to run the briefcase stuff again. So make sure that I've saved and I have okay. Okay. Oh, wow. It's a bit small. I don't know if I can zoom in for you. Oh. So hopefully you have it on your computer. But for those of you so so sorry about that, I can't zoom in. But uh what it's showing here is that there's like uh a text saying your name, and then it's a text box there, and underneath there's a button saying say hello. So Um so uh look at this for a second. So now we have started the death mode and nothing happened. And then now what I can do is that I can type, uh let's say type my name there, just like my name is Chuck.

So I say hello. Hmm, nothing happened. But actually something happened because now it says Hello Chuck in the um terminal. So Uh this this this is something um something you can see some interactive elements in the window in the app um and then there's like this But um you know uh is you know it's just print out something, it's not, you know, is isn't is a normal app will won't be like this because The user won't see this terminal, so is this just an example here. Okay, so let's close it again So of course you can add more elements in it or you can add some changes. So like maybe for example, instead of saying hello in the terminal, you can have another text box and say hello

on the on the application itself. But uh because of time constraint, we again we only have 45 minutes, we don't have like three hours. So that's why we jump into uh tutorial five Tutorial 5, make it mobile. So how to make it mobile? So for me, I'm an iOS user, so that's why I'm uh clicking on the iOS. Also, if you want to build an iOS app, you need to have X code uh installed, which I have in my computer. Um or you can develop Android. So if you have nothing right now, I think Android may a be a little bit easier for you because you don't have to download X code, which is Very very heavy and you may take a long time for it to download. But I will show you um now, and maybe you can try it at home if you want to try it on iOS later, that we can deploy this app that we have just built.

This this very, you know Example very silly app. We can deploy it on mobile. So hmm, okay. What we have to do is to run briefcase create iOS. So again, if you're Android, you can go to the Android page and follow the instructions there. It's more straightforward. So you can see it's like taking a lot long time to uh build up all this like um infrastructure for uh for the x code so it has built something in a new folder inside iOS x code so something has been created there you don't have to write native uh I believe it's Swift uh for for iOS Because BWA has done it for you, so uh you don't have to do that. You you can only write Python and that's all you need to do. And then

next is to um run it. So I would run. No, I think I have to build first. Sorry, I skip ahead. So you have to build it after you have created the all the things that you need. You have to build. So this build is basically converting what you have written in Python into something that could be put into your phone. So this is like um doing all this stuff. That's why it's take quite a while. So oh actually I thought it 's gotta be longer, so maybe I'll just go ahead and run the S app. Mm-hmm Okay, so now we have a choice. Which one do you want? Shout. Mini. Mini? Bring back the mini. Bring back the mini? Okay, this is very

convincing. Okay, let's try. Oh, this this is is this a mini iPad? I think I used to have one. Yes. Okay, it takes a while. Oh, because I haven't done it. Okay, maybe it's a good time for questions. Yeah, that's why I say it's gonna be chaotic. And I shouldn't be so interactive. I should just do something that I've already installed. So but you can stare at the mini for a while Or maybe I should just skip ahead. Sorry. Is it done? Come on. Show me. Oops. What's going on? Okay. Maybe not a good idea. Sorry, Minnie. We abandoned you. Let's let's do something else. Okay. Let's run something that I've tried this morning. For example, I have tried i uh iPhone 14 Pro

because this is what I'm using right now. Okay, so hopefully it works. It's starting, you can see the phone is starting, it's start oh, this look like my phone. Okay, so it's hello world, it pops up. So this is our app So again, sorry if it's too small you can't see. So this is basically a emulator of your phone and then inside is the same app, but this time it's in light mode because maybe this phone is using light mode at the moment. So it's asking your name, you can type your name And then you can say hello and then the terminal will also print out hello check. So it's the same, but it's now on mobile, kind of. Of course you can say, oh, it's just an emulator. But well, if you follow along the tutorial, you can see how you can you know publish it and then download it on your phone and it's quite fun. But I'm not going to do it today because it would again take a few hours.

So let's just stop it from here Okay, so that's beware. We have fun, we love it. Um, but uh this is not the point, right? We are not a bware con, we are at a Django con. So uh let's move forward. But before I move to the Django part, I want to tell you a little bit secret about Toga. So Toga is another tool that come together in Beware. It's a Python native GUI toolkit that you can view your, you know, kind of how your app looks like using just Python. So, uh, how it can do it is that because there are widgets, we have already seen some of it. We have seen the box, we have seen the buttons, we have seen the text input, the labels. Um, so these are all the elements that you can add in your app. Um so you can you know

uh arrange them by using rows and columns. Um also toga style like CSS. So um you know if you are familiar with web development you have play along with a CSS so you you won't have problem with that. But what is very important today in this talk is the web view , the web view widgets of Toga. So uh because with the web view you can build a web browser. I don't know what happened with my tongue today. So you can build a web browser with toga. So this is the link to another tutorial. So this is a toga tutorial. And you can build a browser. So again, like because of time constraint, what I'm gonna do is that I will copy the source code, if it allows me to copy.

So I'll copy the source code. Um I think I only need the main here because Uh oh this um names main thing is like is on the other eyes in the init. py so I don't I don't need it for this case but uh I just need the toga and all this like I need so the app this time is called Grace. Um And I would put it in the main so it will run. I would copy that and then put it here. So this time I can copy everything Paste it. Okay. So this is another app. So this is uh so the title of the app will be called Grace, uh but I put it in Hollower, so It's kind of a hybrid right now, is but don't mind, it it works. Um so again we have a w window, it will have a web view, which is the key point today.

Um then you have a text input, that's where you can put your URL. And then uh everything in a box is just help to put things in their place. Um and we can have a look of how this works. So Uh what I'm gonna do is like I do before I can do the uh brief case def. So I can do a preview of what is this. Ooh Well this is this a browser? So uh on the top you see there's a text box you can put in a URL and then there's a button called Go. And then this is the webpage of the brief uh the uh BWA website. So um let's go to my website. Advertisement. I'm trying to see. Oh, I can't skip the HTTPS actually for this one.

Oh, oh I can just use entered maybe. Oh yeah, I can't just skip the HTTPS. This is kind of like a not so nice browser. Oh, okay, so type my website with HTTPS. And it will go to my website. Woo! So this is quite cool. This is an app. Again, you can deploy on your phone, but I'm not going to do it because it takes quite a while. But you can try it. You can deploy it in your simulator and then you can bring up So you can build your own web browser that works on your phone, which is quite cool, or iPad or whatever. So this is how Tolga can embed a web page into your app, right? This is the this is the next piece of the puzzle. So

what is the last piece of the puzzle? But before that, before I review the last piece of the puzzle, let's look at a Django app that we're gonna do. So I'm what I'm gonna use as an example is gonna be the Django tutorial, which I think maybe a lot of you have already done long time ago when you were learning Django. Um I'm just gonna quickly show you because it's uh I already set it up somewhere in my um in my directory so I don't have to do it all over again. So I'm not going to show you the Django tutorial. This is not a Django girls tutorial, so but Um what I'm gonna do is to uh so go to this uh directory if I can type. Oh, what's going on? Uh okay, maybe clear it up so I c

I I'm more clear about what I'm doing. Oh I'm uh no oh okay. Maybe I have a mistypo uh Right, okay, I'm at the right directory. I would have to deactivate this environment. And then now I know what I'm doing. I'm going to this Django tutorial. thing and then I have another VM that I already prepared again it's just Django living inside so it's fine I would just activate it uh source go and oops oh yeah sorry I always say that like if it's live coding then your IQ just like suddenly drop a lot so like So that's why I'm like, I don't know what I'm doing. Because like, yeah, I'm live coding.

So I have my site here. So this is again like the the fairy beginner Django tutorial. So I I hope it's kind of familiar to you all So now you can see that okay, I have my science and the polling, the polls. Um so what I'm doing is like I'm gonna do um Python manage. If I can remember what I'm doing, meshtop pie, and then I would do a uh run server, is it? Yeah Okay, so I have this, which is a server running. So let's go to a browser and have a look. Oops. Yeah, I'm I'm going to use my normal browser, not the not the Django browser, no, the B-Ware browser that I was playing with. Okay, so I have to type pose as well, of course.

Right, okay, here. Oh, sorry about the small, so I will zoom in. So this is your you know your tutorial Django app. You can vote for what is your favorite ice cream, all that stuff. Yay! Um So I'm not going to go over it right now. Um what I'm gonna do is just to show you that I have a Django app that's working. So it can be any of your app. You have more amazing project than me. You maybe you have something that is like super fancy and stuff, but um I'm just go ahead. and show you how to make a positron app with Toga. So Toga can show you a web page. And so Why not serve because Django is a back-end framework, right? And instead of using a web browser as a front end, I can use Toka

as the front end. I can you know embedded that web view and then I can deploy my VW app together with my Django app, then I would have A app that you have already built, you don't have to build it again, and then you can deploy it now on your mobile. It's really cool. So how to do it? Well of course you can view everything with Toga yourself, which is possible, but I'm lazy, so I'm gonna skip ahead and show you a shortcut. So if it lows, I still have time. Good. Okay. So if it lows, so this is actually the main dish of today's talk. So it's like all of them are leading to here at this point. So this is the workshop that I talk about. That it used to be the workshop that I I want to show people. So um so again, this is I already show you all of this.

You know, you already know how to use VWARE and stuff, hopefully by this point. Um so let's go uh skip ahead. What happened is that uh well yeah of course you would have to set up the environment which are already done so you can do this yourself. But um So I I want to skip ahead to explain the how to create a project. So you know maybe 10-15 minutes before when you see me using briefcase new to create a new project. Actually, it will ask you a lot of questions. Um it may kind of remind you of another Python tool that you're using. It's called Cookie Cutter. Um actually there's a template, uh the briefcase template that actually uh Is

use like a cookie cutter to generate your beer project. So this is the original one However, because we want to create a Postitron app and I'm lazy, I create another template that Already have the Positron built for you. There's already a starting Django project that comes together, so it will be way easier to do it. So you don't have to build everything yourself. So Let's follow it and try to create that. Oh, but I've cheated a little bit, of course. Oh, let's uh end this first. Okay. I've cheated a little bit because um Here I have already created the environment, of course, and then I also have another one that is ready.

If something goes wrong, I will just load that one. Always, you know, live coding, right? So I would now go into the uh environment. Source, uh positron vm And bin activate. Okay, it's now I'm in the so I think this will be a long list, but anyway, I've just like installed the prerequisite that I have show here earlier. So I have beefcase, I have toga, I have coqui-cutter, I have Django. So everything is ready. Um so now what I'm gonna do is to uh Um cookie cut this temporate created by me. So you can see my GitHub username here. But before that, uh I want to create new one.

I don't want to mess up with my original one because that's my lifeline if anything goes wrong. So I will just create new and then I will go to new and then I would do the cookie cutter thing Okay, so this. So yeah, I've done it this morning just to make sure it works. So a name, so I would just like pause it run if I can spell. Ah, I can't spell. Okay. Pause Citron. Okay. Oh, I'm missing an S. Ah. Ah. I have to type again. Okay. Okay, this this looks correct to me. And then like everything will be updated. Just code post it one. I don't have to type it again. Great. Um project awesome, or you can just put code post-it run again, because I I don't want to have like, you know.

uh you know call my own project project awesome is a bit arrogant okay um so anyway I don't care uh I can be Jane for now and then email and then You know, uh example. com is a very cool domain name. I want to buy it. Okay. Um license again. Um it's example. I can just use any license, or you can use MIT if you really care. Uh you know But anyway, choose the one that works for you. I don't really mind. So a GUI framework. Now If you have really good memory, you see that now we have two more options than last time we are we were here. We now have number six, uh positron Django, and number seven, positron static. So static one is just uh in other like my shortcut to generate another app, but let's use number seven

for the trunk Django. So Using that and then I can use PyTests. I like PyTests. Uh for these. Don't worry too much about it now. So okay, so now what I have is a new infrastructure, which is, you know, just like briefcase new, you create a new thing So inside you should also see all these things. So uh it's difficult to see, so let's open so let's where's my IDE? Okay, so I have I should have it here as well. So in the new. So this is my new Postitron. This is very similar. I again I know that you can't see. I'm so sorry about that. But you will have. So this time I can read it to you. So inside source, there's like Postitron and a web app. So one of them is a web app, which is a Django web app actually. If you inspect the file inside, oh it looks like a Django project.

It's a Django project. And it is Positron as well. So how are we doing with time? We are good on time. Good. So Next step. Next step we want to. Where 's my own project? Here, okay. So but you may have questions since like So first question, um when you start a new Django project, it will generate a secret for you. And now you are copying it from a template. So If you didn't change the secret, everybody's using the same secret, which is not a secret, so it's not good. And of course, like this is a demo. You should not be doing what I'm going to do because this is not deployment safe Um but since this is a demo, I will just generate a secret

secret key for it casually. I'll just paste it there. Um don't do it when you are doing something that is in production. So what I'm gonna do is to uh use this Django command to generate um a secret for myself. Uh so what I'm gonna do is go to back to my terminal. I have to find back my Django project. So I'm going here and then I have the web app red open source and then web app so here you will see I have the managed. py this will work So now I have a Zigridge, so this is my Secret. Of course it's not a Secret, I'm showing it to you, but this is not for production, so it's okay. So okay, let's go to here. And do you know where the Seagrets live is supposed to be in settings.

py and here. So I'm putting a C word here. Again, like this is not production safe. Don't do it. Um just for fun. So after that and uh now you can actually see if things work. So this is very important to check if things work. So let's go back to where we were. Uh I forgot where we were. Oh, sorry. Which is positrons. Where am I? Okay, here. So now I can run briefcase. I don't want to have typos, so I'm just gonna copy and paste. Okay. Woo! We have Django! Well, this is this is the screen you see when your Django app is empty. So closer to what you want

because now you want to deploy your own Django app. So the next step is to deploy your own app to replace this Empty app. So let's close it and do the next step. So we have around 10 minutes, so let's quickly get it done. So um The following thing is a little bit uh you know because you have to change a lot of code, so if I miss anything, I'll just go to my fail-save one and just run it for you to see. But anyway, um so uh What I'm going to do is kind of like I'm always thinking now I've become a surgeon because I need to do some surgery to my app. So what I'm gonna do is to um so look at my So close all these other things which is not relevant right now. I know you can't see, but this for me. So I have a Django tutorial.

I have my site here. So I want to replace my um BY application here. Okay, so source here. So yeah, it's like it's like surgeon precision. So So my web app needs to be replaced by um my site. So all the content in my site should be now in here. So uh what I have is so inside my site inside web app I want to replace this web app with these two and maybe the And maybe the database as well. Shall I replace the database? Maybe I shouldn't. Yeah, so what I do is like I would have to uh you can you can start developing or you can copy.

So I'm just gonna copy. So I'm gonna copy all this. So copy and then this one should go to the bin and then whoa nothing here and then Paste. Ooh. Okay, again, if this doesn't work, I have my fail safe mechanism. Okay, so this is kind of like half of the surgery is done. So um what there is the what is need to be done is Here, it's documented here because now the path has changed. Um instead of my instead of my site sitting inside my site, now my site is sitting inside web app So the names are different and the locations are different. So I have to kind of do some surgery to change it. So what I have to do, uh let's let's give it a try again. Like I have some fail-safe mechanism.

So I have to change, for example, the uh Django setting module um environment variable need to be changed. So hopefully I can find it. So uh it should be in app. py. So let's go to app. py. Um to do do okay, I can't really see. It's too small for me to see. Okay, here. No, it's not here. Okay, this is very tricky right now. Is it here? No, I don't think it's here. Um Yeah, it's inside Positron. So this like is it the setting? So let's change the setting first maybe because again my IQ drops to zero when I'm live coding. So let's do this bit which is the setting.

py need to be changed. So I would change all this stuff. So roof call roof URL need to be uh root URL here it needs to be changed to this one because now it's sitting inside web app so I have to change it and then the uh WedG application path also needs to be changed. Uh. Can't find it. Can't find it Do we have time? I feel like I'm like kind of diffusing a poem. Where is it? Okay, there we are. Okay Yeah. He's like, don't play anything like tick tick tick for me.

I would be like totally panic. Okay. This one is this one okay so the setting is done so what's the next one next one is url needs to change the path to include so I'm um again like this needs to be web apps dot post so This is the paths, right? So this URLs. This should be. Oops, am I looking at the right thing? So polls need to be, yeah. Pose need to be Did I not change it correctly? Oh here, sorry. Post needs to be here. Okay. Okay, what's the next thing? is the name so in the post. app need to be changed as well the name because otherwise it won't register. Um yeah it's like a surgery

Okay, what's the first bit that I skip over? Um so Processron source, uh Processron app. py. So the uh environment variable needs to be changed to this. Django setting module. So this is inside Positron. Okay. So is this bit that there should be a um setting here that I I have to make sure this is correct because this is my site. It's not web app anymore. And the last bit is that when I call in the URL, I have to call the post. Remember the this no index page for this app. I'm so sorry. So I that's why I have to call in. the pose. So it should be here. Okay, so this time let's hope it works. Otherwise I again I would just show you what I have done before.

Let's run it. Oops. Something goes wrong. Okay. Migr. Hi, I forgot to migrate. Yeah, you are right. You're right. It's good that I have some reliable people here. So let's go let's go to uh the the the Django part and migrate it. Uh okay. So what what was that again? Um my site web app my site Right? Let's see. Yeah. Python manage migrate, right? No magical something's gone. I don't know what's wrong. Okay. At this point I think I'm too stressful. I have five minutes left, so I would just copy and paste what I've done. Sorry. Okay, so uh let's look at this one.

Right? This one I also have everything. Yeah, I don't have yeah, I have a migration, that's why. But I don't know why what what was wrong. So I'm too stressed. Let's just copy this. Copy. So web app needs to be replaced. Uh right, right, right, right. Yeah, so I've got the new Fositron and then source. The web Up so let's replace this one. Okay, so pretend that you didn't see anything and nothing goes wrong. So let's try again. Okay, let's go back to the top directory.

Okay, so let's do the beware dev, uh briefcase dev. So okay, this time it works. Magic! Woo! Um so yeah, uh so you can vote on your ice cream. So sorry this is so small, it's not like a web page that I can zoom in, but it's basically the same thing as the webpage that you have seen maybe 30 minutes ago. So Um so yeah, I have actually have uh four minutes left. Oh but before before I go before I go. Um I want to talk about the design choices So now what you have seen is that I have locally served Django, right? So basically all the data is stored in the the the the um the database that I failed to migrate. So all the data is stored there

is preserved but um what if your application is not just a local application it needs to connect to something online a database online um You could probably uh using the similar kind of philosophy instead of serving Django inside the same app, you can maybe already have a Django app that you have deployed somewhere and that you Build a B Web again using WebView, you can connect to Django. Basically, it's just a wrapper, right? It's just like building the browser, it's the same thing. Um, but it only works when there is a connection So what you can do is maybe you can combine both. So you have a locally and online surf Django. So uh you have a database to store the local data.

It 's kind of be there, it will work when there's no connection, but when there's connection, you can sync the two. So um but this is super complicated and it's out of my ability to show you. So I think maybe you can figure something out. Um so that's the end. Um again, uh I want to give DjangoCon Africa a shout out because uh it You know, a lot of organizers is here at this conference. You can talk to them more. It's the first Django Con Africa ever. I really want to go, but I can't go. So I really want people, if you get a chance, uh you can go uh if you want to or you can support them by donating to them. So thank you so much.