Lesson 2: Practical Deep Learning for Coders 2022
[Jeremy Howard]
Welcome and Introduction
Hi everybody, welcome to Lesson 2. Thanks for coming back. Slight change of environment here, we had a bit of an administrative issue at our university. Somebody booked our room, so I’m doing this from the study at home. So sorry about the lack of decorations behind me. I’m actually really, really pumped about this lesson. It feels like going back to what things were like in the very early days, because we’re doing like some really new, really cool stuff, which, you know, stuff that hasn’t really been in courses like this before. So I’m super, super excited. So thanks a lot for coming back after Lesson 1, and I hope it’s worth you coming back.
Course Materials and Resources
I think, I think you’re going to love it. I am, yeah, I’m really excited about this. Now, remember that, you know, the course goes with the book, so be sure that you’re following, I mean not following along in the book, because we’re covering similar things in different directions, but like read the book as well.
[00:01:10]
And remember the book is entirely available for free as well. You can go to the fast.ai fastbook repo to see the notebooks, or through course.fast.ai, you can read it there, for example, through Colab. And also remember that the book, I mean, the book’s got a lot of stuff that we didn’t cover in the course, like, you know, stuff I find pretty interesting about the history of neural networks, some of which has some really interesting personal stories actually, as you’ll read here.
Chapter Quizzes and AIquizzes.com
And at the end of each chapter, there is a quiz. And remember, it’s not a bad idea before you watch the video to read the quiz. So if you want to read the chapter 2 quiz, you know, and then come back, that’s not a bad idea.
[00:02:00]
And then make sure that you can do the quiz after you’ve watched the video and you’ve read chapter 2 of the book. Something I didn’t mention last week is there’s also a very cool thing that Radek, who I mentioned last week, has written called AIquizzes.com, which is a site specifically for quizzes about the book. And it actually uses repetitive space learning techniques to make sure that you never forget. So do check out AIquizzes.com. It’s all brand new questions, they’re different to the ones in the book. And they’re really nicely curated and put together. So check out AIquizzes.com as well.
Course Forums and Summarizing Topics
Remember as well as course.fast.ai, there’s also forums.fast.ai. So course.fast.ai is where you want to go to get, you know, links to all the notebooks and Kaggle stuff and all that stuff. You’ll also find on forums.fast.ai, every lesson has an official topic, you know, with all the information you’ll need.
[00:03:04]
Generally there’ll be a bit more info on the forums. We try to keep the course lean and mean. And the forums are a bit more detailed. So if you find, well in this case, you’d want to look at the lesson 2 official topic, but here’s the lesson 1 official topic so far. So from the lesson 1 official topic, already after just a few days since I recorded it, we haven’t even launched the course, so it’s just the people doing it live, there’s already a lot of replies. And that can get pretty overwhelming. So be aware that there’s a button at the bottom of my post that says summarize this topic. And if you hit that, then you’ll just see the most upvoted replies, and that’s a really good way to just make sure that you hit on the main stuff. So there’s the button, and here’s what it looks like after you hit it, you’ll just get the upvoted stuff from fast AI legends like SamYam and Tanishq.
[00:04:09]
So hopefully you’ll find that a useful way to use the forum.
Show Us What You’ve Made Post
So one of the cool things about this week is I, as promised, put up the show us what you’ve made post. And already a lot of people have posted, I took the screenshot a few days ago, it’s way above 39 replies already, if I remember correctly. I had a lot of trouble deciding which ones to share because they’re all so good. So I’ve actually decided to kind of, you know, went the easy route and I just picked the first. So I’m just going to show you the first ones that were posted because they’re also good. So the first, the very very first one to be posted is a damaged car classifier. So that worked out pretty well, it looks like.
[00:05:00]
And I really liked what Matt the creator said about this is that, you know, wow, it’s a bit uncomfortable to run this code, I don’t really understand yet, but I’m just doing it. And so I’m like, yeah, good on you, Matt, for just for just doing it. That’s the way to get started. It’s all going to make sense, don’t worry. Very nice to see that the next one posted was actually a blog post in fast pages, very nice to see. So just describing some stuff, some experiments that they ran over the week, and what did they find. Next one was the amazing beard detector, which if I understand correctly was mainly because it’s very easy to get from bird to beard by just changing one letter to two. And this is doing a very good job of finding gentlemen with beards. So very nice. And then this one is another level again. It’s a whole in-production web app to classify food, which is kind of like extra credit. Apparently we’re up to 80 replies now in that thread, thank you, Sanyam, very cool.
[00:06:11]
So you know, obviously, so this was actually created by Suvash, who’s been doing the courses for a few years now, I believe. And so, you know, one day you too might be able to create your very own web app and put it in production. And when I say one day, more specifically today, I’m actually going to show you how to do this right now.
Putting a Model in Production
So it’s actually quite lucky coincidence that Suvash put this up there, because it’s exactly the topic that we’re going to pick today. So how do we go about putting a model in production? Step one is, well, you’ve kind of done step one, right? Step one is step one, two, three, four, it’s figure out what problem you want to solve, figure out how to find the data for it, gather some data, and so forth.
[00:07:08]
So what’s the kind of first step after you’ve got your data? The next step is data cleaning.
Data Cleaning and Chapter 2 of the Book
And if you go to chapter two of the book, which I’m going to go ahead and open up now. So here is the book, so you can open it in Colab directly from the course, or if you’ve cloned it to your computer or whatever, you can you can do it there. So remember course.fast.ai will run you through exactly how to run these notebooks. And so you can see chapter two is all about putting stuff in production, and so here is chapter two. All right, and so remember we hit shift enter to run cells, okay, to execute them. And so we’re going to go to the part of the book where we start cleaning the data. So I’ll click on navigate, and we’ll go down here, gathering data, there we are.
[00:08:08]
Jupyter Notebook Extensions and Navigation
So we could do a quick bit of revision first. Now by the way, I will mention a lot of people ask me what are the little tricks I use for getting around Jupyter notebook so quickly and easily. One of the really nice ones, as you’ll see, is this navigate menu, which actually doesn’t appear by default. So if you install something called Jupyter notebook extensions, Jupyter notebook extensions, and so you just you just pip install them, follow the instructions, and then restart Jupyter. Obviously this Colab already has a table of contents, by the way, so this is just if you’re using something local, for example, then you’ll see here that this nb extensions thing will appear. And if you click on table of contents 2, that gives you this handy navigation bar.
[00:09:05]
The other thing I really like is this one here called collapsible headings. And that’s the one which gives me these nice little things here to close and open up. And actually that’s not even the best part. The best part for me is if I hit right arrow, it goes to the end of a section, and if I hit left arrow, it goes to the start of a section. So it’s like if I want to move around sections, I just press up left, down right, down right. Very handy. And if you hit left again when you’re here, it’ll close it up. Hit right again here, open it up. So that’s collapsible headings. Anyway, a couple of really handy things, and we’ll be talking a lot more about getting your notebook set up today in a moment.
Replacing Bing with DDG for Image Search
Okay, so one thing you’ll notice is in the book we use the Bing API for searching images. I’ve just gone ahead and replaced Bing with DDG because the Bing API requires getting an SDK key, which honestly it’s like the hardest thing in deep learning is figuring out the Bing Azure website and getting that sorted out.
[00:10:13]
DDG doesn’t. So it’s basically exactly the same, and you can, I’ll share this notebook as well on the course website in the forum. But all I’ve basically done is I’ve replaced Bing with DDG and got rid of the key. So then just like we did last week, we can search for things. And so in the book we did a bear detector, because at the time I wrote it, my then toddler was very interested in me helping identify teddy bears, and I certainly didn’t want her accidentally cuddling a grizzly bear. So we show here how we can search for grizzly bears, just like last week.
Grizzly Bear Detector and Python/Fast.ai Help
Something that loops through grizzly bears, black bears, and teddy bears, just like last week.
[00:11:02]
Get rid of the ones that failed, just like last week. And one thing a few people have asked on the forum is how do I find out more information about basically any Python or fast.ai or PyTorch thing. There’s a few tips here in the book. One is that if you put a double question mark next to any function name, you’ll actually get the whole source code for it. And by the same token, if you put a single question mark, you’ll get a brief, you know, little bit of information. If you’ve got nbdev installed, I think it’s nbdev you need, then you can type doc and that will give you, perhaps most importantly, a link straight to the documentation, where you can find out more information.
[00:12:06]
And generally there will be examples as well. And also a link here to the source code, if you want to, let’s do that with a control. Okay, a link to the source code, and that way you can jump around. Notice that in GitHub in the source code, you can click on things and jump to their definition. So it’s kind of a nice way of skipping around to understand exactly what’s going on. Okay, so lots of great ways of getting help. But what I promised you is that we’re going to now clean the data.
Training a Model Before Cleaning Data
So I’m going to tell you something that you might find really surprising. Before you clean the data, you train a model. Now I know that’s going to sound really backwards to what you’ve probably heard a thousand times, which is that first you clean your data, and then you train your model.
[00:13:06]
But I’m going to show you something really amazing. First, we’re going to train a model, and you’ll see why in a moment.
Data Block, ShowBatch, and Resizing Images
So to train a model, just like before, we use a data block to grab our data loaders. There’s lots of information here in the book about what’s going on here. There we go. And so then we can call showBatch to see them as per usual. There’s a little sidebar here in the book I’ll quickly mention, which is about the different ways we can resize. I think we briefly mentioned it last week. We can squish. Last week I used a string. You can use a string or this kind of enum-like thing that we have. You can see with a squish, you can end up with some very thin bears. Right? So this is the real site that’s shaped as a bear. Here it’s become thin. But you can see now we’ve got all of its cubs.
[00:14:00]
Are they called cubs? Yeah, bear cubs. So it’s squished it to make sure we can see the whole picture. Same one here. This one was out of the picture. We squished it. This guy now looks weirdly thin, but we can see the whole thing. So that’s squishing. Whereas this one here is cropping. It’s cropped out just the center of the image. So we get a better aspect ratio, but we lose some stuff. This is so we can get square images. And the other approach is we can use pad. And so you can pad with various different things. If you pad with zeros, which is black, you can see here now we’ve got the whole image and the correct aspect ratio. So that’s another way we can do it. And, you know, different situations, you know, result in different quality models. You can try them all. It doesn’t normally make too big a difference. So I wouldn’t worry about it too much. I tell you one though that is very interesting is random resized crop.
Random Resized Crop and Data Augmentation
So instead of saying resize, we can say random resized crop. And if we do that, you’ll see we get a different bit of an image every time.
[00:15:04]
So during the week this week, somebody asked on the forum, I’m trying to, this is a really interesting idea, which it turned out worked slightly, was they wanted to recognize pictures of French and German texts. So obviously this is not the normal way you would do that. But just for a bit of experiment, and I love experiments. So they had very big scans of documents and they wanted to figure out whether it was French or German just by looking at images. And they said the pictures were too big. What should I do? I said use random resized crop and that way you would grab different bits of the image. And this is very nice because you could run lots and lots of epochs and get slightly different pictures each time. So this is a very good technique. And this idea of getting different pictures each time from the same image is called data augmentation. And again, I’m not going to go into too much detail about data augmentation because it’s in the book.
[00:16:06]
But I’ll just quickly, you know, point out here that if you use this thing called aug transforms, so augmentation transforms, and here I have multiplied them by two. So I’ve made them super big so you can see them more easily. You can see that these teddies are getting turned and squished and warped and recolored and saturated. All this stuff to make every picture different. And generally speaking, if you’re training for more than about five or ten epochs, which you’ll probably want to do most of the time unless you’ve got a super easy problem to solve. You’ll probably want to use random resized crop and these aug transforms. Don’t put the multiples too, just leave that empty. I’m just putting it there so you can see them more clearly.
Data Augmentation and Image Copying
So I’ve got an interesting question here from Alex in our audience, which is, is this copying the image multiple times doing something like this or something like this?
[00:17:10]
And the answer is no, we’re not copying the image. What happens is that image, so each epoch, every image gets read. And what happens here is though, is kind of in memory, in RAM, this the image is being warped, right? It’s being recropping it and recoloring it and so forth. So it’s a real-time process that’s happening during model training. So there’s no copies being stored on your computer, but effectively it’s almost like there’s infinitely slightly different copies because that’s what the model ends up seeing. So I hope that makes sense, Alex and everybody else. That’s a great question. Okay, so we’ve got, we’re going to use random resized crop. We’re going to use augmentation transforms so that we can get a data loaders from that and then we can go ahead and train our model.
[00:18:06]
Training the Model and Confusion Matrix
It takes about a minute. In this case, we only did four epochs of fine-tuning and we’ll talk about why there’s five here later in the course, but four main epochs of fine-tuning. So we probably didn’t really need random resized crop and aug transforms because there’s so few epochs. But you know, if you want to run more epochs, this is a good, good approach. Under 3% error, that’s good. Okay, so remember I said we’re going to train a model before we clean. Okay, so let’s go ahead and train it. So while that’s training, so it’s running on my laptop, which only has a four gigabyte GPU. It’s pretty basic, but it’s enough to get started. While that’s training, we’ll take a look at the next one. So the first thing we’re going to look at is the confusion matrix, and the confusion matrix is something that it only is meaningful for when your labels are categories, right?
[00:19:09]
Confusion Matrix and Classification Interpretation
And what it says is how, what category errors are you making? And so this is showing that the model that we’ve got at this point, there was two times when there was actually a grizzly bear, and it thought it was a black bear. And there was two times when there was actually a black bear, and it thought it was a grizzly bear. And there was no times that it got teddies wrong, which makes sense, right? Because teddies do look quite different to both. In a lot of situations, when you look at this, it’ll kind of give you a real sense of like, okay, well, what are the hard ones, right? So for example, if you use the pets dataset that we quite often play with in the book and the course, this classification metric, matrix for different breeds of pet, you know, really shows you which ones are difficult to identify. And I’ve actually gone in and like read Wikipedia pages and, and, and pet breeding reports about how to identify these particular types because they’re so difficult, and even experts find it difficult.
[00:20:11]
And one of the things I’ve learned from doing the course actually is black bears and grizzly bears are much harder to pick apart than I had realized. So I’m not even going to try. But I’ll show you the really interesting thing we can do with this model is that now we’ve created this classification interpretation object, which we use for confusion metrics.
Plot Top Losses and Loss Measurement
We can say plot top losses. We can say plot top losses. And this is very interesting. What it does is it tells us the places where the loss is the highest. Now, if you remember from the last lesson, the loss is that measurement of how good our model is that we take after each time we run through an item of data.
[00:21:05]
A loss will be bad if we predict wrongly, and we’re very confident about that prediction. So here’s an example where we predicted, here’s the order here, prediction actual loss probability, where we predicted grizzly, and it was actually a black. And we were 96% sure, our model was, that it’s a grizzly. Now, I don’t know enough about bears to know whether the model made a mistake, or whether this actually is a picture of a grizzly bear. But so an expert would obviously go back and, and check those out. Right. Now, you’ll notice a couple here. It’s got grizzly, grizzly, teddy, teddy. They’re actually correct. Right. So why is this loss bad when it was correct? And the reason is because it wasn’t very confident. It was only 66% confident. Right. So here’s a teddy. It’s only 72% confident.
[00:22:01]
Right. So you can have a bad loss either by being wrong and confident, or being right and unconfident.
FastAI Image Classifier Cleaner
Now, the reason that’s really helpful is that now we can use something called the FastAI image classifier cleaner to clean up the ones that are wrongly labeled in our data set. So when we use the image classifier cleaner, it actually runs our models. That’s why we pass it learn. Right. And I mentioned that I don’t know much about black bears and grizzly bears. But I do know a lot about teddy bears. I’ll pick teddy bears. And if I click teddy bears, it’s now showing me all the things in the training set. You can pick training or valid that were marked as teddy bears. And here’s what’s really important. They’re ordered by loss. So they’re ordered by confidence. Right. So I can scroll through just the first few and check they’re correct. Right. And oh, here’s a mistake.
[00:23:01]
Right. So when I find one that was wrongly gathered, I can either put it, if it’s in the wrong category, I can choose the correct category. Or if it shouldn’t be there at all, I click delete. So here I’ll go ahead and click delete. Right. So I can see some reasons that some of these are hard. Like, for example, here’s two teddies, which is just, I guess, confusing. So it doesn’t see that often. This one here is a bit weird looking. It looks almost like a wombat. This is an awful lot of teddies. This one maybe is just a bit hard to see from the background. But these otherwise, they look fine. Fine. So we just walked through the first few.
Cleaning Training and Validation Sets
And if you don’t see any problem or problems in the first few, you’re properly fine. So that’s cleaned up our training set. Let’s clean up our validation set as well. So here’s that one it had trouble with. I don’t know why it had trouble with that one. But so be it. And we’ll have a quick scroll through. Okay.
[00:24:00]
I’m not really sure that’s a bear. So I’m just going to go ahead and delete it. It’s a teddy something. But, you know, it’s a problem. Okay. That’s not a teddy either. So you see the idea, right? So after we’ve done that, what that does is the cleaner has now stored a list of the ones that we changed and the list of the ones we deleted. So we can now go ahead and run this cell. And so that’s going to go through a list of all of the indexes that we said to delete. And it will delete those files. And it’ll go through all the ones we said to change. And it will move them to the new folder. There we go. Done. So this is like not just something for image models. It’s just, it’s actually a really powerful technique that almost nobody knows about and uses. Which is before you start data cleaning, always build a model to find out what things are difficult to recognize in your data.
[00:25:03]
And to find the things that the model can help you find data problems. And then as you see them, you’ll kind of say, okay, I see the kinds of problems we’re having. And you might find better ways to gather the next data set. Or you might find ways to kind of automate some of the cleaning and so forth.
Data Cleaning and GPU Memory Management
Okay, so that is data cleaning. And since I only have a four gigabyte GPU, it’s very important for me to close and halt. Because that will free up the memory. So it’s important to know on your computer, your normal RAM doesn’t really get filled up. Because if you use up too much RAM, what will happen is that instead your computer will start, it’s called swapping. Which is basically to save that RAM onto the hard disk to use it later. GPUs can’t swap.
[00:26:00]
GPUs, when they run out of RAM, that’s it, you’re done. So you need to make sure that you close any notebooks that are using the GPU that you’re not using. And really only use one thing at a time on the GPU. Otherwise you’ll almost certainly run out of memory. So we’ve got the first few reds starting to appear.
Asking Questions and Watching the Video
So remember to ask. And in terms of the yellows, it’s important to know as you watch the video, I’m not asking you to run all this code. Okay, the idea is to kind of watch it and then go back and pause, you know, as you go along. Or you can just stop, try, stop, try. The approach I really like and a lot of students really like for watching these videos is to actually watch the entire thing without touching the keyboard to get a sense of what the video is about. And then go back to the start and watch it again and follow along. That way at every point you know what it is you’re doing, you know what’s going to happen next.
[00:27:02]
That can actually save you some time. It’s a bit of an unusual way because obviously like real-life lectures, you can’t do that. You can’t rewind the professor and get them to say it again, but it’s a good way to do it here.
Putting the Model in Production with Hugging Face Spaces
So now that we’ve cleaned our data, how are we going to put it into production? Well in the book we use something called Voila and it’s pretty good. But there’s actually something that I think most of you are probably going to find a lot more useful nowadays, which is something called Hugging Face Spaces.
Gradio and Tanishq Abraham’s Blog Post
And there’s a couple of things you can use with that. We’re going to look at something called Gradio today. And there isn’t a chapter about this in the book, but that doesn’t matter because Tanishq Abraham, who’s actually one of the TAs in the course, has written a fantastic blog post about really everything we’re going to cover today. So there’s a link to that from the forum and from the course page.
[00:28:03]
So this is like the equivalent of the chapter of the book, if you like.
Tanishq Abraham and the Fast.ai Community
And I would be remiss if I didn’t stop for a moment and call out Tanishq in a big way for two reasons. The first is he is one of the most helpful people in the fast.ai community. He’s been around quite a few years. Incredibly tenacious, thoughtful, and patient. And also because I have this fantastic picture of him a few years ago with Conan when he was a famous child prodigy. So now you know what happens to famous child prodigies when they grow up. They became even more famous fast.ai community members and deep learning experts. So you should definitely check out this video of him telling jokes to Conan. I think he’s still only 18, actually. This is probably not that many years ago. So thank you very much Tanishq for all your help in the community. And sorry for embarrassing you with that picture of you as a nine-year-old. I’m not really.
[00:29:00]
Creating a New Hugging Face Space
Okay, now the thing is for doing Gradio and Hugging Face Spaces, well, it’s easy enough to start. Okay, we start over here on the Hugging Face Spaces page, which we’ve linked to from the forum and the course. And we’re going to put a model in production where we’re going to take the model we trained. And we are going to basically copy it to this Hugging Face Spaces server and write a user interface for it. So let’s go. Create new space. Okay, so you can just go ahead and say, all right, so obviously you sign up. The whole thing’s free. Basically everything I’m showing you in this entire course, you can do for free. That’s the good news. Okay, so give it a name. Just create something minimal. I always use the Apache license because it means other people can use your work really easily, but you don’t have to worry too much about patents. As I say, there’s a few different products you can use with it.
[00:30:00]
We’re going to use Gradio, also free. If you make it public, then you can share it, which is always a good idea when you’re a student, particularly to really be building up that portfolio. Okay, so we’re done. We’ve created a space.
Git and GitHub Desktop
Now, what do we do next? Well, Spaces works through Git. Now, most software developers will be very familiar with Git. Some data scientists might not be, and so Git’s a very, very useful tool. I’m not going to talk about it in detail, but let’s kind of quickly learn about how to use it, right? Now, Git, you can use it through something called GitHub Desktop, which is actually pretty great, and even people who use Git through the console should probably be considering using GitHub Desktop as well, because something’s just much faster and easier in it. In fact, I was talking to my friend Hamill today, and I was like, oh help, I’ve accidentally committed this two things by mistake.
[00:31:05]
What’s the easiest way to revert it? And he used to work at GitHub, and I thought he was going to have some fancy console command, and he was like, oh, you should use GitHub Desktop, and you can just click on it. Oh, that’s a great idea. So that’s useful.
Using Git from the Terminal
But most of the time, we do use Git from the console, from the terminal. If you’re a Linux user or a Mac user, you’ve already got a terminal. Very straightforward, no worries. If you’re a Windows user, I’ve got good news. Nowadays, Windows has a terrific terminal. It’s called Windows Terminal. You get it from the Microsoft Store. So in fact, every time you see me using a terminal, I’m actually using that Windows Terminal. Works very well. God knows why I’d want it to have all these ridiculous colors, but there you go. Now, what do you want to be running inside your terminal? Obviously, if you’re in Linux or Mac, you’ve already got a shell set up.
[00:32:01]
Windows Terminal and Ubuntu
In Windows, you almost certainly want to use Ubuntu. So Windows, believe it or not, can actually run a full Linux environment, and to do it is typing a single line, which is this. So if you go to just Google for WSL install, run PowerShell as administrator, paste that command, wait about five minutes, reboot, you’re done. You now have a complete Linux environment. Now, one of the reasons I’m mentioning this is I’m going to show you how to do stuff on your own machine now.
Working on Your Own Machine
And so this is like going to a bit of an extra level of geekery, which some data scientists may be less familiar with. So, you know, don’t be worried about the terminal. I think you’re going to find it really helpful, and much less scary than you expect.
[00:33:00]
And I particularly say, like for me, I choose to use Windows, and that’s because I get, you know, all the nice Windows GUI apps, and I can draw on my screen and do presentations, and I have a complete Linux environment as well. And that Linux environment uses my GPU and everything. So for me, you know, my first choice is to use Windows. My second choice, by not very much really like it, would be to use Linux. Mac is a little bit harder, but it’s still usable. So some things are a little bit trickier on Mac, but you should be fine. Okay, so whatever you’ve got at this point, you’ve now got a terminal available.
Using the Terminal for Copy and Paste
And so in your terminal, one of the really nice things about using a terminal is you don’t have to follow lots of instructions about click here, click here, click here. You just copy and paste things. So I’m just going to, you just copy this, and you go over to your terminal, and you paste it in, and you run it.
[00:34:00]
Creating a Directory and File
And after you do that, you’ll find that you’ve now got a directory. And so that new directory initially is empty, and they tell you, okay, go ahead and create a file with this in it. Okay, so how do you create a file with that in it when we’re in here in our Linux environment on Windows or in the terminal on Mac or whatever?
Opening the Directory in VS Code
Well, all you do in Windows, if you just type explorer.exe. It’ll open up Explorer here. Or better still, on either Mac or Linux or Windows. So yeah, so regardless of what computer, type of computer on, you can just type code. And it will pop up official studio code and open up your folder. And so then you can just go ahead, and if you haven’t used VS Code before, it’s really well worth taking a few minutes to read the some tutorials.
[00:35:05]
VS Code and Creating an app.py File
It’s a really great IDE. And so you can go ahead and create an app.py file, like they tell you to, app.py file, containing what they told you to put in it. Here it is here. All right, we’re nearly there. So you can now go ahead and save that.
Committing to Hugging Face Spaces
And then you need to commit it to Gradio. That’s a great idea, to HuggingFaceSpaces. So one really easy way is just in Visual Studio itself. You can just click here. And that’ll give you a place where you type a message, and you hit tick, and it’ll send it off to HuggingFaceSpaces for you. So once you’ve done that, you can then go to, back to the exact same website you’re on before, HuggingFaceSpaces, jpho, minimal.
[00:36:02]
Building the Website and Gradio Interface
And what you’ll find now is that it’ll take about a minute to build your website. And it’s, the website it’s building is going to have a Gradio interface with a text input, a text output, and it’s going to run a function called greet on the input. And my function called greet will return hello name. So that’s what it’s going to do.
Testing the Interface and Running an App
Now, there it goes. Let’s try it. We’ll say hello to Tanishq. I’m not always very good at remembering how to spell his name. I think it’s like that. And there you go. So you can see it’s put the output for our input. So not a very exciting app, but we now have, to be fair, an app running in production, right?
[00:37:00]
Now, I told you we’d have a deep learning model running in production.
Deep Learning Model in Production
So now we have to take the next step, which is to turn this into a deep learning model. All right, so first we’re going to need a deep learning model.
Training a Dog or Cat Classifier
And there’s a few different ways we can get ourselves a deep learning model. But basically we’re going to have to train one. So I’ve got a couple of examples. I’ve got a Kaggle example and a Colab example. Maybe I’ll quickly show you both. They’re going to do the same thing. And I’m just going to create a dog or a cat classifier. Okay, so here’s our Kaggle model.
Kaggle Model and Edit/Reader Views
I’ll click on edit so you can actually see what it looks like in edit view. Now, Kaggle already has Fast.ai installed, but I always put this first, just to make sure we’ve got the latest version. And obviously import stuff.
[00:38:00]
So we’re going to grab the pets dataset, a function to check whether it’s a cat. That’s our labeling function for our image data loaders. Remember, this is just another way of doing data blocks. It’s like a little shorthand. And we create our learner and we fine-tune it. Okay, so that’s all stuff we’ve seen before. So in Kaggle, every notebook has an edit view, which is what you just saw, and a reader view. And so you can share your notebook if you want to. And then anybody can read the reader view, as you see. And so you can see it shows you what happened when I ran it. And so I trained it. It took, you know, so that the GPUs on Kaggle are a bit slower than most modern GPUs, but they’re still fast enough.
Exporting the Trained Model
I mean, it takes five minutes. And there’s one bit at the end here, which you haven’t seen before, which is I go learn.export and I give it a name.
[00:39:02]
Now that’s going to create a file containing our trained model. And that’s the only thing, creating this file is the only thing you need a GPU for, right? So you do that on Kaggle or on Colab. So here’s exactly the same thing on Colab.
Colab Model and Downloading the Model
You can see pip install, iscat, untar data, image data loaders. So I’ve got a show batch here as well, just for fun. Create my learner and then export. So while we wait, I might go ahead and just run that. One nice thing about Kaggle is once you’ve run it and saved it, you can then go to the data tab. And here is basically anything you’ve saved, it’s going to appear here. And here it is, model.pickle. Right, so now I can go ahead and download that. And that will then be downloaded to my downloads folder.
[00:40:01]
And then I need to copy it into the same directory that my HuggingFaceSpaces app’s in.
Copying the Model to the Hugging Face Spaces Directory
Now my HuggingFaceSpaces app is currently open in my terminal. In on Mac, you can type open. Or in Windows, you can type explorer.exe. And that’ll bring up your finder or explorer in that directory. And so then you can just paste that thing you downloaded into this directory. Something, by the way, in Windows I do, which I find really helpful, is I actually grab my, my home directory in Linux, and I pin it to my quick access. And that way I can always jump in Windows straight to my Linux files. Not really something you have to worry about on Mac, because it’s all kind of integrated. But on Windows they’re like, kind of like two separate machines.
[00:41:00]
Okay, so let’s do, so I created a space called testing.
Creating a Space and Downloading the Model
And I downloaded my model.pickle, and I pasted it into testing. So now we need to know how do we do predictions on a saved model.
Making Predictions on a Saved Model
So we’ve got a notebook for that. Okay, so we’ve got a notebook for that. And so I’m going to take you through how we use a, a model that we’ve trained to make predictions.
Using a Trained Model for Predictions
There’s a few funny things with hash pipe, which I’ll explain in a moment. Just ignore those for now. So we import Fast.ai as usual. We import Gradio, as we did before. And we copy in the exact same iscat definition we had before. That’s important. Any external functions that you used in your labeling need to be included here as well, because that learner refers to those functions.
[00:42:03]
Okay, it saves, that learner’s saved everything about your model. But it doesn’t have the source code to the function. So you need to keep those with you.
Loading the Learner and Making Predictions
So let’s try running this. So for example, I just grabbed, as you might have seen in my Explorer, I just popped a dog picture there. And so we can create a Python image library image from that dog. Turn it into a slightly smaller one, so it doesn’t overwhelm our whole screen. And there is a picture of a dog. So how do we make predictions of whether that’s a dog or a cat? Well, it’s very simple. All we do is instead of training a learner, we use load learner. We pass in the file name that we saved, and that returns a learner. This learner is exactly the same as the learner you get when you finish training. So here we are, here’s Colab, right? We’ve just been training a learner.
[00:43:01]
So at the end of that, there’s a learner that’s been trained. And so we kind of froze it in time. Something called a pickle file, which is a Python concept. It’s like a frozen object. We saved it to disk. We transferred it to our computer, and we’ve now loaded it, and we’ve now un-pickled it.
Unpickling the Learner and the Predict Method
Here’s our unpickled learner. And we can now do whatever we like with that. One of the methods that a learner has is a dot predict method. So if I run it, you can see even on my laptop, it’s basically instant. In fact, we can see how long it took. In Jupyter, things that start with percent are called magics. They’re special Jupyter things. So for example, there’s a thing to see how long something takes. There you go. Okay, so it took 54 milliseconds to figure out that this is not a cat.
[00:44:01]
Returning Predictions and Probabilities
So it’s returning two things. Is it a cat as a string? Is it a cat as a zero or one? And then the probability that it’s a dog, and the probability that it’s a cat. So the probability of zero, false, and one, true. But is it a cat? So definitely a dog. So we now want to create a Gradio interface, which basically has this information.
Creating a Gradio Interface
So Gradio requires us to give it a function that it’s going to call. So here’s our function. So we’re going to call predict, and that returns, as we said, three things. The prediction is a string, the index of that, and the probabilities of whether it’s a dog or a cat. And what Gradio wants is it wants to get back a dictionary containing each of the possible categories, which in this case is dog or cat, and the probability of each one. So if you haven’t done much Python before, a dict of a zip may be something you haven’t seen.
[00:45:04]
Python Idioms and Gradio Limitations
Very handy little idiom, well worth checking out. Ditto if you haven’t seen map before. Anyway, here it is. One slightly annoying thing about Gradio at the moment is that it doesn’t handle PyTorch tensors. You can see here PyTorch is not returning normal numbers, it’s returning tensors. It’s not even returning NumPy arrays. In fact Gradio can’t handle NumPy either, so we have to change everything just to a normal float. So that’s all that this is doing, it’s changing each one to a float. So for example, if I now call classify image with our doggy image, we get back a dictionary of a dog.
Classifying an Image and Creating the Interface
Yes, definitely cat, definitely not. So now we’ve got all that, we can go ahead and create a Gradio interface. So Gradio interface is something where we say, well what function do you call to get the output? What is the input? In this case we say, oh the input is an image.
[00:46:01]
And so check out the Gradio docs, it can be all kinds of things like a webcam picture, or a text, or you know all kinds of things. Give it a shape that it’s going to put it into. The output is just going to be a label. So we’re going to create a very, very simple interface.
Launching the Interface and Testing
And we can also provide some examples, and so there’s a dog, a cat, and a dono, which I’ll tell you about in a moment, which you’ll see here. There’s a dog, and a cat, and a dono. So once I launch it, it says, okay that’s now running on this URL. So if I open that up, you can see now we have, just like suvash, we have our own, not yet in production, but running on our own box, classifier. So let’s check. Dog. So you can click and upload one, or just choose the examples.
The Dogo Story and Model Confidence
There you are. So it’s running on my own laptop, basically instant, and I really have to tell you the story about this guy here. This is the dono.
[00:47:01]
Submit. Wait, why is it saying 100? Normally this says like 50-50. That’s a bummer, this model’s got messed up my whole story. So last time I trained this model, and I ran it on the dono, it said, it said like, it’s almost exactly 50-50. And the way we found this picture is, I showed my six-year-old daughter. She’s like, what are you doing dad? It’s like, I’m coding. What are you coding? Oh, you know, dog, cat, classifier. She checks it out, and her first question is, can I take your keyboard for a moment? And she goes to Google, and she’s like, what is a dog mixed with a cat called? Like, there’s no such thing as a dog mixed with a cat. Anyway, she goes to the images tab, and finds this picture. And she’s like, look, there’s a dog mixed with a cat. She said, run it on that dad, run it on that. And I ran it, and it was like 50-50. It had no idea if it was a dog or a cat. Now this model I just retrained today, now it’s sure it’s a cat.
Training Schedule and Model Confidence
So there you go.
[00:48:00]
I think I used a slightly different training schedule or something, or I gave it an extra epoch. Anyway, so that’s a dog cat. But apparently it’s a cat. I guess it is a cat. It’s probably right. I shouldn’t have trained it for as long. Okay, so there’s our interface.
Stopping the Interface and Creating a Python Script
Now that’s actually running, so you actually have to click the stop button to stop it running. So otherwise you won’t be able to do anything else near a notebook. Okay, so now we have to turn that into a Python script.
Copying and Pasting Code into a Script
So one way to turn it into a Python script would be to copy and paste into a Python script all the things that you need. I read a copy and paste into a Python script all those parts of this that you need. So for example, we wouldn’t need this. It’s just to check something out. We wouldn’t need this. It was just experimenting. This was just experimenting. We’d need this, right? So what I did is I went through and I wrote hash pipe export at the top of each cell that contains information that I’m going to need in my final script.
[00:49:06]
And then, so there are the steps, right? And then at the very bottom here, I’ve imported something called notebook to script from nbdev. And if I run that and pass in the name of this notebook, that creates a file for me called app.py containing that script.
Exporting the Notebook to a Script
So this is a nice easy way to like when you’re working with stuff that’s expecting a script and not a notebook, like HuggingFaceSpaces does, it’s fine to just copy and paste into a text file if you like. But I really like this way of doing it because that way I can do all of my experimentation in a notebook. And when I’m done, I just have a cell at the bottom. I just run and export it. How does it know to call it app.py? That’s because there’s a special thing at the top, default export, default exp, which says what Python file name to create.
[00:50:03]
So that’s just a little trick that I use. So now we’ve got an app.py. We need to upload this to Gradio. How do we do that? You just you just push it to git. So in you can either do it with Visual Studio Code or you can type git commit and then git push. And once you’ve done that, if we change minimal to testing, I think this hopefully might still be running my previous model because I didn’t push it.
Testing the Model in Production
That way we can see our crazy dog cat. All right, so here it is. You can see it running in production. So now this is something that anybody can, if you set it to public, anybody can go here and check out your model. And so they can upload it. And so here’s my doggy.
[00:51:02]
Yep, definitely a dog, cat. Yeah, I think I’m going to train this for an epoch or two less so it’s less confident.
Retraining the Model and Model Confidence
Yeah, definitely a cat. Dog cat. Hey, dog cat. Hmm, still thinks it’s definitely a cat. Oh well, so be it. Okay, so that is, okay, so that is an example of getting a simple model in production.
Community Questions and Epochs
There’s a couple of questions from the forum from the community. Okay, so one person’s asking, what’s the difference between a PyTorch model and a fast AI learner? Okay, that’s fine. We will get to that shortly.
[00:52:00]
Don’t know if it’ll be this lesson. It might be this lesson or the next lesson. And then somebody else asked, basically is asking, how many epochs do we train for?
Epochs and Error Rate
So as you train a model, your error rate, as you can see, it improves. And so the question is, should I run more? Should I increase the number of epochs? This is doing three epochs, right? Here’s my three epochs plus one to get started. Look, it’s up to you, right? I mean, this is here saying there’s a 1% error. I’m okay with the 1% error. You know, if you want it to be better, then you could use more data augmentation, and you could train it for longer. If you train for long enough, as we’ll learn about soon, maybe in the next lesson, if you train for long enough, your error rate actually starts getting worse. And you’ll see, we’ll learn about why. So basically, yeah, you can train until it’s good enough, or until you’ve run out of patience or time, or run out of compute, or until the error rate starts getting worse.
[00:53:15]
Okay, oh, and then in Colab, how do you grab your model?
Downloading the Model in Colab
All you need to do in Colab is, after you’ve exported it, is if you go into their file browser, you’ll actually see it here, right? And you can click download. It’s a bit weird. It doesn’t like pop up a box saying, where do you want to download it to? But instead, this kind of progress circle thing pops up, and so depending on how big it is, and so forth, it can take a few minutes. And once that circle fills up, then the browser thing will finally pop up and say, okay, you can save it. Okay, so that’s how you actually grab your model.
Free Resources for GPU Training
So as you can see, the step where you actually need a GPU, you can use these totally free resources, Colab, Kaggle, and there are other ones we’ll talk about in future lessons.
[00:54:09]
And then you can do everything else on your own computer, including the predictions. The predictions are fast, right? So you really don’t need to use a GPU for that, unless you’re doing thousands of them. Okay, here we go. So now it’s asking me to save it.
Installing Python and Jupyter Notebooks
Okay, so now one big issue is we needed, to run it on our computer, we needed Python and Jupyter Notebooks running on our computer. So how do you do that?
Fast Setup and GitHub Repository
Because this is where often people get in all kinds of trouble. I’m trying to figure out how to get this all working. So the good news is we’ve actually got something that makes it very, very straightforward. It’s called fast setup. There’s really only just one part of it you need. So let me show you. It’s, it’s actually a Git repository on GitHub.
[00:55:02]
Cloning the Repository and SetupConda.sh
GitHub’s the place where most Git repositories live. So if you go to GitHub fast.ai fast setup, you’ll see it. And so what you can do is you can now grab this whole repository just by clicking here on code. And if you’ve got GitHub desktop installed, click on open with GitHub desktop. And as you’ll see, it brings this up saying, okay, I’m ready to save this for you. So I click clone. So it’s making a copy of it. There we go. So basically once you’ve cloned it, you’ll then find there’s a file in there called setupConda.sh. Which, you know, the details don’t really matter. It’s pretty short. But that’s the thing that’s going to install Python for you. So at that point, you can just run .slash setupConda and it’ll run this installer.
[00:56:05]
Installing Python and Conda-based Distributions
Now, if you’ve got Linux or Mac, you’ve already got Python on your machine. Don’t use that Python. And the reason is because that Python, it’s called the system Python, it’s used by your computer to do computery stuff, right? It’s actually, it’s actually needed. You don’t want to be messing with it. I promise you. Like, it always leads to disaster. Always. You want your own development version of Python. It’s also going to make sure you’ve got the latest version and all the libraries you want. And by far the best one for you is almost certainly going to be these Conda-based Python distributions. So if you run setupConda, you’ll get the one that we recommend.
MambaForge and Installing Fast.ai
And the one we recommend at the moment is something called MambaForge. So basically, once you run it, you’ll find that you’ve now, and you close your terminal and reopen it, you’ll find you’ve now got one extra command, which is called Mamba.
[00:57:07]
And Mamba lets you install stuff. So once you’ve run it, you’ll be able to go Mamba install Fast.ai. And that’s going to, actually we should probably, I should mention, there’s actually more, a bit more detail about how to install it correctly.
Installing Fast.ai with Mamba
If we go to docs.fast.ai, installing. Yeah, okay. We actually want to do Conda install minus C Fast.ai. So let’s just copy and paste. Oh, sorry, not actually. And then the other thing I’ll say is instead of using Conda, replace Conda with Mamba, because nowadays it’s much faster. So Mamba install minus C Fast.ai. Now this is going to install everything you need. It’s going to install PyTorch, it’s going to install NumPy, it’s going to install Fast.ai, and so forth, right.
[00:58:07]
And so obviously I’ve already got it.
Installing nbdev and Using Jupyter
And then the other thing you’ll want to do is install nbdev. So you can do exactly the same thing for nbdev. You don’t have to, right. It’s just that, but that’ll install Jupyter for you, amongst other things. And so at that point you can now, you can now use Jupyter. And so the way Jupyter works is, you can see it over here. This is my, I’ll go ahead and close it so we can start again.
Starting Jupyter Notebook
So basically to use Jupyter, you just type Jupyter notebook. Okay, and when you run it, it’ll say, okay, we’re now running a server for you. And so if you click on that hyperlink, it’ll pop up this.
[00:59:02]
Okay, which is exactly what you see me use all the time. Okay, so you know that hopefully is enough to kind of get you started with Python and with Jupyter notebook.
Pip and Mamba for Installing Software
The other way people tend to install software is using something called pip instead of mamba. Pretty much anything you can do with mamba, you can also do with pip. But if you’ve got a GPU, pip isn’t going to install things generally so that it works on your GPU. You have to install lots of other stuff, which is annoying. So that’s why I kind of tell people to use mamba, but you can use pip otherwise. Still a little bit of red.
Asking for Help and Reviewing Steps
Please let us know how we can help you, gang. Okay, so let’s see. How are we going with our steps? I forgot I had these steps here to remind myself. We created a space, tick.
[01:00:00]
Creating a Space, Interface, and Git Setup
We created a basic interface, tick. Okay, we got git setup. We got conda and setup or mamba.
Mamba and Conda and Dogs vs. Cats
So mamba and conda are the same thing. Mamba is just a much faster version. And we’ll keep some notes on the course website because at the moment they’re actually working on including the speedups from mamba into conda. So at some point maybe it’ll be fine to use conda again. At the moment conda is way too slow, so don’t use it. Okay, we’ve done dogs versus cats. No problem.
Pet Breeds and Exported Learner
Yeah, so we could also look at pet breeds. Well, yeah, we’ll briefly look at that. Okay, we’ve used an exported learner. No problem. We used mbdev.
Using nbdev and Trying the API
No problem. Oh, okay. Try the API. All right, this is interesting.
Free Working Model and Gradio Flexibility
So I think we can all agree, hopefully, that this is pretty cool that we can provide to anybody who wants to use it for free a real working model.
[01:01:04]
And, you know, with Gradio, there’s actually, you know, a reasonable amount of flexibility around, like, how you can make your website look, you know, using these various different widgets. It’s not amazingly flexible, but it’s flexible enough to kind of… It’s really just for prototyping, right? So Gradio has lots of, yeah, widgets and things that you can use.
Streamlit and Building Prototypes
The other main platform at the moment that Hugging Face Spacer supports is called Streamlit. Streamlit is more flexible, I would say, than Gradio. Not quite as easy to get started with, but, you know, it’s kind of that nice in-between, I guess. So also a very good thing, you know, again, mainly for kind of building prototypes.
[01:02:01]
Building an App and the API
But at some point you’re going to want to build more than a prototype. You want to build an app, right? And one of the things I really like about Gradio and Hugging Face Spacers is there’s a button down here, View the API. So we can actually create any app we want. And the key point is that the thing that does the actual model predictions for us is going to be handled by Hugging Face Spacers, Gradio, right? And then we can write a JavaScript application that then talks to that.
JavaScript and Front-end Engineering
Now, there’s going to be two reactions here. Anybody who’s done some front-end engineering is going to be like, Oh, great, I can now literally create anything in the world because I just write any code and I can do it. They’ll be excited. And a lot of data scientists might be going, Oh, I have no idea how to use JavaScript.
[01:03:03]
It’s not in my, you know, inventory. So this is again where I’m going to say, Look, don’t be too afraid of JavaScript.
JavaScript and Data Scientists
I mean, obviously, one option here is just to kind of say, Hey, I’ve got a model, throw it over the wall to your mate who does know JavaScript and say, Please create a JavaScript interface for me. But let me just give you a sense of like, how really not hard this actually is.
Understanding JavaScript and the API Endpoint
So there’s a endpoint. There’s now a URL that’s running with our model on it. And if you pass it some data, an image, some image data to this URL, it’s going to return back the dictionary. So it’s going to do exactly the same thing that this UI does, but as an API, as a function we can call. And so it’s got like examples here of how to call it.
[01:04:01]
So for example, I can actually, let me show you the API as an example, using that minimal interface we had, because it’s just going to be a bit simpler.
Testing the API with Curl
So if I click curl, and I copy that, copy that and paste. So you can see there, oh, that’s not a great example passing in Hello World. If I pass in Tanishq again, let’s see how I’m getting to his name. You can see it returns back Hello Tanishq. So this is how these APIs work, right? So we can use JavaScript to call the API. And we’ve got some examples.
Creating a Website with TinyPets
So I’ve created a website.
[01:05:00]
And here is my website, TinyPets. And on this website, as you can see, it’s not the most amazingly beautiful thing, but it’s a website.
JavaScript App and HTML Code
It’s a start, right? And up here, I’ve got some examples. Here you go, single file, click, choose file, click. And in this example, I’m actually doing full pet classifications. I actually trained a model to classify breed, which we’ll talk about more next week, rather than just dog versus cat. So let’s pick a particular breed. And we run it. Oh, and there it is. Now, not very amazing, right? But the fact is that this is now a JavaScript app, means we have no restrictions about what we can do. And let’s take a look at that HTML. That’s it.
[01:06:01]
Running the App in a Browser
It easily fits in a screen, right? And the basic steps are not crazy, right?
Basic Steps in JavaScript Code
It’s basically, we create an input for our photo, we add an event listener that says when you change the photo, call the read function. The read function says create a file reader, read the file. And when you finish loading, call loaded, and then loaded says fetch that. Now that path there is that path there, right? Except we’re doing the full pets one. So this is basically just copied and pasted from their sample. And then grab the JSON. And then grab from the data, the first thing, the confidences, the label, and then set the HTML.
[01:07:05]
So as you can see, it’s like, okay, if you haven’t used JavaScript before, these are all new things, right? But they’re not, it’s not harder than Python, right?
Building a Multi-file Version
It’s just, it’s just another, just another language to learn. And so from here, you can start to build up, right? So for example, we’ve created a multi-file version.
Testing the Multi-file Version
So with the multi-file version, let me show you. Multi-file, choose. So we can now click a few. So we’ve got a Newfie, a Ragdoll, a Basset Hound, and some kind of cat. I’m not much of a cat person. So we chose four files, and bang, they’ve all been classified. Apparently it’s a Bengal. I wouldn’t know. There’s our Newfoundland. So there’s the multi-file version.
Code for the Multi-file Version
And if you look at the code, it’s not much more, right? It’s now just doing, it’s getting all the files and mapping them to read, and now appending each one.
[01:08:05]
So not much more code at all.
Community Examples and Get to Know Your Pet
And as you might have seen on our site here, there’s a few more examples, which is some of the community during the week has created their own versions. So this one here is, I think this is, yeah, this is from one of the Gradio guys. They called it Get to Know Your Pet. So if I choose a pet, I kind of, I really like this because it actually combines two models.
Combining Models and NLP
So first of all, it says, oh, it’s a Basset Hound. And then it lets me type in and ask things about it. So I could say, oh, what kind of tail does it have? Search. And so that’s now going to call an NLP model, which asks about this, oh, it’s a curved saber tail.
[01:09:01]
There we go. What maintenance does it need? So again, like here, you can kind of see how, oh, a Basset Hound’s ears must be cleaned inside and out frequently. So this is like combining models. So you can see this is something that you couldn’t do with just a kind of a ready-to-go interface.
Creating the Website and HTML Files
And so the next thing I wanted to point out is, how did we create the website? I showed you how to create an HTML file. But like, how do you create those?
Creating a Website and GitHub Pages
And how do you make a website out of them? Well, watch this.
Running the HTML File in a Browser
Let’s, here’s the source code to our most basic version. Okay, so I could just save this.
[01:10:04]
There we go. Okay, so we could open that with Visual Studio Code. And what we could actually do is we could, here it just is in Explorer or Mac and Finder. I could just double click on it. And here it is. It’s a working app. So you can see I don’t need any software installed on my computer to use a JavaScript app, right?
JavaScript App and Execution Environment
It’s a single file. I just run it in a browser. A browser is our complete execution environment. It’s a got a debugger. It’s got the whole thing. So here you can, you know, here you can see it’s, it’s just calling out to this external hugging faces endpoint. So I can do it all sitting here on my computer. So once I’ve got my HTML file that’s working fine on my computer in VS Code.
[01:11:02]
Hosting the Website with GitHub Pages
How do I then put it on the web so that other people can use it? Again, the whole thing’s free.
GitHub Pages and Fast Pages
There’s a really cool thing called GitHub Pages, which basically will host your website for you. And because it’s just JavaScript, it’ll, it’ll all work just fine. The easiest way to create a GitHub Pages site, in my opinion, is to use something called Fast Pages, which is a fast AI thing. And basically all you do is you follow the setup process.
Setting Up Fast Pages
So first it does, let’s just go through it. So it says generate a copy by clicking on this link. So I click the link. All right. Okay, give it a name.
[01:12:00]
I try to make everything public. I always think it’s good, good practice. You don’t have to. Create repo. Generating. Okay, and then there’s basically two more steps.
Creating a GitHub Pages Site
It takes about five minutes. We don’t have five minutes, so I’ll show you the one that I’ve already built, which is fastai slash tinypets.
Fastai/Tinypets and GitHub Desktop
And so once it’s done, you’ll basically end up with this empty site, which again, you just go code, open with GitHub Desktop, or open with Visual Studio, whatever. So open with GitHub Desktop, or you can copy and paste this to your terminal. And so any one of those is going to get you this whole thing on your computer. You can save your HTML files there, push it back up to GitHub.
Publishing the Website and Themes
And what you’ll find is we will, Fast Pages will show you the link to the website that is created for you. Now the website that’s created for you, you can make it look however you want using something called a theme.
[01:13:04]
Config.yaml and Jekyll Themes
So you’ll see it’s created a file called config.yaml, where you can pick a theme. So in this case, I picked a theme called Alembic, for no particular reason. So GitHub Pages uses something called Jekyll, and so any Jekyll theme will basically work. And so I picked out this theme.
Saving Files and Frontmatter
And so as a result, when I now save things into this repo, they will automatically appear in this website. And the files automatically appear up here in this list. So if you look at my index, that’s the home page, the entire file is just this. The only slightly weird thing is at the top of every GitHub Pages file, you have to have three dashes, title and layout, and three dashes. It’s called frontmatter.
[01:14:01]
And so once you do that, and save it, it will appear in your website.
Customizing the Website and Forking
So something else I did then, I was like, okay, well, that’s all very well that Fast.ai has created this website, but I don’t really like what it looks like. I want to create a different version.
Forking the Repository and Changing the Theme
No worries, you can go to Fast.ai TinyPets and click fork. And when you click fork, it’s going to create your own copy. So I did that under my personal account, which is jph00. And look, now I’ve got my own version of it. And now I can make changes here. So I made a few changes. One change I made was I went to config.yaml, and I changed the theme to pages themes hacker.
Enabling GitHub Pages and Changing the Theme
So once you fork, one thing you have to do, which normally Fast Pages does for you, is you do have to go to settings, and click pages, and actually enable GitHub Pages. By default, it’s turned off, so here you’ll just have to turn it on.
[01:15:03]
So use the master branch, root, save, and then it’ll say, no worries, it’s ready to be published. And so I changed the config.yaml file to point at a different theme.
Viewing the Updated Website
And so if you look at now jph’s TinyPets, it’s different. Okay, it’s got the same info, but it’s much more hackerish, because jph00 is a serious hacker, as you can tell from his website.
JavaScript, Websites, and Web Apps
So anyway, look, it’s a very brief taste of this kind of world of JavaScript, and websites, and so forth. But I wanted to give you a sense of like, you know, you don’t need any money, you don’t need any IDEs, you know, you don’t really need much code to get started with writing your own web apps.
Free Resources and Hugging Face Spaces
And thanks to HuggingFaceSpaces, you know, they’ll even host your model for you, and all you need to do is just have the magic string as a thing to call.
[01:16:07]
Signing Out and Next Lesson
Okay, so signing out, hacker Jeremy Howard. Thanks very much for watching. And in the next lesson, we’re going to be digging into some natural language processing.
Natural Language Processing and Model Workings
We’re going to be doing some of the same stuff, but we’re going to be doing it with language rather than pictures, and we’re going to be diving under the hood to see how these models actually work.
Stochastic Gradient Descent and Calculus
We’re going to learn about things like stochastic gradient descent, and we might even be having to brush off a little bit of calculus. I hope I haven’t put you off by saying the C word.
See You Next Time
We’ll see you next time. Thanks all. Bye.