Est-ce qu'après cette vidéo le responsive vous paraît être moins angoissant et compliqué ? Est-ce que vous aviez connaissance du fluide design ? Vous y faisiez gaff jusque là ?

@viravongtong3644

2 жыл бұрын

je dirais qu'il faut .... le faire mais bootstrap 😭😭😭😭😭

@pascalstrentz9549

2 жыл бұрын

Oui fais nous une vidéo sur le fluide design avec des exemples Merci

@ta_pls8767

2 жыл бұрын

Il ne manque plus que l'italien et ça deviendra Davinci Code.

@kaeduss494

2 жыл бұрын

En formation, on nous dit de coder mobile first, mais on où en avait pas forcément expliquer l'intérêt, c'est beaucoup plus clair maintenant. Et c'est quoi ce designer qui fait pas de responsive avec une maquette Figma :D

@viravongtong3644

2 жыл бұрын

@@kaeduss494 un feignasse lol ^^ bon après figma ça reste figmou quoi on ns l'a dit cash mais selon les formations ça va être plus ou moins approfondi je pense

Merci pour ce contenu de qualité! oui une video sur le " Design fluide" serait vraiment appréciée

Yo ! Je dois admettre que ta vidéo est grave intéressante, étant développeur junior front les breakpoints je connaissais. En revanche la méthode du mobile-first m'étais inconnu et honnêtement c'est vraiment pas con :D. Je tacherais d'y pensais la prochaine fois merci !!

@Wisigoth31

2 жыл бұрын

Mobile first !!! Merci Grafikart !!!

Salut! Je connaissais le mobile first mais plus dans le sens: "il faut penser au format téléphone au début car on est sûr du comportement voulut", alors qu'avec ton explication ça me semble tellement plus logique maintenant, ça me motive pour m'y mettre. Pour le fluide design, je le faisais déjà avant l'apparition des flexbox en utilisant des pourcentages pour séparer mes éléments, ça rendait plutôt pas mal mais il y avait souvent des comportements chaotiques. Maintenant avec les flexbox c'est tellement plus simple et ça rend tout de suite bien!

Je me suis pris de passion pour tes vidéos ! elles sont vraiment bien , continue sur le thème du responsive j'adore ♥

Super vidéo comme d'hab ! Je te suis depuis longtemps et dernièrement je trouve vraiment que la forme et le fond de tes formats fait vraiment le taff ! J'ai le doux rêve de t'entendre parler un jour d'accessibilité. Un sujet ô combien négligé et inconnu pour une majorité de dev front (et pourtant essentiel, utile pour un tas de gens et pas si compliqué)

@BenjaminCode

2 жыл бұрын

Très bonne suggestion ! Je n'en suis pas moi même un expert car je n'ai jamais digger des formations sur le sujet mais je pense avoir développer par mal d'automatisme et de bonnes pratiques qui rendent mon travail accessible. J'ai pas mal de tuyaux à partager mais une chose est sûre, il va ne falloir bûcher le sujet si je veux pouvoir l'aborder sans dire de conneries !

@lucilleMalz

2 жыл бұрын

@@BenjaminCode très enthousiaste à l'idée que tu développes ce sujet également !

Hey, merci pour ta vidéo :) Pendant ma formation j'étais tombé sur un article qui expliquait la différence entre "Responsive Design" et "Adaptive Design". Apparemment ces termes font consensus. Je cite l'article: "A website created with responsive design serves up the same site to every device, but that site is fluid and will change its layout and appearance based on the size and orientation of the device. ... In adaptive design, a different website layout is created for each device’s screen. As it loads, the site recognizes the size of the screen and serves up the layout that was made for that viewport." (Source: "Responsive vs. Adaptive Design" sur CareerFoundry) En gros ce que tu appelles "Fluid design" j'imagine que c'est ce qu'ils appellent "Responsive", et "Adaptive design" c'est un site qui utilise des breakpoints pour modifier le layout. Du coup un site a besoin d'un mélange d'adaptive ET de responsive pour garantir une bonne utilisabilité sur tous les supports.

@nebjil06

2 жыл бұрын

Pas vraiment en fait, l'adaptive design voit plutot ça comme un front entièrement différent en fonction du device. Souvent on fait un mixe entre les 2, il y a un site mobile et un site desktop distinct qui ont chacun des elements responsive en fonction da taille d'écran.

