Coucou toi 👋
Nouveau vendredi, nouvel épisode.
Les semaines avancent et ne se ressemble pas : comment ça s’est passé pour toi ? As-tu pu traiter toutes tes difficultés et continuer ton développement sans problème ?
J’espère de tout coeur que les tips te servent et que tu peux t’en servir dans tes projets pour aller encore plus vite.
Dis-moi si tu vois des choses à améliorer : l’idée c’est vraiment que cette newsletter te serve ! Bonne lecture 🤓
L’image de la semaine
Un image vaut mieux qu’un discours, surtout sur un thème aussi important : je veux parler de la préparation de ton MVP.
Quand tu commences ton projet, tu es forcément impatient de lui donner vie. Tu vas donc ouvrir Bubble et assembler des briques au fur-et-à-mesure pour construire l’application de tes rêves.
Le souci avec cette approche, c’est que tu vas littéralement te promener dans l’outil, tester des trucs, en supprimer, pendant un certain laps de temps. A la fin, tu risques d’être perdu avec un travail non exploitable.
Comme le disais Sénèque, “il n’y a pas de vent favorable à celui qui ne sait pas où il va”. Grosso modo, c’est en définissant un cap que tu vas déployer ton énergie dans la bonne direction. Pas de cap, pas de mouvement efficace, tout simplement.
Et ça passe par gros travail d’itération (Itération : action de renouveler, de répéter. Merci Jean-Philippe de m’avoir fait remarquer qu’on ne maitrisait pas tous le vocabulaire spécifique, tu vois j’ai fait un effort cette semaine 😇 )
N’écoute pas ceux qui te pressent trop au début : tu auras tout le temps de passer à l’action ensuite. Prends le temps de réfléchir à ton projet, d’en parler autour de toi, de l’approfondir, d’en définir les contours, de réfléchir à ce que tu veux faire en priorité, dans un second temps, etc.
Je ne dis pas qu’il faut passer TROP de temps à réfléchir, ce qui peut être rapidement handicapant. Il faut juste trouver un juste milieu entre la préparation et l’exécution.
Comment t’y prends-tu ? Tu te fixes des dead-line temporelles ? Des étapes à valider, sans contraintes de temps ? Arrives-tu à évaluer ton efficacité dans le lancement de ton idée ? Je serai ravi qu’on en discute, par retour de mail ou sur LinkedIn par exemple 👉 https://www.linkedin.com/in/charlesedouard/
Bon lancement !
Les tips Bubble
1. Le vide, c’est nul!
Savais-tu que dans tes conditions, Bubble traitait la valeur (empty) comme inférieure ou égale à zéro ?
Maintenant, oui.
Par exemple, tu mets un champs en rouge si la valeur est nulle. Mais si tu n’a pas mis de données, la condition sera validée aussi.
Méfiance donc dans tes conditions, car vérifier une condition nulle et pas de condition, ce sont des choses totalement différentes !
La solution : préfères un is empty, plus clair.
2. L’alternance, c’est maintenant
Tu préfères un tableau avec des lignes comme ça :
ou comme ça ?
Si tu préfères le premier, je ne vais rien t’apprendre, à ce stade j’espère que tu sais paramétrer correctement un repeating group.
Si tu préfères le second, suis le lapin blanc.
👉 Comme tu l’as remarqué, on ne peut pas cocher une case “Alterner les couleurs des cellules du tableau”, comme dans n’importe quel outil lambda qui manipule des tableaux.
Avec Bubble, tu dois créer ton propre fond de cellule et mettre une condition à ce fond pour lui dire d’alterner une cellule sur 2 la couleur de base du fond avec une autre couleur que tu préciseras. Pas simple.
Pour le fond, tu vas placer un élément Group dans ta cellule de repeating group et le faire occuper toute la place : il doit vraiment coller aux bords.
Puis dans les conditions de ton Group fond de cellule, tu précises When Current Cell’s index <- modulo -> 2 is 1 👉 Background-color = #la couleur d’alternance. Cherches bien la formule <- modulo -> dans la liste, tu ne dois pas la taper “à la main”.
Tu gères les couleurs dans l’ordre que tu souhaites, si tu veux la foncée avant ou la claire, libre à toi : il faut juste inverser la couleur de base et la couleur conditionnelle.
Ne te fies pas à l’aperçu Bubble qui va griser toutes tes cellules si tu checkes la condition avec “ON” comme on a vu la semaine dernière : le live fonctionnera !
Que se passe t’il avec cette fonction Modulo ? Wikipedia l’explique parfaitement :
En informatique, l'opération modulo[réf. souhaitée], ou opération mod1, est une opération binaire qui associe à deux entiers naturels le reste de la division euclidienne du premier par le second, le reste de la division de a par n (n ≠ 0) est noté a mod n (a % n dans certains langages informatiques). Ainsi 9 mod 4 = 1, car 9 = 2×4 + 1 et 0 ≤ 1 < 4, 9 mod 3 = 0, … L'opération peut être étendue aux entiers relatifs, voire aux nombres réels2, mais alors les langages de programmation peuvent diverger, en particulier a mod n n'est plus forcément positif ou nul3.
C’était évident, mais encore fallait-il y penser !
3. Supprimer tous les enfants
Toute ressemblance ou rapport avec un personnage contemporain ayant eu cette problématique dans l’ouest de la France est purement fortuite.
Le langage informatique regorge de bizarreries. On l’emploi tous les jours, mais sorti du contexte, un terme peut devenir totalement malsain.
Après le traditionnel débat de développeur Maître / Esclave, on va parler des enfants.
Dans une arborescence, on parle souvent d’enfants pour les éléments qui sont contenus dans un élément Parent. Si tu as ramé sur la notion de Parent Group, tu vois de quoi je parle.
Bubble a prévu que tu puisses vider un groupe de tous les éléments qu’il contient en un clic. RDV menu à gauche > clic droit sur le groupe parent > Delete all children.
Une astuce qui permet d’éviter un long nettoyage manuel fastidieux quand tu veux aller vite.
Le mini-tuto : 7 bavures classiques de la police
La police on en parle beaucoup, mais on fait les mêmes erreurs à chaque fois. Donc @swwiped nous a préparé un petit récapitulatif sacrément efficace !
Mettre tout en MAJUSCULE
Il y a peut-être des choses importantes à souligner dans ton texte, mais ce n’est pas une raison pour tout mettre en majuscule ! Comme tu le sais, sur Internet écrire en majuscule équivaut à crier, donc pas super agréable…
En faire des tonnes
Tu veux mettre en avant des mots particuliers dans ton texte et les distinguer ? N’utilise pas trop de styles différents pour le faire, ça devient vite le bazar !
Trop de polices flingue ton style
Choisis une police, max 2 et utilise les partout. Plus tu fais de mélanges, moins c’est lisible. Il en va de la crédibilité finale de ton projet, fais pas l’idiot !
Des coupures anarchiques
Tu as vite fais de te retrouver avec des mots orphelins sur une ligne : c’est pas super beau (mais c’est pas mortel non plus, faut pas exagérer).
Le texte centré
Classique de chez classique celui-ci, mais à éviter sauf cas particulier bien sûr. Pourquoi ? C’est très dur à lire et fatiguant pour les yeux.
Les lignes tassées
Je te le répéterai jamais assez, mais sur Bubble tu as de la place : profites-en !! Evites-donc de descendre en dessous de 1.5 en interligne pour un texte de taille 16px : il faut que tu respires.
Utiliser des ombres
C’est tentant, mais DON’T DO THAT !! C’est illisible (tu as vu, c’est pas super agréable de se faire crier dessus…😩 )
L’inspiration Bureau
Aujourd’hui, je te présente un petit dashboard bien rangé trouvé sur Dribble.
➕ c’est clair et frais
➕ les éléments sont bien présentés par bloc, facile pour le responsive
➕ la variété de données, parfaite pour un dashboard
➕ la colonne de gauche, sympa et très esprit Dashboard
➖ le champ recherche est invisible
L’inspiration mobile
Une fois n’est pas coutume, encore un peu de food, mais pas pareil non plus. L’idée c’est plutôt de te présenter un choix judicieux de panier, pensé par @alexey_savitskiy
➕ C’est clair, il y a de l’espace
➕ Couleurs agréables
➖ La suppression d’articles par swipe n’est pas proposée par Bubble, mais tu peux mettre une icône statique qui fera le boulot pareil
➖ j’ai des doutes sur l’emplacement et la taille de la barre de recherche…
Le mot de la fin
Pas facile de devoir s’arrêter, mais là mon Substack m’alerte depuis un moment pour me dire que j’ai dépassé la longueur autorisée sous Gmail. Si tu lis cette phrase, c’est donc que tu n’es pas sous Gmail, ou que je suis passé à travers les filtres #thuglife
Bon courage pour cette nouvelle semaine qui t’attend, d’ici-là profites bien du week-end pour te reposer (ou développer ton side project, sur Bubble bien sûr).
Bon chance 😘
Charles-Édouard Turquais
CTO nocode & formateur Bubble