How to deploy a Panel app to Hugging Face using Docker?

Key Takeaways

hello everyone welcome to my Channel today I'd like to show you how to deploy a panel app to hugging face with five simple steps why do you want to do this because it's free and it's super simple and you can share your panel app with the world and uh yeah so why not let's get started the first step is to go to the hiking phase spaces page and click create new space the second step is just to fill out this form and create a new space let's call it panel example you need to select the space SDK then select docker you can also use streamlit or gradient because I'm a panel user I love panel and hugging face doesn't support panel yet so we can use a Docker image to deploy our Panel App it is okay it's actually not as hard as you might imagine it's actually quite simple I'll show you in a bit we can Define if either we want our space to be public or private let's make it private first we can make it public later now we can do step 3 which is cloning this GitHub repo to your machine and and then we can start coding copy and paste the Slime git clone open your terminal I use item but you can do use whichever terminal tool you like to use you can do it in base code directly also do get along okay cool now you should be able to go to this directory and then we can see there's a readme there I can check out what's in this readme yeah just hugging face configurations we can ignore that for now okay step four is the most important step which is to create the three files we need for our Panel App let's open up our vs code let's make it bigger cool let's open up this folder in vs code and we need to create three files app dot Pi is where we write our Panel App and then requirements.txt is where we Define our package dependencies and what kind of packages we need to run this app and then finally we need a Docker file to be able to run our app in a Docker image in a Docker container let's start with app.pi to create a panel app here so previously I have written an article called three ways to build a panel visualization dashboard um in this article I listed three ways to build a panel app I'm just going to copy and paste uh the code I have also made a video on this so check it out if you're interested bye for now we're just gonna copy this file and this app should be ready to go and now we can go to the requirement.txt we need two packages for this project one is panel and another one is HP plot HP plot is a plotting tool that is super easy to use both piano and HP plot are in the hollowvest ecosystem so I encourage you to check out the docs and learn more about those if you're interested and finally in the docker file let's go back to the hugging face instructions let's just copy and paste this for now and then we can revise based on our needs in the stalker file we specify the base image from python39 says the working directory AS Slash code copy the requirements.txt file to the container wrong PIV install to install packages into container and then CMD provides the commands to run our app for the container we need to change this to be able to run our panel apps what do we what we need to do is to do panel serve code app.pi panel serve will serve this app and then we need to define the address which is 0.0.0.0 port the default port in hacking face is 7860 so that's what we need right here and then we need um allow web socket origin as this will be my account name and the space name FS space please remember to change this to your username and this to your space name okay that's step four now the final step is just to commit all the files to hug and face and we're done let's see get status yes we created three files and then I'm just gonna add everything and then get status get commit Panel App push okay now we should see all those files we just created yay and then let's wait for hugging face to build our app and now after a few minutes you can see your app showing up on cutting face space and it's fully interactive you can play with this app you can share this link to whoever you want to share oh before you share that you need to make it public let's make it public first make the space public that's the five steps you need to know to deploy your panda app isn't it easy you might wonder what if I need to troubleshoot things I want to run it locally before I deploy it yes actually sometimes we need to do that and that's a very good practice so let's see how that works first of all you probably need to install Docker after you have a Docker installed you should be able to use Docker commands in your command line okay the only thing we need to change here is instead of this hugging face um URL we need to change it to our localhost zero zero zero zero dot 80 60. so so that the app will show up in our localhost okay let's see how Docker works first of all we need to build a Docker image we call it panel image and we build based on everything in this folder next we can run this Docker image Docker ROM give it a name we name the container called panel container 82 86.80 and then the image name you can see there's a conflict because I have written this before so which means I need to run Docker remove to remove this container first before I can build it again remove oh sorry typo panel container and then we can run Docker run again cool now let's see if we can see our app over here great we can see our app running locally can we serve multiple panel apps at the same time on hanging face yes you absolutely can here is an example where I hosted three panel apps um I have one app called panel Interactive and I can go back I have a text analysis app where we do some topic modeling and sentiment analysis and Grant analysis and then we'll have a trivia game that um will give us trivia questions so yeah so that's it for this video hope you find it helpful let me know if you have deployed a panel app to hugging face and please share with me I would like to see it thank you bye