@arnoclr

2 жыл бұрын

@@nebjil06 en général le site mobile n'est pas conçu pour desktop, mais l'inverse oui, vu qu'il existe des ordis avec des petits écrans

J'ai même pas fini la vidéo et je peux déjà dire : tu fais du boulot très propre. Je te suis depuis pas mal d'années et j'ai l'impression que cette chaîne a fait un pas en avant sur la qualité du contenu. Bravo !

@BenjaminCode

2 жыл бұрын

Merci du soutien Raph !

Pour le coup, c'est tellement agréable de voir quelqu'un mettre des mots sur ce qu'on fait au quotidien et qu'on peut avoir du mal à expliquer le pourquoi du comment. Le responsive, c'est une question d'habitude et de bonnes pratiques ! À force de concevoir des structures qui seront agréable en mobile & en desktop, vous finirez par développer des mécanismes et ça n'en deviendra que des plus agréable. N'ayez pas peur, c'est génial.

Oui une vidéo sur la fluidité m'intéresse please 🤓 Merci pour tes vidéos, elles sont inspirantes et sont une grande source de connaissances, et toujours avec ta bonne humeur ça fait plaisir :)

Très bon vulgarisateur. Je regarde souvent sans pour autant savoir « coder » mais tu aides à beaucoup mieux comprendre cet univers Merci!

Super vidéo comme dab merci. Pour ma part j’ai toujours parlé d’adaptative design et de responsive design. J’ai l’impression qu’on fait plus d’adaptative avec des blocks qui s’adaptent à la taille que du responsive qui va modifier le contenu en fonction de la taille. Sûrement plus simple de faire de l’adaptative que du responsive. Continues comme ça c’est un bonheur de suivre tes vidéos

Toujours trop bien! Merci Benji!!

J'ai eu la chance d'apprendre à coder directement en mobile first. Donc pas d'angoisse de mon côté. Par contre vu ma formation (reconversion professionnel par le biais OpenClassRooms), J'ai vraiment beaucoup de mal à commenter mon code. Je ne sais pas ce que je dois commenter et comment. Si tu souhaites faire une vidéo sur ce sujet, je trouverai ça vraiment très intéressant. Merci pour ton travail comme d'habitude.

@_Greenflag_

2 жыл бұрын

Si ton seul problème est de savoir comment commenter ton code, alors tu n'as pas de problème ... ; ) Jette un coup d'œil au bouquin "Clean Code", c'est un des chapitres abordés. En gros, ne pas faire des commentaires évidents qui vont polluer la lecture du code. Les commentaires doivent être très spartiates. Uniquement commenter le code qui est très optimisé et condensé, par des infos courtes...

@niang46

2 жыл бұрын

Coucou! Je suis en pleine réflexion de reconversion également (je suis prof de physique dans le privé), et j'ai justement commencé les cours libres d'openclassrooms y'a 3 jours, je viens de voir le cours sur flex. Et du coup je me demandais si tu avais juste suivi les cours libres comme moi ou si tu avais suivi une réelle formation? Et surtout qu'est-ce que tu as fait ensuite? Je me demande vraiment quel est le chemin à suivre pour se former proprement en reconversion. Merci d'avance!

@darialyphia

2 жыл бұрын

Bonjour, tu n’as pas à commenter ton code dans 99% des cas. Dans l’absolu tu ne vas commenter que quand tu dois donner une info sur quelque chose qui ne s’exprime pas par le code car ça vient d’un facteur extérieur, par exemple un hack css un peu niqué parce que safari se comporte bizarrement

@viravongtong3644

2 жыл бұрын

si tu dois bosser en equipe fais des coms du style " barre de navigation " " le footer " etc pour que le prochain lise ton code plus vite ou des hacks chelous aussi à mettre en avant ou expliquer

@mathieumorel2509

2 жыл бұрын

