Création et déploiempent d'une application avec Streamlit

Cet article détaille les étapes de création d'une application avec Streamlit depuis la récupération des données jusqu'au déploiement.

Streamlit est un framework open-source Python conçu pour créer des web applications en quelques minutes. La particuliratié de cet outil est qu'il permet de créer des "data apps" sans connaissances prélables en front-end.

Le projet se déroule via 4 étapes :

1. Récupération des données
2. Traitement et modélisation
3. Utilisation de l'API Streamlit pour créer notre Web App
4. Déploiement

J'ai choisi de scrapper les données de test des smartphones du site Notebookcheck. Pour chaque test de smartphone, les éléments suivants ont été rédupérées:

• Marque du smartphone
• Modele
• L'ensmble des notes par catégorie (Performance, Batterie, Ecran...)
• Informations techniques (processeur, le gpu, mémoire ram)
• Le prix
• La date de publication

Pour plus d'informations sur la récupération des données : Voir le Projet

La librairie Pandas m'a permis de stocker les données obtenues dans des dataframes facilitant leur utilisation et traitement.

1# Procedure
2
3links  = get_links(3)
4data = []
5
6for link in links[:50]:
7    try:
8        soup = get_soup(link)
9        d = get_data(soup)
10        data.append(d)
11    except:
12        pass
13
14cols = get_cols(soup)
15df = pd.DataFrame(data, columns=cols)
16df.head()

• Données ✅
• Modélisation ✅
• Création de notre application ❌

Afin de créer notre application avec Streamlit, nous devons installer streamlit via la commande :

1pip install streamlit

L'API de Streamlit est extrêmement riche et nous permet d'afficher pratiquement tout ce que l'on souhaite.

Notre objectif est de créer une application permettant à un utilisateur de comparer deux smartphones.
Pour ce faire, l'utilisateur devra choisir :

1. Deux smartphones différents.
2. Des critères de compararaison (au moins 3).
3. Enfin, des informations conernant les deux smartphones seront affichées via un dataframe.

Pour le choix des smartphones, nous allons utiliser la fonction st.selectbox(). Cette fonction prend en entrée une description et une sequence. Celle-ci peut être un objet de type :

• Sequence
• Numpy.ndarray
• pandas.Series
• pandas.DataFrame
• pandas.Index En sortie, nous obtenons l'élément choisi par l'utilisateur.

Dans notre cas, nous allons récupérer pour le premier choix, l'ensemble des valeurs uniques pour la colonne 'Marque' ainsi que pour la colonne 'Modele'.

1# Selectbox pour la marque
2marques = df['Marque'].unique() # L'ensemble des marques
3marque1 = st.selectbox("Marque 1", marques)
4
5# Selectbox pour le modele
6# Nous allons filtrer notre dataframe avec le choix précédent.
7modeles = df[df['marque']==m1]['modele'].sort_values().unique()
8smartphone1 = st.selectbox("Smartphone 1", smarphones)

En ce qui concerne le choix des critères, nous allons utiliser la fonction multiselect(). Celle-ci fonctionne similairement à la fonction selectbox() mais permet de selectionner plusieurs éléments. L'élement retourné est une liste.

1# Multiselect()
2criteres = sorted(df.columns.to_list()[2:15])
3selection = st.multiselect("Quels critères voulez-vous selectionner ?", criteres)

Une des forces de Streamlit c'est également sa communauté grandissante et active et son nombre de composants...
Pour afficher la comparaison entre deux smartphones, rien de mieux qu'un graphique de type "radar".
Pour se faire, nous allons utiliser le composants st-echarts, developpé par Fanilo Andrianasolo, qui permet de profiter de la bibliothèque e-charts d'Apache directement sur note application. Rien que ça !

Après avoir terminé le développement de l'application, nous pouvons passer à la phase de déploiement.

Nous devons, tout d'abord, créer un repo sur Github. Dedans, nous retrouverons notre source de données, notre application, main.py ainsi qu'un fichier requirements.txt, celui-ci contiendra l'ensemble des bibliothèques que nous avons utilisé pour construire notre application.

Par la suite, nous nous rendons sur notre compte Streamlit et choisissons le repo précédemment créé. Streamlit se charge du reste et déploiera l'application directement sur leur serveur ! Pas mal, nan ?