10 Building Web-Based UI using Gradio
This chapter covers
- What is Gradio?
- Building basic UI using Gradio
- Configuring and customizing your Gradio application
- Sharing and deploying your Gradio application on HuggingFace Spaces
- Using the various components in Gradio
- Creating a chatbot UI for chatbot applications
Imagine you have just spent weeks coding your machine learning projects and it is finally done! Now, you are eager show it off to your friends and hopefully it will impress your boss. But there is just one more thing you need to do – create a nice shiny front-end so that you can impress your users. But while developers excel in technical aspects and problem-solving, their strengths may not always align with creative design. So how do you quickly come up with a nice web front-end that can interface with your machine learning models?
Introducing Gradio, an open-source Python package that makes it very easy for you to quickly build a demo web application to showcase your machine learning applications. What’s more, with a single click you can share a link to your demo application using Gradio’s built-in sharing feature.
In this chapter, you will get a jump-start in learning how to use Gradio, including some of the most used components. At the end of this chapter, you will be able to build various types of UI for different types of machine learning projects.
10.1 Basics of Gradio
To install the Gradio package, you can use the pip command in Jupyter notebook:
!pip install gradio