上一篇我們講玩了Streamlit，今天我們來講另一個package，就是Gradio!

Gradio 是一個可以快速為機器學習模型構建 Web UI 的強大工具，無需編寫任何 HTML、CSS 或 JavaScript，只需用 Python 即可完成界面設計。可以用在將模型應用於各種任務，例如圖像分類、自然語言處理、語音識別等。

與 Streamlit 相似，Gradio 能夠輕鬆地將您的模型或算法轉換為可交互的網頁應用，並且在寫好功能後，Gradio 會自動生成相應的輸入/輸出界面，並啟動一個本地網頁供user訪問。

除了簡單地與模型交互，Gradio 還支援多種輸入/輸出格式，例如圖片、音頻、視頻、文本等，非常適合在深度學習、自然語言處理和機器學習等領域展示模型的性能與結果。

優勢

• 簡單易用：您只需寫 Python 程式，Gradio 會為您生成一個完整的 Web UI。
• 多種輸入/輸出格式：支援文本、圖片、音頻、視頻等各種形式，方便處理不同類型的任務。
• 即時預覽：啟動介面後，您可以立即看到模型的效果，方便測試和演示。
  這樣的功能使得 Gradio 在構建模型展示、快速原型設計、測試等方面非常實用，讓您能夠輕鬆地將模型展示給其他人。

首先，您需要安裝 Gradio，可以使用 pip 或 conda 進行安裝：

pip install gradio
conda install -c conda-forge Gradio

步驟2：將模型和 Prompt Template 寫出來
以下是與之前類似的部分，使用 ChatOllama 進行設置：

import gradio as gr
from langchain_community.chat_models.ollama import ChatOllama
from langchain_core.prompts import PromptTemplate

# 初始化 LLM 和 Prompt Template
llm = ChatOllama(model="llama3")

template = """System: You are a pro gamer. Let's work this out in a step by step way to be sure we have the right answer.
Question: {question}"""

prompt_template = PromptTemplate.from_template(template)
步驟3：定義模型交互的 Function
和之前一樣，我們需要定義一個函數來處理與 LLM 的交互：

def chat(input_text):
    full_prompt = prompt_template.format(question=input_text)
    response = llm.invoke(full_prompt)
    return response
步驟4：設置 Gradio 介面
最後，我們使用 Gradio 來創建網頁界面，這裡的 gr.Interface 會創建一個簡單的網頁表單：

# 定義 Gradio 介面
interface = gr.Interface(
    fn=chat,                    
    inputs="text",              
    outputs="text",             
    title="LLM Chat with Gradio",
    description="使用 LLM 模型進行問答互動"
)

運行 Gradio 介面

interface.launch()
這樣一來， Gradio 介面就能夠與模型交互，並且為用戶提供簡單的 UI，與之前的 Streamlit 功能相似。執行此代碼後，Gradio 會在本地啟動一個網頁界面，並顯示您設計的 AI app。

這樣我們就用Gradio為我們的AI APP，寫出一個簡易的UI了!