Déployer un modèle d’apprentissage automatique en tant qu’application Web avec Anvil et Deepnote
Déployer la science des données avec rien d’autre que Python
Deepnote est un notebook Python très astucieux, hébergé dans le cloud, avec une incroyable collaboration en temps réel. C’est idéal pour travailler avec d’autres data scientists. Mais que se passe-t-il lorsque vous souhaitez partager votre projet avec des non-programmeurs ? Ils ont besoin d’une interface facile à utiliser — vous devez donc déployer ce que vous avez construit .
Anvil vous permet de créer des applications Web complètes entièrement en Python (aucun code HTML ou JS requis) – et vous pouvez le connecter à des blocs-notes externes.
Suivez-nous pendant que nous utilisons Deepnote et Anvil pour déployer un modèle d’apprentissage automatique en tant qu’application Web – une application Web que tout le monde peut utiliser !
Nous allons construire cette application — et ça va être facile !
Étape 0 – Obtenez le bloc-notes
Dans cet exemple, nous allons commencer avec un classificateur d’images qui peut faire la différence entre les chats et les chiens. Croyez-le ou non, faire fonctionner cet ordinateur portable dans le cloud est la partie la plus facile ! Ouvrez simplement le bloc-notes dans Deepnote et cliquez sur Dupliquer :
Cliquez sur « Dupliquer » pour faire une copie de ce bloc-notes dans votre propre compte Deepnote (gratuit).
Très bien, nous avons un cahier. Déployons-le en tant qu’application Web !
Étape 1 – Créez votre application Anvil
Créer des applications Web avec Anvil est simple. Pas besoin de lutter avec HTML, CSS, JavaScript ou PHP – nous pouvons tout faire en Python.
Connectez-vous à Anvil et cliquez sur « Nouvelle application vierge ». Choisissez le thème Material Design.
Tout d’abord, nommez l’application. Cliquez sur le nom en haut de l’écran et donnez-lui un nom :
Étape 2 – Ajoutez vos composants
Nous construisons l’interface utilisateur en faisant glisser et en déposant des composants depuis la boîte à outils . Déposez une carte et un FileLoader . Le FileLoader permettra aux utilisateurs de télécharger l’image qu’ils souhaitent classer.
Ensuite, ajoutez un composant Image , qui affichera l’image d’entrée, et un Label pour afficher la classification renvoyée.
Sélectionnez le Labelque nous venons d’ajouter et, dans les propriétés des composants, changez le nom en ‘results_lbl’. Ajoutez ensuite un composant d’espacement au-dessus de l’étiquette pour centrer l’étiquette sur l’image.
Maintenant que nous avons une interface utilisateur, connectons notre application au code dans notre cahier Jupyter.
Étape 3 – Activer la liaison montante
Depuis l’IDE, activons la liaison montante. Ouvrez le menu Gear en haut à gauche de l’IDE, puis sélectionnez Uplinkpuis Enable the Anvil Server Uplink.
Cela nous donnera alors une clé Uplink que nous pourrons utiliser dans notre cahier Deepnote.
Installons maintenant l’Uplink dans notre environnement Deepnote et connectons notre script à l’aide de la clé que nous venons de créer.
Étape 4 – Installez la bibliothèque de liaison montante dans notre bloc-notes Deepnote
Il est temps de connecter notre notebook à Anvil !
La première chose que nous devons faire est d’installer la anvil-uplinkbibliothèque. Ajoutons !pip install anvil-uplinkà notre carnet :
!pip install anvil-uplink
L’ !opérateur indique à notre notebook que cette ligne est un script de ligne de commande et non du code Python.
Étape 5 – Connecter notre script
Maintenant que la bibliothèque Uplink sera installée au démarrage de notre notebook, nous pouvons connecter notre notebook de la même manière que tout autre script Uplink.
Commencez par importer le anvil.servermodule :
importanvil.server
Connectez-vous ensuite à la liaison montante :
anvil.server.connect("your-uplink-key")
Remplacez « votre clé de liaison montante » par la clé de liaison montante de votre application.
Exécutez la cellule. Vous devriez voir une sortie comme celle-ci :
Connecting to wss://anvil.works/uplink
Anvil websocket open
Authenticated OK
C’est ça! Lorsque nous exécutons notre ordinateur portable, il se connecte désormais à notre application Web via la liaison montante. Ensuite, créons une fonction que nous pouvons appeler depuis notre application Anvil.
Étape 6 – Création d’une fonction appelable
Dans une nouvelle cellule, définissons une fonction que nous pouvons appeler depuis notre application pour classer une image. Nous l’appellerons classify_image, et le décorerons @anvil.server.callablepour pouvoir l’appeler depuis le Web.
L’image sera transmise à notre fonction en tant qu’objet multimédiaclassify_image Anvil . Nous allons l’écrire dans un fichier temporaire et le charger dans Pillow .
Notre cahier a déjà une fonction, get_prediction(), pour faire passer l’image de l’oreiller dans le classificateur. Nous appellerons cette fonction et renverrons les résultats en deux parties : le score numérique, puis la classification. Nous dirons que tout ce qui obtient un score inférieur à 0,5 est un « chien », et tout le reste est un « chat ».
Voici à quoi devrait ressembler notre cellule finie :
Notre cahier est maintenant prêt à classer les images ! Revenons à notre application Anvil et appelons cette classify_imagefonction lorsque quelqu’un télécharge une image.
Étape 7 – Appel des fonctions du bloc-notes à partir du Web
Dans la vue de conception de notre application Anvil, double-cliquez sur le composant FileLoader que nous avons ajouté précédemment. Cela nous mènera à la vue du code et ajoutera une fonction qui s’exécute chaque fois qu’un fichier est téléchargé.
Dans la fonction, tapez anvil.server.callable()et transmettez-lui le nom de notre fonction notebook 'classify_image'. Ensuite, transmettez-le filecomme argument à notre fonction de bloc-notes. (Anvil se chargera de transmettre les données.)
Nous pouvons alors créer deux variables, scoreet cls, et leur attribuer les deux valeurs renvoyées par classify_image:
Etape 8 – Affichage de notre classement
Nous avons les résultats – il est temps de les montrer à l’écran !
Toujours dans notre file_loader_1_changefonction, affichons la classification sous forme de texte sur notre Label, et affichons l’image uploadée sur le composant Image.
Nous définissons le texte de results_lblpour inclure à la fois la classification et le score renvoyé par notre modèle :
self.results_lbl.text=f"{cls} ({score:.1f})"
Définissez ensuite la source image_1du fichier téléchargé :
self.image_1.source=file
La fonction finie ressemblera à ceci :
deffile_loader_1_change(self,file,**event_args):"""This method is called when a new file is loaded into this FileLoader"""score,classification=anvil.server.call('classify_image',file)self.result_lbl.text=f"{classification} ({score})"self.image_1.source=file
Nous avons maintenant une application qui prend une image, l’envoie à notre cahier Deepnote, la classe et renvoie les résultats à notre application. Tout est dans le cloud, et tout en Python !
Il ne nous reste plus qu’à déployer notre application sur Internet pour que tout le monde puisse l’utiliser.
Étape 9 – Publier notre application
Depuis l’IDE, ouvrez le menu Gear en haut à gauche de l’IDE, puis sélectionnez Publish apppuis Share via public link. Choisissez une URL et cliquez sur « Appliquer »:
C’est tout – nous avons déployé un modèle d’apprentissage automatique en tant qu’application Web, avec Deepnote hébergeant le bloc-notes et Anvil hébergeant l’application Web. Mieux encore, nous n’avions besoin de rien d’autre que de Python !
Cloner l’application
Vous pouvez ouvrir le code source de l’application Anvil terminée ici :
Si vous ne l’avez jamais vu auparavant, Anvil rend le développement Web accessible : créez des applications Web complètes sans douleur, sans JavaScript, HTML ou CSS – uniquement Python .
La plate-forme d’exécution est open source et l’IDE en ligne est gratuit, vous pouvez donc l’essayer sur https://anvil.works .
