Will PyScript replace Django? - What PyScript is and is not

Um well thank you so much. So um thank you for having me here. Um first of all, I I'm not a Django developer. Uh I have finished the uh Django Girls tutorial I have finished I have finished the tutorial on the documentation side and that's it. That's my Django experience. Um so so today I'm not going to obviously teach you Django but I'm going to tell you about PyScript and um some fun facts about it and also a little demo to show you how you can use PyScript. So um very very exciting stuff and that is the uh how you can get the slide. So I always put it there at the beginning and I always spend some time talking about other stuff so people can take pictures of it if they want to find the slice later.

Also attack me on Twitter. I love people tagging me so yay Um so how many of you here have heard of PyScript? Yes, ooh, we're getting popular. That's great. That's great. A lot of people heard about it right now, I think Um, you know, back a few months ago there won't be that many hands and people will be like, what is PyScript? And now people know about PyScript. So um But before I jump into PyScript, I would introduce myself. I'm Czech. Right now I work for Alaconda as a developer at Africard. So if you have any um Any questions about uh data science stuff or PyScript stuff, you can talk to me. Uh I will try to help you. If I can, I will find the right person who can help you. So I also involved in a lot of open source projects.

I love open source. Uh that's why I am here in the community. And also contribution is not just code. I also organize a lot of uh events. So I hope That's also Cantus contribution as well. And I uh stream a little bit on Twitch when during the pandemic because I was too bored. So um what is PyScript? So um So a lot of you already heard about it. I'll just quickly go through uh the checklist so make sure everybody is on the same page. Um so what is PyScript? Uh PyScript is a framework So yesterday I gave a live stream talk about a conference called PyJamas and people asked me, is that a framework? So I think nowadays we need to be clear what is what, right? So PyScript is a framework Um PyScript uh lets you run Python applications in the browser.

So it's the front-end stuff, right? You know, it's just that, you know. Um and even though it's running on the front end, uh it's not try to replace JavaScript, uh you can use it with JavaScript. Um and because it's using PyODI. So Py ODI uh actually kind of have a lot of uh APIs that you can convert Python objects to JavaScript objects and vice versa. So Because PyScript used PyODI, so uh there's a lot of operations. It's kind of very similar to using uh JavaScript. Uh for example you can uh create some event listener or you can have some um uh things that you can um con you know uh have interaction with the dome and other stuff and

um uh Pyce Group is uh is capable of doing that because now we can uh have uh you know the Westum which is the WebAssembly so uh we can interpret Python into WebAssembly. So um so PyScript's actually standing on top uh of the shoulder of the giant, right? So we have a lot of amazing projects in the Wasm and PowerDye um kind of things. Also the m uh micropip that is using uh we use micropip for a lot of things as well. So so those things empower PyScript Um and it makes a lot of uh popular package available. So uh a lot of computational stuff, the scientific computational stuff like um scikit-learn, pandas, numpy, those

uh available. Also other like visualization stuff that data scientists love. So this is a very good tool Um so um I think it's easier for me to explain it if I show you an example. So this is uh how to use PyScript. This is how you use PyScript. Yeah, so it's just a script. It's just JavaScript, right? Just like put it in there and now you can write Python. This is that simple. So this is a hard world example. So it it just generated this page. I just put it in as an iframe. Um so uh it's nothing special, but this is generated from Python. This is why it's a hardware example. Um There are actually more examples

in the official website, also all around in the internet. So you if you are interested you can find more. I also have an example. Later I will show you. So uh so you see that this right, like this you have to oh you have to call it in from the PyScript. net. Oh also by the way it's in alpha, so um you know, take it with a grains of salt and you know it's not very stable yet so uh prepare be prepared that things may change and actually you can help the change by um just giving your feedback and stuff. So So this is you call in, right? But what if I want it to be more stable? I want to, you know, because it's enough, uh things may change. I want it to be stable, uh, you can self-host it

Um just like other things that you do with JavaScript. So I can actually show you in my example how you do that. So I've talked a lot about PyScript. Why I'm talking about it, why like why we care? Because I have other stuff that I could use. I have the HTMX, someone told me, that you can do things in the back end. Why do I have to um excuse me? So I don't have to do it on the front end. Excuse me, choke