@@niang46 salut, aujourd'hui il est possible de ce former seul sur internet mais il existe un problème à ça. Sur internet tu as la ressource pour apprendre l'ensemble des notions voulu dans un domaine (web, appli mobile, ... ). Mais souvent le plus dur c'est de trouver une structure sur le long terme. Je pense que dans un premier temps il faut que tu regardes les branches du dev qui t'intéresses web, mobile, logiciel, réseau. Dans ces grandes branches il y a plein de métiers, ex: dans le web c'est encore 2 grandes catégories le front et le back (c'est plus complexe que ça en réalité t'as une super vidéo sur la chaîne concernant le front). Après en fonction de ce que tu veux tu peux trouver des map qui retracent l'ensemble des notions nécessaires pour commencer à faire ses propres projets perso. Par exemple pour le front end tu as la vidéo de la youtubeuse coder coder qui détaille pas si mal le parcours pour faire du front. Et concernant les ressources je peux te conseiller : freecodecamp, graphikart et openclassrooms (un peu vieux sur le PHP par exemple), coder coder, code with mosh, dev simplified, code ninja pour les vidéos. En bouquin t'as la collection de the pragmatic programmers qui est génial pour tout les langages et le livre de refactoring guru sur les design patterns pour maîtriser la OOP. Bonne chance !

OUI ! Je le veux !

Ouuuii une vidéo sur la fluidité ce serait top !!! Je commente jamais mais u m'as fait découvrir le code et maintenant et je suis dev depuis 1 an et je me suis jamais senti aussi bien dans un métier ! Merci pour tes vidéos elles sont vraiment cool !

Au début quand je faisais le responsive, je me prenais pour un génie du responsive parce que ça marchait sur tous les écrans, alors que je plaçais 30 000 breakpoints. PS: 7:11 à propos de cet événement, les historiens de l'époque (qui étaient pas vraiment des historiens au sens scientifique actuel, mais plutôt des idéologues) rapportent que César était tellement snob qu'il aurait prononcé "Toi aussi mon fils" en Grec avant de mourir en regardant Brutus

@rocramos6091

2 жыл бұрын

@Fragment 5 Oui selon l'historien Suétone, parler ou écrire en Grec ancien était une marque d'éducation raffinée. Par exemple Marc-Aurèle empereur et philosophe romain écrivait en Grec ancien

@rocramos6091

2 жыл бұрын

@Fragment 5 Non c'est du Latin, mais des historiens rapportent que César aurait dit en vrai "Καὶ σὺ τέκνον"

@filiaaut

2 жыл бұрын

D'ailleurs, c'est rigolo, mais dans différentes langues, la "citation" en latin qu'on a retenue n'est pas la même. Les francophones ont "tu quoque, mi fili", qui nous viendrait de l'abbé Lhomond, qui a rédigé un manuel pour l'enseignement du latin au XVIIIe siècle ; les italiens ont retenu "Tu quoque, Brute, fili mi", je ne sais pas d'où ça sort, mais vu que la page Wikipedia en italien mentionne que la phrase sert de moyen mnémotechnique pour retenir des vocatifs irréguliers, c'est pas impossible qu'elle aie aussi été crée par un prof de latin à un moment ; les anglophones ont "Et tu, Brute", qui leur vient de Britannicus, une pièce de Shakespeare.

@rocramos6091

2 жыл бұрын

@@filiaaut Hahahahaha c'est marrant je savais pas. Merci pour l'info

Tjrs un plaisir de t’écouter! Merci

Oui une vidéo sur la fluidité

Très intéressant encore une fois! C'est assez étonnant de voir le nombre de personnes qui ne connaissaient pas le principe du Mobile First.. Je viens de finir une formation en web design (de 10mois) et c'est clairement ce qu'on apprends au tout début, notamment aussi pour le code DRY ! Etant très intéressée par le code et aussi par le design, une vidéo sur le Fluide Design serait la bienvenue :D Merci pour tout ce que tu fais! :)

11:46 AMEN! merci merci merci de pointer ce point

Comme à chaque fois vidéo au top 👌

Trop bien la video 😃 carrément fluidifie ta commu!

Merci Benjamin

merci benjamin pour cette video une fois de plus captivante et simple a comprendre

Un grand oui pour une vidéo sur la fluidité ! Et top comme vidéo, comme d'hab :)

Le "cette vidéo me coute" m'a fait m'abonner XD

Excellente vidéo ! :)

Ta manière de traiter les sujets très amusante 😊

Merci pour tes vidéos, toujours des pépites d’infos 👏

