Founded in 2019 and acquired by Huggingface, the combination of Gradio and Huggingface is all you need to effectively show your machine learning capabilities to the world and share your algorithm on a shareable link! Gradio is one of the fastest ways and an amazingly code-friendly alternative to Flask to demonstrate your machine learning model with a friendly web interface anywhere and to anyone. Huggingface hosts these web pages on links that are active forever instead of 72 hours as originally done in Gradio, where you can check how your machine learning model works on a webpage, and with a shareable link, you can ask your peers to check your model’s performance!
Also, read -> How to choose your first programming language in 2022?
A brief introduction to Gradio and Huggingface
Gradio
Gradio is an open-source python library that can relate to flask and Gradio allows you to create easy-to-use and hassle-free customizable UI components for your machine learning model, an API, or any given function is not a lot of lines of code. You can integrate the GUI directly into your Python notebook to see it for yourself or host it on Huggingface space to share it with the world.
Visit it here: Getting Started with Gradio
Huggingface Spaces
Using a Huggingface account today, one can use their feature ‘spaces’ to host ML demo applications on your own profile. The two frameworks supported under ‘spaces’ in Huggingface are Streamlit and Gradio. While you can always choose to decide how your front-end looks with a custom framework or with custom HTML code, it’s always easier to do it using one of the given frameworks and Gradio seems to do a pretty good job at it making the applications.
Visit it here: Huggingface spaces
how to use them?
Using Gradio:
First, you need to install Gradio on your system to use it via a Jupyter Notebook or your own IDE. Follow these steps to see a very basic demonstration of how you can use Gradio.
Step 1: Install Gradio using the pip command
pip install gradio
Step 2: Import the library and Copy the following code to check if the installation worked
import gradio as gr demo = gr.Interface(fn=greet, inputs="text", outputs="text") if name == "main": demo.launch()
Step 3: The interface should appear automatically for you to be greeted by Gradio
You can understand the interface that you can customize as needed here: Getting started
Using Huggingface Spaces:
Using Huggingface Spaces is pretty straightforward as to use Gradio and Huggingface Spaces together, you can follow these steps as mentioned:
Step 1: Create a huggingface profile or account
It’s easy to sign up on the Huggingface platform, you can find the instructions on their home page, and it’s a simple process that shouldn’t take you more than a handful of minutes.
Step 2: Go to spaces and create a new space.
If you are aware of how GitHub works, you don’t really need any instructions here. It’s similar to creating a repository. You need to enter the name for the space and access it directly. It’s free for all so you can use it as you like. Make sure you choose ‘Gradio’ as the SDK when asked.
Step 3: Clone the space or use it as it is.
You can either clone the space to use it in your own system and replicate it or you can go ahead and enter your code as prepared in Gradio in a new .py file to be uploaded to the space which you can do using the create button in the hint given.
Step 4: Run the application
All you need to do is run the application, but ensure that the prerequisite libraries are all installed and ready to go for you. If you encounter a runtime error, it’s probably the application attempting to use a library that is not installed in Huggingface space.
Step 5: Check the link
Once your application has run without any errors and the building of the application is complete, copy the link for the URL of the application and see it working for your own self. Your application should have the input and output prompts as desired and you can customize this with a custom framework or HTML code but in our case, we use Gradio to do it.
For a YouTube tutorial of how you can do this, check out this video: huggingface spaces tutorial
You should be able to see your application running on a Huggingface space like this:
Huggingface Spaces Wikiart Diffusion Example
Conclusion:
While most data science enthusiasts learn programming and use it as a part of courses and projects, very few put it forward to the world in a way that it can practically show what they have learned. For example, one can proabably code in python and is said to do so using a credential like a certificate earned from a platform, which is a great thing for evidence but that is secondary when you compare it to something like a function in data science or a formula that you can make into a webpage for people all over the world to learn from.
Try making your own web app and drop a link to it in the comments below! We’d love to check it out too.
For more such content, check out our website -> Buggy Programmer
An eternal learner, I believe Data is the panacea to the world's problems. I enjoy Data Science and all things related to data. Let's unravel this mystery about what Data Science really is, together. With over 33 certifications, I enjoy writing about Data Science to make it simpler for everyone to understand. Happy reading and do connect with me on my LinkedIn to know more!