on the water. Because um sometimes we need to um do things in the front end uh like we do all the time. So resemble some stuff are computational heavy. If you have lots of users, um you can't always do things in the back end because Because um things um scale up Not as well if you would do everything in the back end. Um also

um sometimes you know I've a lot of people tell me that oh actually PyScrip is nice because Now I can let people try out stuff, right? Um big because before if you want to uh create a sandbox for uh people to do it try some code and stuff. It could become a crypto mining playground for people to run code that may not be something that uh is what you intended, right? And also sometimes you just can't do it at the back end because some user they may have some data that are too sensitive, that um they are not going to submit it through the internet to your back end You have to do that in their own machine because you know

it could be some personal data that they should not share with some other people. So it has to be stay in their own machine So, um before I show you the demo, we'll PyScript replace Django. The answer of course is no. So that's actually a clickbait, so that's why you come to the talk. But um but yeah, if we um Put this stuff together, we can uh actually make some amazing things if you we use the PyScript together with Django. So um Here's my examples. I'm gonna spend the rest of the time show you what I have done. I hope uh you would uh find some use for this So uh all the code hosted on GitHub, you can have a look at it.

Um I'm gonna show you what I've done. So now I have a Django server running. It's a bit messy here, but I hope you see that. Um I'm now running a Django server. So yep, we get all the static file. I'm gonna explain to you what happened here. So um so this is uh the index. html. So what happened? I would first just show you um how we build the model. So what this example is doing is actually um recommendation thing, so maybe I'll show you this first. So uh favorite movie, I put Iron Man Yes, uh that's oh. Typo, typo, okay. So I would have let's say five uh recommendation

I hope you can see it. It's a bit small, but I don't know it whether so it's running actually. Yeah. So um I have uh five movie that was recommended. So I can continue with this, you know. Um oh give me more if I like this one. Uh which is I think it's Batman movie, right? The Dark Knight Hmm, yeah, so I have woe ye now. So let's just go on and on and I can go from woe, what what are we gonna get? O ye from Maybe some robot things. Don't know. So um so this is the recommendation engine. So this is actually just run on the front end. So um we'll show you what I've done. Um So you first of all uh you need to get the data.

So I got the data from this um Lens uh movie lens dataset. So uh It's all on the RIGM if you want to see the GitHub repo. So you download the the CSVs which um contain all the ratings from all the movies that they collected So in there, um uh I have uh do some some some some uh things. You you can do better than me than this. Like I'm just using some command line to load them into the model, but if you have something more automatic you can do that. Um so load the uh the CSV into the model and then um you train the data. So um I've done this with again a command very basic. Uh you can do something more sophisticated than I do because You are better than me at Django, so you can do this.

Um but anyway what I've done is to uh use the CSV to uh create um to uh model that I pick code. So there's actually two things here. One is actually just the title and the ID mapping The other is actually the um the actual matrix that are used to uh get the recommendation, uh to get which movie are closer to which one. So if someone put in a movie name Then I would get recommendation for the closest X movie. So for example, five I just show you, or ten or eleven. So um this is how you do it If you want to know how to create this recommendation engine, actually I'm running a workshop on Saturday, so you can come and

come and try it yourself. But anyway, so this is just preparing the data for uh for use. So after this, the tricky bit is to uh deploy it to uh to a to for the user to use, right? So after that I'll actually dump them. But um where I dump it, it will be here in the step. No, don't load it. In the static file, because they're too big. So in a static file you have these two pickle. Again, you can use other format. Pickle is not the best, but I'm just using it for now. Um so you put in the static file and it can be consumed by PyScript. So in here this is uh the the template for the index uh HTML. So I'm just calling it all this file that I need.

So let me explain pynth here a little bit. So in pynth, um You have um you have uh a few files. Excuse me excuse me one second. So I host all these files. So I have the Python file. This is where the model sits. And there are also the model that I've trained. So they are all like hosted here. on the static files. One extra thing that I because I need uh some Python packages to do this, right? I need the Psyche Learn. Which is how I deploy the model. And I also need this fussy woosy library.