J'ai eu la chance d'avoir était guider par un super mentor quand j'ai commencé le dev frontend il y a 2 ans, il m'a montré tout ces petits trucs au tout début de mon auto formation, mon mentor ne fait que me montrer comment faire et il me laisse seul avec la maquette après ... je m'attendais a voir une surprise super cool à la fin de ta vidéo mais bof c'était juste une vidéo qui me montre à quel point mon mentor était super 🙈 Cette vidéo va sûrement m'aider à guider un junior dans son apprentissage du métier intégrateur .. merci mec

Super, hâte de voir la vidéo sur la fluidité, entre les blocs et des tailles de police fluide 😉

Super vidéo comme dhab!

Benjamin code a de nouveau une place dans mon cœur ! ❤️ avec cette video, tu reviens à la base, c'est à dire expliquer le code et donner les bonnes pratiques ! On veut une vidéo sur le Fluide Design !!! :D

@BenjaminCode

2 жыл бұрын

Après j'ai pas une liste infinie de conseils à donner donc faut bien que je diversifie mes vidéos !

@julieno.2053

2 жыл бұрын

Ouiii ! :) Une vidéo sur le Fluide design 🙏🔥🔥

@monsieurm2904

2 жыл бұрын

@@BenjaminCode Je ne connais personne d'autre qui a ton style sur DevTube ! C'est super que tu tentes de nouveaux concepts !

Déjà simplement merci pour ce contenu très intéressant et oui pour une vidéo sur la fluidité. Il existe effectivement un terme mais aucun souvenir 😭😂

Votre dernière partie exprime très bien ce qu’est le responsive web design aujourd’hui et demain. Les breakpoints deviennent un outils de dernier recours presque. En tout cas c’est ainsi que j’aborde les problématiques aujourd’hui avec grid et flex, les unités relatives liées à la taille du viewport et autres. ❤

Vidéo extrêmement intéressante et riche, merci beaucoup

Ayoye! Méchante vidéo! Je partage ça à mes collègues étudiants! Merci pour tes opinions pertinentes!

7:14 tu m’as eu 🤣 très bonne vidéo !

Je connaissais déjà pas mal le sujet, mais l'affichage des breakpoints "visuels" dans chrome j'avais pas !!!! trop bien merci

Je regarde seulement la vidéo, elle est super intéressante pour tous mais personnellement étant débutant je l’ai beaucoup apprécié. J’en redemande ! 👍

Merci pour ta sueur, ton sacrifice ne sera point vain. Let's go pour la vidéo sur la fluidité

Ouiii une vidéo sur le fluid design, j'aimerai bien voir ce que ça donne techniquement, ça à l'air un peu angoissant aussi

Super ta vidéo avec toujours cette pointe d'humour ! Je suis chaud pour la fluidité !

Merci, super vidéo et très intéressant la partie sur le mobile first, j'en avais déjà entendu parler mais sans savoir pourquoi c'était la bonne manière de faire. 💪💪👍

Salut benjamin, Toujours aussi instructives tes vidéos 😊 Ça serait vraiment sympa une vidéo sur la fluidité dans les sites web 😊 stp

J'ai encore appris de toi. Thanks

Hello, je suis UI Designer et du coup c'est très plaisant de voir quelqu'un qui prend vraiment en compte les idées qu'on a eu, dans ta partie Fluid Design, souvent je me retrouve à batailler avec les dev pour avoir quelque chose qui ressemblait à ma maquette de base, même si je sais que toutes les idées ne sont pas simples à réaliser. Le coup du menu ça arrive souvent mais je t'avoue que moi même je ne remarque pas étant donné que je ne m'amuse pas à passer entre chaque breakpoint, si le site est joli et utilisable ça me convient. Mais c'est un vrai plus ce que tu soulèves et j'essayerais de m'en rappeler.

Super vidéo! On attends la vidéo sur la fluidité

Dev front depuis plus de 10 ans, j'ai bien apprécié ta vidéo. J'appelle également mes intés "fluides" ;)

Mec je fais mon premier site avec nodejs. J suis dev webdev de base (oui je sais) et grace a tes vidéos je prends les bonnes habitudes. J ai commencé mon site avec bootstrap, bim je suis finalement pur css (less css) Et maintenant je refais pes style en mobile first. Merci tes vidéos sont de l or

