Dockerize Python Applications with GUI

Key Takeaways

what is going on guys welcome back in this video today we're going to learn how to darkerize a python application that uses a graphical user interface so let us get right into it [Music] all right so what we're going to do in this video today is we're going to learn how to dark rise python applications that use a graphical user interface as an example for this we're going to use a very simple graphical user interface only relying on the core python module TK inter but of course you can do this also with pi qt5 and with some more advanced graphical user interface Frameworks if you also install the necessary packages now the basic idea behind dockerization or containerization in general is compatibility so instead of me building an application be it a web application be it a GUI application or some complex collection of classes and modules that are interdependent when I deliver them to you I don't have to explain to you that you need to install this package in this package in this package and you need to downgrade this one and you need to upgrade this one and then you need to set some environment variable and then you need to create this directory and add this config file I can just deliver to you a Docker image and you can just build a container based on that Docker image and everything the application needs to run is already in in that ecosystem in that closed system you don't need to do anything on your system because the system that the application is running on is the docker container itself that's the basic idea but things get a little bit more tricky when you add a graphical user interface because then you don't have a monitor you don't have a display you need to connect to a so-called X server so you need to connect the docker container to a display which we're going to do in this video today and you also need to install some packages and depending on the framework that you use you need to also install additional packages but as I said we're going to use just TK enter today and we're going to get started with a very simple python application we're going to say import TK enter STK import TK enter Dot message box or actually from TK enter Dot message box we're going to import show info and then we're going to create a root element TK dot TK we're going to define a functions a function show message which is going to take actually we're not even going to take a parameter we're just going to say show info hello world like this and then we're going to add a simple button we're going to say that the button is a TK button with uh the text being equal to press me or maybe click me we're going to add it to the root element or to the root window and we're going to say that the command of this button should be show message and here we just pass the function so we don't call it we just pass it and then finally we say button pack so that it's part of the UI and then we start the root main Loop very simple nothing too fancy this is not a tutorial on GUI programming I have multiple of those on my channel this is just a simple graphical user interface where I can click on this button and actually this is just a title let me just change this line This is some title in the actual message here is hello world let's run this again now I can click and it says hello world that's the basic idea and this is just something that we can use here as an example you can build a graphical user interface that's more complex as long as it just uses TK intern nothing should be a problem here um what we're going to do now is we're going to create a Docker file which is basically the definition for the image we're going to specify what python version we want to use we want to specify all the packages all the commands that need to be run in this case we don't need any external packages so we don't even need to run pip install anything um but this Docker file will be used then to create an image and with that image we can then create a container so we're going to create a new file we're going to call it Docker file with a capital D and in here we're going to now Define some basic stuff so first of all I have a video on dockerization or containerization with Docker off python application on my channel where I explain everything in detail where I explain everything from scratch in this video I'm going to assume that you at least know what Docker is that you have Docker installed or you're able to install Docker because this is a specific use case of dockerizing a GUI application if you don't know how to dockerize anything in the first place watch my first video and then come back to this video afterwards so we're going to start here by saying from python and then 3.9 this is going to be the version that we're going to use uh actually I think we can also just use slim let's see if this messes up anything uh we're going to justify this python version here we're going to say that the work directory is going to be slash app inside of the docker container we're going to um if you have any requirements we don't have any in this case but if you use something like Pi qt4 anything what you would want to do is you would want to create a requirements file so for example requirements Dot txt and maybe you don't even use some GUI stuff but maybe you need some other packages that your application uses so for example requests or anything what you would do then is you would say copy requirements txt into the current directory and then run pip install and so on and so forth Dash R requirements txt but in this case as I said we don't need this because we're just working with a core python package so we're going to get rid of this and what we're going to do now is we're going to just copy um everything here into the Container so we're going to just or into the image so we're going to delete the requirements file I'm going to just say copy everything from this directory into the working directory so copy dot dot uh and now what I'm going to do is I'm going to install some packages um for some Linux packages essentially um and the thing about this is that probably you can also get this to run with different packages or a different combination of packages I tried around a little bit and this is the combination that worked for me chances are that some of the modules some of the packages here that I'm going to list are not going to be necessary to install so maybe you can dismiss some of them discard some of them and it will still work maybe um you can exchange some of them but this configuration as I'm going to show it to you now here worked for me and it's going to work in this video so what we want to do here is we want to say run apt get install or actually first of all we want to say update and then end end apt get install Dash Y and we want to install lipx11-6 lip x x dash def lip X render Dash def now you can actually also just make a line break and I think with a backslash you can escape it but I'm going to just write all of this in one line let me just see if I'm not blocking this I'm not that's great so X render then we're going to say lip X in Rama Def uh lip x i Dash def so all developer packages here lipx rent R Def lip X cursor def lip X TST actually I forgot the X here death and then TK Dash def for TK enter to get this running and then we're going to say end end RM minus RF so basically delete everything Force the deletion off slash VAR slash lip slash apt slash lists and everything oh everything in here so those are just dependencies here those are just packages um you can type them off from here maybe if I don't forget about this I'm going to add them in the link or not in the link I'm going to add them in the description down below if I forget this you can just type them off here from the screen so those are the packages as I said you can play around you can try to remove one of them and not install it I didn't try all the possible combinations but those are now dependencies that we're going to need to have a graphical user interface in the first place and then we're going to stream the display onto our X server on windows so that we can actually see what is happening in the graphical user interface of this container um and finally all we need to do here is we need to say CMD python main py that's all we need to do this is the command to run the actual application so this is our Docker file now it's very simple since we don't need to install much other than some basic graphical user interface packages we don't need to set up anything because the whole X server configuration to hold display configuration will happen when we actually run the container so it's not going to happen yet so what we do first is we build the image then we install an X server or an application that can that we can connect to and then when running the container we're actually going to specify that we want to connect to the server so what we're going to do now is we're going to open up a command line and we're going to navigate into this directory in my case not deep phase desktop then after desktop we're going to programming we go into neural 9 we go into python we go into current and here now I'm going to run the following command Docker builds Dash T and I'm going to just call this now GUI underscore image and I'm going to provide a DOT to specify the current directory um and of course I didn't start Docker so in order to be able to use Docker in the command line I'm sure you know this if you're watching this video you need to also have Docker running so I'm going to run now the instance of Docker desktop I hope this works because sometimes it doesn't in this case I would have to restart my computer um but Docker needs to be running and then you can use it and of course you can also install Docker if you don't have it yet in my case now it actually uh succeeded so what we're going to do now is we're going to just run the command again Docker build Dash T GUI image and Dot and now it's building the image so now it's going to um execute all this now it's going to go through the whole Docker file and apply everything I'm going to skip that part because I think it takes around 180 or 200 seconds so we're going to skip this and I'm going to come back to you once it's done all right so we're done with building the image it took 172 seconds and what we're going to do next is we're going to install an X server for Windows I'm going to go with xming you can also go with another one like vcx SRV so vcx server um I'm going to go with xming in my case I already have it installed so I can go into the start menu and type xming and I can open the file location and then I can right click and I can say open file location again and I can see this executable here and what I want to do now is I want to right click and I want to open the terminal here this is only possible if you have the terminal app otherwise I don't think that you can right click and open just a command prompt if you don't have Windows terminal installed you can just open up the CMD command line you can go up here you can copy the path you can say CD and then the path and then you also are in that directory but I would recommend installing the windows terminal just looks better um and here what we're going to do now is we're going to say run or actually not run sorry we're going to just uh call the executable file but we're going to specify a flag which is Dash 8C to disable access control because this is necessary to actually be able to get uh the display from the docker container and to actually allow it uh on the x-minx server so this is a very um cheap solution of course if you're running this in production if you actually want to do this properly you probably just have to add an exception or you have to allow the docker connection I'm just going to make it very simple here by specifying this uh flag here so I'm going to run this and you can see now we have this Windows Server running nothing is visible here we just have some uh somewhat blank screen and what we want to do now is we want to navigate or actually we just use this terminal here we're going to Now set a display variable in our system that is going to provide the IP address for this x server which is going to just be our local IP address and then we're going to run the docker container with that display being specified so what we're going to do now is we're going to say set display or actually before that we need to run ipconfig then we need to get our ipv4 address in my case the actual one that I'm looking for is the ethernet adapter so ipv4 address this is the one so what I'm going to do here is I'm going to say now set display and I'm going to say equals this local IP address and then colon 0.0 that is now the display variable so this is the command I enter here and now what I want to do is I want to run this Docker container and specify that display as a display to to to use so I'm going to say here Docker run Dash it dash dash RM Dash e and we're going to say display equals percent display percent to actually get the uh the value that we just set here and then we're going to say dash dash Network equals host dash dash name I'm going to call this now GUI container the image that we want to use is the GUI image and that's actually it so we run this now and what we should see is there you go in the Windows Server here in the X server we can see this click me button now of course this is not going to be the full um UI or it's not going to be in the exact same style as you're going to have it on Windows just because you installed or we installed a very minimalistic graphical user interface but the elements will always be there so if I have multiple buttons and labels and text boxes they're going to be visible here and when I click now on click me you can see that it opens a message box in info box hello world so again the style is different of course because this is running now in a Docker container that has almost nothing that Windows has but we still are able to display the UI elements we have enough packages installed to do that and we also have the functionality and of course if you have now some functionality that is depending on the request module and maybe on beautiful soup 4 or some other packages this is also going to be running in the background triggered by a button click for example if you want to uh if you have everything installed in the docker container uh so that's the basic process again to recap we built the image we have the docker file this file here we install all these packages uh we then install a Windows server or an X server on Windows we specify or we run it with this flag that disables the access control this is again a simple way to do it there's a more professional way for sure and what we do then is we get the local IP address we set the display variable locally to be that IP address colon 0.0 and then we run the docker container specifying this display as the output display uh specify Network host giving it the name using the image and then it's running and we can see the result here in the Windows server in the X server that it's connecting to so that's it for today's video I hope you enjoyed it and hope you learned something if so let me know by hitting a like button and leaving a comment in the comment section down below and of course don't forget to subscribe to this Channel and hit the notification Bell to not miss a single future video for free other than that thank you much for watching see you in the next video and bye [Music] foreign [Music]