Hey !
On se retrouve pour la 2e édition de La Potion FluttterFlow.
Et un nouveau format : Etude de cas !
L’idée est d’explorer ensemble des cas concrets. Identifier la problématique, mettre en place une méthodologie et… trouver une solution.
Aujourd’hui, on va faire une revue de code d’une fonction.
Les Custom Function sont vraiment un must have de FlutterFlow.
Un calcul, un traitement de données… difficile de faire sans. Si tu utilises FlutterFlow, tu as du remarquer que tu ne peux pas vraiment t’en passer.
Et les Custom, c’est juste du code en vrai.
Pour cette analyse, on va partir d’une fonction que l’on m’a partagée et on va la transformer en fonction de pro :
Pour que ce soit clair, l’objectif de la fonction :
calculer la somme des notes de la liste ‘recupVisit' et retourner le total
la date est récupérée pour que si l'utilisateur sélectionne une date alors on calcul la somme des notes, si non la fonction retourne 0.
Let’s go pour passer à une fonction de pro 🚀
Attend une petite minute.
Pourquoi déjà ? C’est bien joli mais à quoi ça sert ?
Principalement à optimiser, rendre notre app, c’est-à-dire l’ensemble de nos fonctions et écrans, plus performante, plus rapide, plus légère.
Mais aussi, et c’est tout aussi important, faire en sorte que ce soit facile et agréable de travailler sur ton projet. Le cerveau doit faire le moins d’effort pour comprendre.
Bon, assez de blabla, rendons cette fonction :
Compréhensible
Optimisée
Typée
Indépendante
Etape 1 : compréhension
La première étape va être de la rendre plus compréhensible.
Là.. On ne comprend pas trop, on récupère quoi ? C’est quoi cette date et alors ‘sumfi’ ?!?
Une fonction n’est pas suffisamment compréhensible quand :
🚩 Tu as besoin d’une explication
🚩 Tu mets trop de temps à comprendre
🚩 Tu n’es pas sûr.e de ce que doit faire la fonction
Pour y arriver, on va travailler sur le nommage de la fonction, des paramètres et des variables, cela donne cette version :
calculVisiteur devient calculateSumOfRatings
C’est mieux, on sait clairement ce que fait la fonction, elle calcule la somme des notes.
recupVisiteur devient visitorRatingList
On sait clairement que l’on a une liste de notes qui proviennent de visiteur.
selectedData devient selectedDate
Data veut dire donnée ce qui ne dite pas grand chose.
Il faut vraiment que les noms nous apprennent quelque chose.
*J’ai traduit en anglais. Ce point est abordé dans mon guide des bonnes pratiques FlutterFlow. A consulter ici.
Etape 2 : optimisation
Maintenant on va l’optimiser
Ici, le plus gros travail de la fonction c’est de faire la somme de tous les éléments d’une liste. Aïe. Mais bon c’est le besoin.
Cependant, on voit que si la date est antérieure à aujourd’hui, on renvoi 0. On se fout littéralement du calcul que l’on vient de faire en consommant nos précieuses ressources.
Et si on inverse juste ces lignes, on met la condition de date avant.
Wahou !
Maintenant si la date est passée, on renvoi 0 et on ne fait meme pas le calcul. Tant mieux on en a pas besoin.
La première règle du code : il est interdit de faire des choses inutile !
Voilà, le résultat :
Plus sympa non ?
Etape 3 : typer correctement
Ensuite, c’est on va la chouchouter et s’occuper de tous ces petits points d’interrogation. En Dart (le langage utilisé dans les Custom Function), il y a une règle c’est d’éviter les valeurs nullables.
Pour info, ça s’appelle le Null Safety mais on verra ça une autre fois.
Alors oui, des fois on peut pas, je te l’accorde mais dans la majorité des cas, on évite.
Par exemple, un liste, par défaut va être vide. Donc on va décocher la case “nullable” dans les paramètres et l’on peut retirer le point d’interrogation.
On pourrait réfléchir à une valeur par défaut pour la date mais on va l’aborder dans l’étape 4 plutôt.
Etape 4 : indépendance
Alors, bien sûr, j’aurais du commencer par celle-ci mais on aurait perdu tout l’intérêt de la démonstration 😏
Le principe fondamental d’une bonne fonction c’est l’indépendance, pour permettre une vraie modularité dans l’évolution et de corriger les bugs plus facilement.
Pardon ?
Ca veut dire qu’une fonction doit avoir une responsabilité unique. Elle ne doit accomplir qu’UNE SEULE TACHE.
Si tu ne doit retenir qu’une seule chose de cette édition, c’est bien celle-ci.
Revenons à notre fonction ! Si tu veux, tu peux prendre quelques minutes pour trouver toi-même.
Finito ?
Notre fonction qui s’appelle désormais calculateSumOfRatings fait en réalité 2 choses : elle calcule la somme, ok! Mais elle vérifie une date aussi. Et ça ! On aime pas trop du tout.
Pire, on vérifie la date et sous une certaine condition on ne calcule même pas la somme. WTF!
La solution c’est de sortir tout ce qui est lié à la date de là. Dehors !
On va bien vérifier si la date est nulle ou passée bien sûr mais on va le faire en dehors de cette fonction indépendante. On va l’appeler uniquement si on veut calculer la somme des notes.
On commence par supprimer la date de la fonction.
C’est beau n’est-ce pas cette clarté.
On conditionne l’appel de la fonction a une date ultérieure directement dans des actions.
⚠️ Volontairement, je ne traite pas le fait que la liste soit constituée de chaîne de caractères. Ce serait mieux d’avoir des entiers mais c’est un autre sujet. Et comme pour les fonctions, je ne préfère pas me disperser.
Ce travail en 4 étapes nous a permis d’arriver à une fonction de qualité :
compréhensible
optimisée
typée correctement
et indépendante
Ce sont les 4 points clés à garder en tête pour créer des fonctions.
Quelque soit ton niveau, si tu respectes ces 4 critères à chaque fois que tu rédiges une fonction, tu vas rapidement progresser et ce sera de plus en plus facile et rapide 💜
C’est terminé pour aujourd’hui
N’hésite pas à me faire un retour. Mon objectif est vraiment de te proposer du contenu actionnable, et sans toi, je ne peux pas y arriver.
Avant de partir :
Pour te remercier de partager la Potion FlutterFlow 🫶
Pour rappel, si tu recommandes La Potion FlutterFlow
3 recommandations → Une review de code personnalisée.
10 recommandations → Un Google Meet de 30 min avec moi.
25 recommandations → -50% sur ta 1ère session de coaching.
Il te suffit de cliquer sur le bouton juste en dessous pour obtenir ton lien personnalisé :
A la semaine prochaine
Vanessa