Ouiiii pour la fluidité, oui oui et encore ouiiiiiiiiiiii :)

Super vidéo! Flexbox est vraiment à bien maîtriser de nos jours!

Je te lefeleuh savoir que je veux une vidéo sur la fluidité ! Coeur sur toi ❤

Je donnerais tout absolument tout pour une video sur la fluidité benjamin code.

Super video. Vas y j'attends direct la prochaine video sur la fluidité

Très très intéressant, ça a clarifié pas mal e choses pour moi qui suit plutôt dev back !

Je plussoie tous ces précieux conseils Benjamin, je rajouterai qu'il ne faut pas se bloquer dans ''mobile first'' ou ''desktop first'' mais que celà dépend du besoin... Une app tournée ''utilitaire'' pour une boite etc -> desk first car ca va être très majoritairement consulté sur ordi, pareil pour une ADMIN par exemple... Merci pour cette vidéo intéressante qui permet de conforter nous points de vue de devs 😉

Hello ! Je trouve que le concept de fluid design fait vraiment la différence entre un site classique et un bon site. Ce serait vachement cool que tu nous en parles dans une vidéo !

Très intéressant, merci !

@davidmace1856

2 жыл бұрын

C'est dit avec quel voix ?

@BenjaminCode

2 жыл бұрын

😂

Miaou

Let’s go la fluidité

oui une vidéo sur la fluidité stp... la qualité des informations de tes vidéos, c'est top🙌🥺

Très bonne vidéo et oui j'aimerais bien une vidéo sur la fluidité !

J'avoue que je me foutais pas mal du mobile first...je me suis totalement retrouvé quand tu parlais d'overwrite un tas de propriétés😅😅, et c'est parfois la galère de devoir inspecter la page pour détecter les margins et autres pour combattre le Scroll... En tout cas merci pour cette vidéo, maintenant c'est du mobile first😎

Merci pour cette vidéo ! c'est quali' comme d'habitude. Point important tout de même : peut-être connais-tu déjà every-layout, c'est un ebook super sympa (en anglais) pour travailler de façon fluide en pure CSS, ce sans utiliser de media queries. Aussi, j'ai remarqué que tu utilise margin-bottom/top etc., pour que ton site soit adapté au sens de lecture RTL sans toucher ton CSS, les propriétés margin-end, margin-start et consorts sont vraiment sympas à utiliser.

meuleumeuleu

Oui, je veux bien une vidéo sur le fluid 😉👍👌

Oui une vidéo sur la fluidité stp :)

tu mérite meme un 2eme pouce bleu

Gg pour la musique de Godevain le vilain, et Tailwind CSS magnifique :)

l'intro est légendaire 🤣🤣

Pour la communication designer/dev concernant les sizes et autres espaces, j'ai imposé à mon équipe de product designer via notre design system une nomenclature. Exemple, les espaces fonctionnent par nom "space XS" "space S" space M" etc... et pour chaque space on à des valeurs correspondante suivant des breakpoints. (exemple : Space L = 32px sur un breakpoint 1440 et au delà, mais sur un breakpoint de 375 il sera de 24px... Les sizes intermédiaires se calculent seule ensuite.

J'y avais jamais pensé !!! 🤪 Mobile first, first tip ever front. Je ne suis pas juste "front" mais j'y penserai quand j'en ferais de nouveau 👍 Thank you SO much !

oui stp une vidéo sur la fluidité ca serait insane

Super vidéo, ce sérait vraiment cool une vidéo sur la fluidité. Je débute alors ça m'intéresse énormément

fluidité fluidité fluidité, oui oui oui on veut.

Video sur la fluidité top! on l'attends! Ciao de l'Italie

J'ai pas encore regardé la vidéo mais la miniature me fait tellement rire 😂🤣🤣

La fluidité c'est OUI

Let’s go sur la vidéo de la fluidité

Hey Ben ca fait un moment que je ne suis pas venu commenter une video. Comme d'hab merci pour cette dernière et tu as raison de souligner tous ces points, merci aussi pour ton sacrifice parceque tu as souffert de la chaleur ;) Alors mais carrément une video sur la fluidité ca pourrait être top stp. En fait j'ai peut être manqué un épisode, mais ton clavier meca tu en penses quoi? En dehors du fait que tu n'es pas habituer au qwerty, mais ca va venir :p

