Modern Python Projects Transcripts
Chapter: Let's build an app
Lecture: GUI for the uptimer
0:01 We will continue using our uptimer. But this time I have turned it into a very simple GUI application. So instead of using it from a terminal,
0:11 we will have a simple graphical interface that will be more user friendly. Let me quickly show you how this application looks like.
0:19 I have removed all the additional files from the previous chapter and I left only the setup.py and two Python files.
0:27 First one is called helpers and this is where I store some helper methods. Here, I have left only the check URL method because I no longer need to
0:37 use click if we are not going to run this application from the terminal.
0:42 That way I will also have less external dependencies because I no longer have to install Click. But if you like,
0:48 there is nothing wrong with leaving all the files from the previous chapter and then just adding this new file with the GUI.
0:56 That way you will be able to run this module either from the terminal or from the graphical interface. Speaking of graphical interface,
1:06 I also have the second file called gui.py. Here I've added some functions to create a very simple GUI. I've decided to use the tkinter Library.
1:22 There are other libraries, but tkinter is a builtin modules, so that's the easiest one to use.
1:28 Let's first start this application so you can see the interface, and then I will talk you through the code. So let's go to the terminal.
1:39 I already have some venv activated, but I need to create a new one. As usual, we start by creating a new virtual environment,
1:51 and then we activate. Next, we have to install some dependencies. So if we go to the setup.py. you can see that I still depend on the request library.
2:07 So let's install it. As you saw in the previous chapter to install dependencies from the setup.py. We have to run Python setup.py install.
2:21 This will install both the request and also our application that I'm now calling guptimer because it's a GUI application.
2:31 And as you can see, we have the entry point that it's now pointing to the main function from the GUI file in the tree uptimer module, so we should
2:40 be able to run guptimer in the terminal and that will start the graphical interface for us. Let's give it a try. So, that's how it looks like.
2:53 Depending on how you install tkinter, you might get some duplication Warning. I think I'm using tkinter that comes built in with Mac OS,
3:02 and it's some kind of old version, but as long as it works, we don't have to worry about that. So this is our simple application.
3:10 And if we try to put some URL's here, we can click check. And now we have this green 200 saying that everything is
3:23 fine with this url. Let's see the code behind this. Move this here, in the Gui.py.
3:47 We have the main function, but when we run it, this function is called. At the top, We have the check_URLs(),
3:55 but we can skip it for now and then we have a function that creates this window. It changes the color to a light gray so we can see where we
4:05 have a text area and where we have just a background. Next, we are the label here. We add the textbox and we add another textbox.
4:15 But this time we disable it, so users can't modify it by hand. Then we create some tags, and we can later use those tags to change the
4:27 color of the text. And finally, we place the button at the bottom and we connect this button to attract
4:36 URLs Command. And just before the end of this function, we start the main loop, so our program will actually respond whenever we click the
4:44 button.So when we click the button, the command check_URLs() is called and this command grabs the list of URLs
4:53 from the textbox and strips them and creates a list from them. Next, we have to change the state of this response box,
5:01 and that way we can actually edit it. When the state is disabled, you cannot modify the text that is there.
5:09 Next we go through each URL in our list and we call the helper function, check URL to get the status code. If we get the status code,
5:18 we write it to the response box. Then we grab the color corresponding to that status code,
5:24 and we colorized this text And if we don't get a status code, we just write wrong Url and use the default magenta color.
5:33 And finally, we again disabled this response box so users can't edit it. Let's test it with a few more. URLs, At the bottom of this page,
5:44 I have a few more test URLs That will return Different Http codes. So let's copy them. Let's run them here. Correct. So this is how it's working.
6:02 We can modify things and you can see the changes are reflected on the right side
6:07 So this is the simple GUI for the uptimer that we will be using in this chapter.