Miamondo

Web

  • À la découverte de Flask

    Bonjour, 

    Il y a quelques semaines, j'ai découvert Flask, une infrastructure de développement implémentée en Python et combinée à un serveur local. Son programme de base compte en tout et pour tout, sept malheureuses lignes de code!

    Scrot 5 000

    Une fois exécuté, il vous permet d'afficher Hello world, à l'adresse 127.0.0.1:5000, (c'est-à-dire localhost, port 5000). Pour pouvoir utiliser cet outil fort intéressant, il faut au préalable l'installer. Avec Archlinux, c'est un jeu d'enfant. mettez d'abord vos paquets à jour avec pacman -Syu puis entrez cette commande:

    sudo pacman -S python-flask

    Avec Debian et ses dérivés, c'est un peu plus compliqué mais vous trouverez la procédure à cette adresse.  

    Alors, comment est-ce que j'en suis venu à m'intéresser à Flask? Eh bien, c'est parce que je me suis mis en tête de créer mon propre site web pour l'héberger sur une raspberry pi. C'est un projet qui va m'occuper pendant plusieurs mois mais je suis bien avancé puisque le code HTML/CSS3 est déjà opérationnel. Certes, le design s'inspire de celui qui habille mon site actuel hébergé chez un SGB, mais je vous assure que je n'ai pas pompé une seule ligne de code! Sinon c'est pas du jeu. Voici donc à quoi ressemble le site autohébergé Miamondo 3.0 version alpha:

    Scrot 1

    Je suis relativement satisfait du résultat. Cela dit, je souhaite avoir un site qui soit un minimum interactif. J'ai donc créé un onglet de recherche qui, si je ne dis pas de bêtises, a besoin d'un peu de code javascript et d'une base de données pour fonctionner. Mais comme j'aime bien expérimenter des trucs (même si parfois ça part en cacahouète), je me suis dit que je pourrais peut-être essayer de trouver une solution alternative avec le langage Python. Et ça tombe bien puisque Flask est un outil qui marie joyeusement Python et HTML.

    Dans un environnement Flask expérimental, il est tout à fait possible de renvoyer à un visiteur, le résultat d'une recherche et ceci, en utilisant simplement du Python. Je le sais puisque je viens justement de le faire. Par contre, je ne sais pas si ce procédé fonctionnera une fois que le site sera en "production", hébergé dans sa raspberry Pi. J'ai des doutes car lorsque je démarre le serveur, voici le message qui s'affiche dans la console:
    WARNING: This is a development server. Do not use it in a production deployment. Use a production WSGI server instead.
    Je ne sais pas ce que c'est qu'un WSGI mais tout me laisse à penser que cette mise en garde en rouge n'augure rien de bon et qu'il faudra que je me mette en quête d'une autre solution...

    On verra bien. En attendant, voici comment j'ai procédé (d'abord le code suivi de quelques explications sommaires):

    Code Python

    Scrot 6

     

    Code HTML

    Scrot 7

    • Il s'agit bien évidemment de la portion de code HTML qui nous intéresse, c'est-à-dire celle qui correspond au champ de recherche "liée" au code Python. Pour le reste du code, c'est ici que ça se passe.
    • Dans mon répertoire utilisateur, j'ai d'abord créé un sous-répertoire intitulé webapp et j'y ai placé le script primaire de Flask (celui qui est tout en haut de ce billet). Il s'intitule app.py.
    • Je l'ai complété en important render_template (nécessaire pour afficher la page index.html) et request (nécessaire pour récupérer la recherche client dans une variable).
    • La fonction index() affiche la page d'accueil index.html
    • Cette page HTML doit être placée dans un sous-dossier de webapp intitulé templates.
    • En ce qui concerne le code CSS, les images du site et autres documents PDF, ils doivent être placés dans un sous-répertoire de webapp intitulé static. Au final, voici l'architecture de votre site:

    Scrot 8 000 

    • La fonction sniff() cherche dans la page index.html, les occurrences correspondant à la recherche du visiteur. Ce dernier n'est pas obligé de respecter la casse car le processus sniff met tout en minuscules. Vous noterez que les deux fonctions renvoient un résultat. Si ce n'était pas le cas, le programme planterait.

    On continue:

    • Je créé une liste vide et je récupère la totalité des lignes du fichier index.html que je joins avec la méthode "".join(). Ce n'est donc plus une liste mais un string. 
    • Je redécoupe cette gigantesque chaine de caractères en éléments séparés par "\n\n". Ce procédé m'oblige par contre à respecter des règles rigoureuses dans l'agencement de mon code html. Chaque section doit être séparée par "\n\n". Je me demande si je ne ferais pas mieux de créer un dictionnaire contenant tous les mots du site et qui, contrairement à une liste, n'aurait pas besoin d'être parcouru puisqu'il s'agit d'une table de hachage. À voir... Continuons:
    • Une fois les occurrences trouvées, la liste found se charge d'afficher le menu principal, la bannière, les articles qui contiennent l'occurrence recherchée et enfin, le menu latéral avec l'onglet de recherche (found.append(lines[-1]).
    • Si sniff() ne trouve rien, il affiche un message adéquat:

    Scrot 4

    • Si j'entre le mot Révolution en mélangeant volontairement majuscules et minuscules, sniff va m'afficher le premier article qui, de fait, contient bien ce mot.

    Scrot 3

     

    • Si j'entre le mot Massoud, sniff va m'afficher l'introduction du site et effacer le reste.

    Scrot 2

    Voilà... Tout ça pour dire que ça ne m'étonne pas que Flask soit devenu si populaire compte tenu de sa simplicité de mise en oeuvre et des possibilités qu'il offre. Je vais continuer à utiliser cet outil et à voir ce que je peux faire sur mon site 3.0 alpha, en utilisant simplement Python.
    @+