✨

Ça serait cool la vidéo sur la fluidité ! Merci à toiiii

Benjamin : Cette vidéo me coûte.... Moi, un intellect : Pouce Bleu pour te rafraichir.

Tailwing, bootstrap ou comment violer les principes même du CSS aussi violement qu'en utilisant des balises style dans l'HTML. J'ai vraiment des haut le cœur quand je vois des trucs genre 5:37 Honnêtement maitriser les flexboxes et les media queries et surtout les appliquer dès le début, c'est pas si compliqué. J'ai hâte que les containers queries arrivent pour faire des choses encore plus folles.

Merci pour cet aparthé latin, tu gères. Interessé par ta fluidité.

Super video. En vrai, tous les créas avec qui j'ai bossé sont soit à la ramasse, soit ne prennent pas le temps de bien penser le responsive... Du coup en temps que dev comme tu le dis, c'est à nous d'anticiper. Je crois que c'est ça qui stress les devs aussi. Sans parler des safe-area sur mobile...

Le "fluide design" me parait tellement plus naturel et j'ai toujours trouvé ça hyper frustrant les breakpoints. On tends quand même à avoir de plus en plus de facilité à mettre ça en place, avec les flexbox notamment. Pour moi ça devrait être la norme pour finalement remplacer totalement les breakpoints afin de s'adapter à 100% des devices. Donc très chaud pour une vidéo la dessus !

J'adore vous ecouter Mr Benjamin Code

Par ce commentaire je te fais savoir qu'une vidéo sur la fluidité (F. L. uidité) m'interesse !! Merci pour tes vidéo t'as chaine est une mine d'or pour les débutant !!!

👌

Si c'est l'ouverture des demandes, je vais en faire une sur d'autres points : la gestion des user stories en front. Tu ne bosses que sur maquette ou bien il y a des demandes spécifiques ? Deuxième demande : tu as dit que l'intégration, c'était pas la majeure partie du dev front mais qu'il fallait aussi faire attention à l'opti, etc. Tu pourrai faire une vidéo là dessus ? C'est super intéressant mais on trouve souvent que des trucs "visuels" sur les chaines YT de code, car plus impressionnant. Merci bien :)

C'est une bonne vid mais dommage que ta pas parler du media query hover en CSS ca pourra en aider plus un pour un design (responsive/adaptative)

Super vidéo merci Benjamin, pour ma part j'ai juste appris tailwind pour échapper au responsive..

Hello, je trouve que tes explications sont très clair ! Je ne comprendrai jamais pourquoi des gens pour gagner du temps qui perdront par la suite, réduisent la qualité de leurs codes pour implanter du bootstrap. Ce même import que je trouve horrible et que le CSS pur est beaucoup mieux et plus flexible ! Après tu m'auras appris le Mobile-First car j'ai toujours dev Desktop-First ... Pour les breakpoint j'ai toujours mis des transitions simple pour ne pas perdre en fluidité ! Voilà continue je kiff ton travail !

@AymericIngargiola

2 жыл бұрын

Tu peux importer que "grid" de bootstrap et pas tout bootstrap, la grid est bien foutue de base pas besoin de refaire à la main avec ses variables, et si tu fais du sass les mixins sont déjà présentes et très simple à utiliser. J'utilise uniquement bootstrap pour ça et non pour les composants, très simple à surcharger également en sass si on veut changer des variables. Sans ça, à termes tu refais tes règles, mixins, variables, media queries... et donc ça revient au même

Je suis dev back et la plupart du temps sans dev front sur le projet. Difficile de savoir pour la fluidité par exemple, le designer devrait également le souligner puisqu'on n'a pas forcément l'habitude de travailler de la même manière. Après aujourd'hui il y a de bons outils comme Figma (coucou BastiUI) et je pense que ça doit bien aider aussi à comprendre la vision du designer.

Une video dédiée a la fluidité je dis oui ca peut grave m'apprendre , ou encore même d'en faire un live ou tu interagis avec les viewers :D

Oh ce joli petit clavier 😏

merci pour tes vids ;) en tant que dev en devenir tes vidéos sont vraiment sympa et ..... je suis obligé d'utiliser bootstrap ah ah ah 🤣😭😭😭😭😭 ça reste une bonne écolé mais c'est relou