So you see here that's a two things that I've done differently differently. So here you see the um in the static uh here that actually I can host the wheel by myself um to the uh environment here Um you can do that with most packages, except those that are not purely written in Python, which Cyclone is, because Cyclone also involves a lot of um algorithms that uh speed up with uh C code and other stuff things. So um I have to call in from Python. Otherwise you can all host it on the same server if you want to. So you have a close environment. But unfortunately psychular and you can't do it yet.

So you have to call it in So these are the environments that we need to run the your Python code. So your files, your models, and the packages that you use. So you all host it there. And then you have um your script. So this is just Python script. This is exactly like uh how I would write a script to deploy this model on uh with Python So here I we can see that I have also do something for a hacky thing. For example, here in HTML, I mean PyScript right now, uh you can't write HTML into your um You're uh for example I want to write into the output here. Uh right now you can't do it directly because um the HTML attack will be removed for

safety reason. Um So I'll just do some hacky thing here. I replace some other thing with the bracket so I can create some HTML code. I can put it here. But yeah, uh so if you have any suggestions that PyScript should do it, you know, please there's actually a discussion um uh thread uh on GitHub so you can uh Chip in if you want to. Um so this is the uh this is uh basically you just run the code. You take the uh the the user input, right? And you you take it and then you um run the model and then you so so this uh KNN recommender is the um where it happened so it stayed in another Python script that I put it again in the static file.

So after that like you push in the model you have the your KNN recommender And then it would just uh find the top end movies, it would give it back to you, you can just write it back to the the DOM. This is how I do it here. Um So this is basically what PyScript looks like. If you want to, again, if you want to know more about it, talk to me. You can also find this code on GitHub. So here it's all on here. Um have a look if you want to. So the link is here. Okay. So There are more examples. These are more um visualization focused example here. So

have a look if you want to. QA time. So um so far I've been talking about PyScript and a lot of people ask a lot of questions. And um I want to add more to this list. So if you have any any questions, please ask me, then I will put some of them here. So I will keep us answering some questions. First of all, can you pull in a Python script? Yes, I've just done it in the example so you can have a look. Um what is the Python version that we're using? So um PyScrip is actually using PyODI, like I said. So whatever PyODI is using right now, the latest, it is the Python version. So you have to check with PyODI. Is there any way that you can pin

a Python version? No, not a simple answer to that question yet, so we are still working on that. Why can't you use uh the the tag, you know, just like JavaScript, right? Script and then Python. Um you can't because uh most browsers are not supporting that yet. Um so that's why PyScript has to use a uh custom defined script that is Py Python script. Um so Uh that's what we're doing right now. Again, it's in alpha, so things may change in the future. Um why don't you you just use PyOD? Uh it's like uh this analogy is more uh data science-y, but uh I would say that it makes using um Python in the front end much easier because um in Pyodai

if those of those of you have tried Pyodai uh there's a lot of APIs that you have to have some understanding of how um you know the front end work, how you can work with uh JavaScript and other stuff. Um with PyScript, if you just have a simple Python script, you can just run it. Um it's not a big problem at all. So you can do that. And someone asked me a question, like can you pin a packaged version? Right now there's again no easy way to do it, but you can host the wheel yourself, like I did if you want to. But that only applies to those that the package that's purely written in Python. If it's not, then you may come into a dead end and you have to uh see what the maintainers offer you in the future

or you can chip in to help uh how you know we we should do that. So um So that's basically what I'm going to tell you right now today. So if you want to know more, actually there is an event coming up in November in not too far from here in Lisbon So uh the Peter, uh our uh CEO, uh also the uh the person who announced PyScript a few months ago, uh he will be there. So um you know go there if you are in Lisbon and you know you can talk to him and ask him more. So um also at the end my job has gone but I've already talked about it many times. I've stickers so come to me to get stickers So I think probably that's it for today. Sorry about the short talk, but um yeah, uh

talk to me and I will answer your questions. Thank you.