إنشاء واجهات تعلّم الآلة باستخدام Streamlit

اكتشف كيفية إنشاء واجهات مستخدم تفاعلية لتطبيقات تعلّم الآلة باستخدام Streamlit.

الإعداد الأساسي

1. التثبيت

pip install streamlit pandas numpy plotly scikit-learn

2. البنية الأساسية

# app.py
import streamlit as st
import pandas as pd
import plotly.express as px

# Configuration de la page
st.set_page_config(
    page_title="Application ML",
    page_icon="🤖",
    layout="wide"
)

# Titre et description
st.title("Application ML Interactive")
st.markdown("""
    Cette application permet de :
    - Visualiser des données
    - Faire des prédictions
    - Analyser les résultats
""")

مكوّنات الواجهة

1. الأدوات الأساسية (Widgets)

# Widgets de saisie
text_input = st.text_input("Texte", "Valeur par défaut")
number_input = st.number_input("Nombre", min_value=0, max_value=100)
selectbox = st.selectbox("Sélection", ["Option 1", "Option 2", "Option 3"])
multiselect = st.multiselect("Sélection multiple", ["A", "B", "C"])

# Boutons et actions
if st.button("Exécuter"):
    st.write("Action exécutée!")

# Cases à cocher
if st.checkbox("Afficher les détails"):
    st.write("Détails supplémentaires...")

2. عرض البيانات بصريًا

# Création d'un graphique
def create_chart(data):
    fig = px.line(data, x='date', y='value')
    st.plotly_chart(fig, use_container_width=True)

# Affichage de tableaux
def display_table(data):
    st.dataframe(data)
    st.table(data)

# Métriques
col1, col2, col3 = st.columns(3)
with col1:
    st.metric("Précision", "95%")
with col2:
    st.metric("Recall", "92%")
with col3:
    st.metric("F1-Score", "93%")

ميزات متقدمة

1. إدارة الملفات

# Upload de fichiers
uploaded_file = st.file_uploader("Choisir un fichier", type=['csv', 'xlsx'])

if uploaded_file is not None:
    if uploaded_file.type == "text/csv":
        data = pd.read_csv(uploaded_file)
    else:
        data = pd.read_excel(uploaded_file)
    st.write(data)

2. الشريط الجانبي والتنقل

# Configuration de la sidebar
with st.sidebar:
    st.title("Configuration")
    model_type = st.selectbox(
        "Type de modèle",
        ["Classification", "Régression", "Clustering"]
    )
    
    parameters = {
        "learning_rate": st.slider("Learning Rate", 0.01, 1.0, 0.1),
        "epochs": st.number_input("Époques", 1, 100, 10),
        "batch_size": st.selectbox("Batch Size", [16, 32, 64, 128])
    }

3. التخزين المؤقت والأداء

@st.cache_data
def load_data():
    return pd.read_csv("data.csv")

@st.cache_resource
def load_model():
    return joblib.load("model.pkl")

# Utilisation
data = load_data()
model = load_model()

التكامل مع الواجهة الخلفية

1. استدعاءات API

import requests

def call_api(data):
    response = requests.post(
        "http://localhost:8000/predict",
        json=data
    )
    return response.json()

# Interface de prédiction
def prediction_interface():
    st.subheader("Faire une prédiction")
    
    # Formulaire de saisie
    with st.form("prediction_form"):
        features = {}
        for feature in ["age", "income", "education"]:
            features[feature] = st.number_input(feature)
        
        submitted = st.form_submit_button("Prédire")
        
        if submitted:
            result = call_api(features)
            st.write("Résultat:", result)

2. معالجة الأخطاء

def safe_api_call(func):
    def wrapper(*args, **kwargs):
        try:
            return func(*args, **kwargs)
        except requests.exceptions.RequestException as e:
            st.error(f"Erreur de connexion: {str(e)}")
            return None
    return wrapper

@safe_api_call
def get_prediction(data):
    return requests.post("http://localhost:8000/predict", json=data).json()

أفضل الممارسات

1. واجهة المستخدم

   • تصميم متجاوب
   • تنقل بديهي
   • تغذية راجعة للمستخدم
   • معالجة الأخطاء

2. الأداء

   • التخزين المؤقت للبيانات
   • تحسين الطلبات
   • التحميل التدريجي
   • إدارة الذاكرة

3. الأمان

   • التحقق من المدخلات
   • حماية البيانات
   • إدارة الجلسات
   • تسجيل الأحداث (Logging)

الخاتمة

أهم النقاط التي ينبغي تذكرها:

• واجهة تفاعلية
• عرض بصري فعّال
• أداء محسّن
• تكامل مع الواجهة الخلفية

التوصيات:

• اتباع أفضل الممارسات
• تحسين الأداء
• اختبار الواجهة
• توثيق الشيفرة البرمجية
• التعمّق في تعلّم Streamlit