Towards Django | TensorFlow - Image Classification Example (Basic Example)

hello and welcome back to another tutorial this is a response to a member's community question this is how this tutorial started so what happened i sent them this link to this image classification with django and uh tensorflow and then a bit later on i had a look at this tutorial and i realized that it's just not gonna work so i thought i'll make a tutorial um which is based or originated from this tutorial on how to set up like they've done here um tensorflow django image classification in a really kind of simplistic way it was a really good inspiration because there's lots of new things to learn here even though we're just going to go through tensorflow in a really kind of basic way here for example tensorflow we can't utilize python 3.9 not at least with uh tensorflow 2.0 so we have to use a different version of python so this is a good opportunity to show you a really crude way of installing um different versions of python on windows very crude way and then utilize that for our virtual environment not environment i need an end there environment so once we've done all that we go through installing dependencies for tensorflow we'll set it all up in a really simple django application and then this also gives us a a quick view of managing files from a form so there's a number of ways we could manage files from a form so we'll just go through how we can maybe collect um that image from the form and then maybe perform some actions on it okay so i hope that's super clear what's going to go on here i don't want you to invest your time into something that you don't need to or don't want to learn so let's get started so just for those who need further classification on what exactly we're going to do here you can see this is a kind of final product there's no polish here it's going to be a simple form you're going to choose a file so once you've done all that you can upload and then it's going to produce a string similar to this and you can see here that um this has been classified as a tiger cat this image it is a picture of a cat so you've got some weights here um also now i haven't gone the extra step of extracting this and make it into a nice list etc but you can clearly see the data that's being returned the images the image is being classified in this case as a tiger cat i guess that's a 73 egyptian cat tabby and so on so that's the image classification that we're going to build so the first step here then we're going to need to install a different version of python so on my machine here let's just take a look in the command prompt i'm just going to type in uh python version i think i've got 3.9 installed so i want to now install a different version of python so like i said i'm just going to show you kind of a crude version to get this working with a different version of python now if you do want me to show you a much more advanced tutorial i say advancer a different tutorial on how to maybe more effectively manage different versions of windows please let me know if there's enough of you i can definitely make that that's not a problem so all we need to do is go over uh to python.org and then we just need to select from the downloads in this case windows the kind of the different version that we want to download so uh let's go to all releases sorry so here we want to potentially install 3.8 um so here's 3.8 3.8.8 so just go ahead and download that just make sure you're downloading the correct version for your operating system um so windows users it talks about that and so this is the windows installer here so just go ahead and download that so as you go through the installation the advanced option what you want to do is customize the install location so you can see here that i put all my python versions on the c drive so i've got a folder for python 3.9 which is a python 3 9 folder so here i'm going to create a new folder on my c drive and install this onto python in the python 38 folder so here you go you can see on my c drive i've got a folder called uh python39.38 so what i want to do here is when i create a new virtual machine i basically just want to select the python exe from this folder instead of utilizing the default which is set up python 3.9 now i don't want to start changing kind of the environment variables um at this point i could do like i said we can go through those type of processes but it's just easier and quicker to begin with at least if you know you're not going to use this a lot then just basically start in your virtual machine using the python exe that's inside of this folder and that will then create a new environment with python 3.8 instead of using python 3.9 so to give you an example here let's just open up the virtual studio visual studio sorry virtual studio let's just change directory to c change directory to c sorry and then let's uh change the directory to our new python folder so python38 and inside of here if i were to do um jr you can see that i've got a file here called python wbxe so python exe right here so what i can do here is i can just use that and then there are other ways of doing this of course this in my opinion is an easy way of doing this so what i can now do is just basically make a new folder for my virtual environment so remember to make a virtual environment we can use the m switch virtual environment and then you just need to specify where you want the virtual environment to be placed so let's just go back a folder dot dot dash so at the moment we're in this python folder so i'm going to move back one folder dot dot dash into c drive and now i'm going to make a new folder called c and then i'm going to put the virtual environment there so that's going to make a new virtual environment user utilizing python 3.8 okay so once that's done i can then just change the directory again let's go back let's change directory you've got a new directory called c so let's have a look inside of there now you can see i've got my event folder um so let's change the directory into there oh there we go oh no we're gonna do that change directory let's come back out again already inside of a directory that we need to uh so what i can now do is obviously activate as per normal so go in and activate so i've activated my virtual machine now and i can just carry on as normal so pip install or let's um do a python version shall we you can see i'm using python 3.8 so let's do a pip install django once django's installed of course we use the django admin to start our project so we're just going to call this core now in this project i'm going to put everything inside of this folder just as kind of a simple example so i won't make a different application i'll put everything in core now normally obviously you'd probably want to make different applications uh for your application in general but here we're just going to use the core folder so let's go ahead and do that so don't forget the dot for the folder to appear right here so actually let's just create or open the folder that we need and so see this folder so i just selected the folder so i've still got the virtual machine working right okay so that's the folder i've just created um so now we can go ahead and build this up so let's start off by installing uh sorry pip install that's uh install tensorflow that'll take a couple of seconds so at this point if tensorflow isn't installing it's likely potentially that you're still running python 3.9 or a version that isn't compatible and it will let's remember that when you try to run these packages it will try and determine uh what version of python you have for example so it will then determine whether it can be installed or not for example so that seems okay so now tensorflow is installed um let's go into our settings and let's start bringing in some of our code so in our settings file we're going to import tensorflow into our project and then we go ahead and we're going to need a few other tools so here we're going to be using utilizing vgg16 so this is a pre-trained model um that we're going to utilize and incorporate so when the project loads up it's going to need to download that and that's a fairly big download i think it's around about 512 meg if you head over to the um curious website here you can see that there's a number of different available models we're using vg16 here 528 meg the amount of parameters and depth etcetera it has there's a few different models here that you can utilize and then bring into your project uh so by all means have a look at those if you want to kind of expand or try out some different models so here we're going to be utilizing some tools from tensorflow 1 and that's the sessions so with tensorflow 2.0 it won't be compatible with utilizing sessions and it's recommended to upgrade them now i haven't got to that point yet reading through all the documentation to upgrade the sessions in 2.0 if you are aware and you can suggest the code that's needed to do that then please do in the comments and i'll make those changes so we're going to press ahead using sessions here so we're going to need this compatibility kind of mode here so tensorflow.com.v1 as tf so we'll bring that in for kind of compatibility and those are the imports that we're going to need so if you're not familiar with sessions tensorflow i've got some great documentation of course um so have a look at session um so here for example class running tensorflow operations so you can see we've kind of we're utilizing that compatibility mode to create a session a session object encapsulates the environment in which the operation objects are executed okay so have a look at the documentation if you want to read a little bit more so if we're back with compatibility we also have the uh disable v2 behavior so we can go ahead and do that right so with these sessions we're going to need to utilize sessions like to perform the operation so we're going to need a create a variable for sessions um so let's go and do that so we create a this new variable we're going to utilize when we make the classification and then we're going to also utilize um the get default graph again documentation get default graph returns the default graph for the current thread so then we go ahead and set the global tensorflow session so let's go ahead and do that there we go so we've got this global session right there we go so that's pretty much all the code we need the last component here is we're going to need our pre-trained model so let's bring that in there we go and then finally let's go ahead and pip install kirus right so now we're probably ready to puy manage by run server so you can see that this will probably take a while well once it's all done it's ready you can see that the server is running so we're now ready to kind of hook this into our application so let's go ahead and create a new file we're going to call this uh uh yeah views dot pi so i'm going to be working here in core it might seem pretty strange if you've been utilizing django um for a little while and we've been utilizing or building applications so we're just going to work here just for manageability for no particularly no particular reason we're just going to work inside the core here we're going to need a template so let's just create our templates folder and inside of here we'll create a new file called index so that's the page that's going to show the form to allow us to upload the image and then see the results right so i'll just take you through the dependencies here so we're going to need um numpy here so manage or to convert our image into a format that's going to be then compatible to run against our model so we've got these importing these settings from django so this is settings as in the settings file so this is going to give us access to these variables excuse me the variables that we set up here so we can run our classification next up we have the default storage so i'll just take you through this jam shortly but what we're going to do is we're going to capture the image from the form and then perform some operations on it and one thing that we're going to need is the default storage and we'll set this this up shortly now if you're familiar with django you know that the default storage typically is a folder which would build right now called media on the root so not in core it needs to be on the root so the image is normally then the the folder that we store the images is normally called media and that's uh can be the default or the root so obviously we can change this in settings or set this up shortly but we nee we're going to need a folder called media to store our images so we then have render so let's remember this is a django tool that will then return a http response to the the browser the user's browser and we've got the vgg16 so again this is just about preparing the image we need this to prepare the image to be classified and then we've also got decode predictions so once we've got the predictions um we'll return that and then we decode those into what essentially will be a string that we output like you saw in the preview to the um to the browser um then these are tools here so image to array so you can see what's going to be happening here we take in our image we convert um into a format that's then going to be um compatible to run our classification and then finally we've got the set session so i guess to be more specific here about what session is doing a session allows us to execute graphs or parts of graphs okay so it's going to for example allocate resources or on our machine um so that we can hold the values um of the results and maybe any any variables so that's why why we're setting up this session and then essentially then we're going to then pass that back and uh decode the prediction so now we're going to need a function so this is going to take in the request from the browser and then perform an action so we're going to be using a form so we're posting data to this view therefore we need to just check to make sure that the request from the browser the method was a post so if it was we're then going to perform an action that action is going to be obviously we're going to do the classification um else we're just going to return the the template because remember what we have on the template what we will have on the template sorry it's just the form and then what the data will what the output prediction will be so if for example we go to the page and we haven't got there via post then it's just going to show the form if for example um we do send a post to this function then we're going to run the prediction okay so now we just need to ask ourselves we press imagine we press the button on the form to submit our image we now send it across to this view here um this function sorry we've checked to see if the method was post it was now we need to do something so what we're going to do first is take the file so we're going to get the file so from request um inside of here is all the kind of information from the the form that's been sent across we're going to go in and have a look for files and we're then going to get the the image file so that will all be lined up to the form shortly so we're going to grab the image from the form and then we're going to store it in this variable called file and then what we want to do is utilize this default storage so django provides this default storage and there's a few different options here we can utilize from this uh here we're utilizing save so what we're going to do here is save the image to the default storage which is going to be this folder called media which we need to set up and then we just define two things here for example the name and the actual file we want to store so there's two parameters so notice we get the name from the file so file.name so we've grabbed the file here so the parameter from there is the name and then we saved that into this new variable called file name so at this point the image has been saved to our folder or would have been saved so what we're going to need to do now for example is get the url so that we can pass that over so it can then be classified so here we've created this new variable called file url and we're going to use the default storage again in the path to get the um the file so here we get the default storage.path that's going to produce whatever the default storage is of django that we've set up so that typically will be the media folder which we'll define in a second so we get that parameter and then we get the file remember the file name is already saved here in the previous um in the previous variable here so we get that and then we make a match so we get the file url uh including the file name and then sorry it doesn't make match apologies uh so file name just gets extended onto the path and then we can then return that back as a full path to that image so let's go ahead and just set up this media here so let's go into our settings now typically at the bottom of the settings here we would define a few things so you can see we've got this static url if you know what that is if not it doesn't matter at this point and then what we're going to do is set up two variables we can do this two ways i'm going to do this the uh the pre django 3.1 way uh utilizing the os path join so it's just a safer way of working at the moment because i realize that some people are still getting errors um if they utilize the kind of a new method of just using the base directory um variable so because we're using os os is a built-in python library so we're going to need to bring that in um just import os that allows python to kind of manipulate or read the the operating system's path in this case what we're doing is we're getting the base directory of our project here connected it to the media folder and essentially then it's directing django to this folder right here we also use the media url to define for example in our browser where the the images are set so we set essentially a url to our image folder right so there's two things here the media route and the media url okay so in addition to that because we're working in a development environment we also have to kind of set up a url for this so head over to the urls there's two settings that we're going to need here one is the import settings and the other is the url static import static and that's basically just going to allow us then to set our url if we need it to our to our media url excuse me there we go so that's just going to add a new url that's going to basically allow access to our media url while we're in development mode and you can see here document root equals settings.media root okay so that sets up allows an access to that folder so at this point what we can do is we can just test this out because um if this doesn't work then there's no point continuing at this point so let's go ahead and go into our index page and we're going to build a a very simple form that's going to allow us to submit an image so go ahead and create a new form here we've got the encryption type multi-part form data so there's going to be different types of data inside of this form potentially and then we've got the predictions so basically we're gonna show the form and predictions or we're going to just show the form so if there's no predictions that won't get shown so this is a variable that we're going to pass across to our index page which is going to have all the predictions so we're going to send this form using the post method so we define that too and then we go ahead and we're going to need a csrf token to send that across so just a little bit of security there and then we've got two inputs or one input sorry which is going to be the file so input type file name is the image file so if remember here in line 15 at the moment the file we extract that image given the name that's in the input there so image file needs to match up here with the name here image file and then we've also got a new input which is the submit and that's going to have a value of upload so that's just going to submit where we're going to submit well in this case because we haven't defined where we want to post this it's just going to kind of essentially refresh the page and then reload this view and then capture the post request or the yeah the post request okay so let's go ahead now and just make sure the server started okay let's run the server okay so it's started okay it takes a few seconds now let's go back page not found okay so one thing that we've forgotten to do is to set up the url for this so at the moment django doesn't know that url um so in the urls here you can see there's only one set so when the request gets sent to django the request gets read what page do you actually want at the moment there's no path for it so let's go ahead and just add a new path now we created a a new menu quickly so we want to use the home page so there's no parameters there so just blank so that's going to be the home page and then we want to bring in our views we need to set that in a minute and it's the view is called index and then we give this a name equals home page or um image classification or just home okay just home sorry uh so let's bring that in so from dot um import views so let's bring our views in so we're just kind of uh connecting up our um our views so we have access to our views our index view so let's just double check our views called index yep okay so that hooks up to our view we're gonna need a comma here don't forget after each line um there we go so now when we go back and refresh we should see this a template does not exist okay so let's have a look at why that is so if you are having problems like this what you can do is go into the settings and have a look at line 61 here directory so here we can actually specify the template directory so we can do that by just maybe let's just bring out the template folder i'm going to move the template folder out of our project so this is what it looks like and then we're just going to define this folder and where this template is and django that will then look for this folder and then the file inside of it and make the match so if it matches um our index here it will show the the file okay so what we can do here is just add in os path join we've got the base directory variables it's set at the top of this page settings page and the folder called templates and our templates are inside of there so we don't need that comma so there we go so that's now set now there's a few ways of doing that of course i'm just showing you pretty much the pre django's 3.1 way um you may have this problem still and i have a few students who you know using the same machines doing exactly the same things sometimes it it doesn't work for some reason sometimes it does so it should pick up templates from our folder here um in a templates folder typically in within an application but um this is it provides a great opportunity to set that so let's go back now start the server and then refresh and now we can choose a file so let's go ahead and choose a file so i've chosen a file here it's called pic.jpg it's an image of a cat so i'm going to upload that and here we get response so returned http object hit return none instead the view okay didn't return a http object okay so let's go back into our code so we didn't return an object so if post else so what's happening here you can see that this else here is connected to this return now for example if i don't make a post so if i do make a post you can see it's going to run this code and then it's just going to fall off there's nothing else here if i run an else it will return the page that's why the page did load originally so really what i need to do here is uh take this out and return regardless so let's just give that a go and try that again and there we go so it's uploaded it's refreshed and shown the page again so now let's go into our media folder you can now see i've got two images inside of it so it was it did upload the first one in actual fact it um it was just narrow with the template returning that template so you can see that the images are now being uploaded to this folder here so let's go to the next step now so we now know the image is being uploaded so now we can go ahead and compare the image ready for it to be classified let me just see if i can move this across a bit okay okay so we get the image so we use the load image so here we're just preparing the image in preparation for it to be classified so we use the image to array and then we go ahead and further customize that array in preparation for it to be classified using the expand dimms once that's done we can then further prepare our image and then get it ready again to be processed i think uh here we've created the an array from the image we then further customized that array in preparation to be [Music] classified and here what we're doing is encoding that data again preparing it to be classified so now we can go ahead to the next step which is obviously running the classification and then finally returning so let's now go ahead and create our predictions so with settings.graph now remember graph comes from our settings here okay let's go back and then we're going to create our session and then run the predictions here so the image model um that's our pre-created model and we're going to run against our image against so that's what we brought in earlier and then this is the processed image so we prepared the image and finally got to this point and now we can run the prediction so that leaves us with the final step of outputting the data so we decode the predictions now we can choose how many predictions here we want to return i think five is default if you don't have this parameter here so i've just selected 10. now we can then return the render request is the index page and then of course projection that's what we sent the data across as in the image so predictions here so we put all the data that's returned into label and we put that into this context here which that's then passed across and can be then utilized to to render on the page so with all that in place let's go ahead and have a look let's just make sure the server's on let's choose a new file once you've chosen the file upload and we've got a problem so the use of load image requires peel so the most likely problem here is that pillow's not installed so let's go ahead and pip install pillow just in case there we go so let's just try this again the weight okay so let's just go back try again and there we go so if you didn't know what pillow was it's a python image library and it's a very general and common tool that's utilized when we're dealing with or working with images in django so of course now you have the data you can go ahead and potentially convert this into a nice array and loop out just the individual components that you want to display on the page and so on so there we go that's a towards django tensorflow image classification like i said if you do know how to get rid of those sessions uh so that we can fully upgrade that to 2.0 that would be really useful um here was a simple example of utilizing different python versions in windows we then created the virtual environment in 3.8 and then we installed those dependencies and there wasn't too much to do really that model that pre-created model was and is a great way of working quickly to integrate machine learning into your application and you can see that we've got a useful image classification tool that you might want to integrate within your software and then we looked at very briefly be it django managing files from a form thank you i hope there was some value there and hopefully i'll see you in the next tutorial

Channel: Very Academy

Views: 5,269

Keywords: tensorflow, django, django image classification, django classification, python, django tutorial, djangotutorial, django tut, django 3, django examples, learn django, django beginners, beginners django, django framework, django example, django 2021, python django

Id: RvnpVJApBz8

Length: 32min 17sec (1937 seconds)

Published: Fri Mar 26 2021