Les erreurs de débutant avec SASS/SCSS
HTML-код
- Опубликовано: 12 окт 2020
- 🎓 Tous mes cours sur l'École du Web (pour les obtenir tous d'un coup) : www.ecole-du-web.net/
📚 Tous mes cours sur UDEMY : liste-des-cours.com/
🚀 1 Cours gratuit en t'abonnant à ma newsletter :
www.le-designer-du-web.com/news
Le lien du Discord : / discord
Ma chaine en Anglais :
/ @thewebschool
Je suis aussi sur la plateforme Tuto.com :
fr.tuto.com/formateur/enzo_us...
🎓 Tous mes cours sur l'École du Web (pour les obtenir tous d'un coup) : www.ecole-du-web.net/
📚 Tous mes cours sur UDEMY : liste-des-cours.com/
Steve Jobs et son col roulé vous montre les erreurs classiques avec SASS !
🤣🤣 merci steve junior
SJ en mode BG ^_^.. Merci pour ces bonnes pratiques sensei.. Feras-tu une demo de Susy pour le responsive ?
Très intéressant. Je vais approfondir mes connaissances sur ce sujet car j'avais déjà entendu parler mais je n'y connais rien. Merci pour cette vidéo
Tu m'as tué sur le navy x)
Cool ça tombe bien, je me suis déjà planté deux trois fois dans les indentations. Merci
Clair et concis, merci pour cette vidéo !
Super intéressant et condensé !
Par contre lors des imports si ça n'a pas changé il n'y a pas besoin de rappeler l'underscore !
Merci pour ces bons conseils ! J'utilisais trop les mixins sans paramètres, c'est bien plus clair pour moi désormais !
Une partie @media pour le responsive et les erreurs à ne pas faire à ce sujet aurait aussi été la bienvenue....
Merci beaucoup, je n'utilisais pas les placeholders, j'utilise tout le temps les mixims, erreurs de débutant.
C'est carré !
Génial !
Merci Enzo
Impeccable ! ça tombe bien justement je suis en train de suivre ton cours que j'ai acheté sur Udemy , excepté un petit détail qui a son importance ... On a du mal à voir ce que tu as écrit dans l'invite de commandes ( sur cette vidéo youtube ) car on te voit dessus surtout que j'ai du mal avec cet outil pour me déplacer dans les fichiers ou voir où je suis exetera ... , sinon merci encore Enzo ;) à ce propos , justement ce serait cool que tu fasses un cours sur l'invite de commandes ;)
'sass --watch scss/style.scss styles/style.css'
Fichier de départ -> Fichier d'arrivée (compilé) ;)
@@EcoleduWeb Super ! Merci Enzo :)
Merci beaucoup
Merci 👍
Yep, un grand merci à toi Enzo ; en attendant de préparer le titre pro. via une alternance l'an prochain, je prépare le terrain depuis un moment en ayant chopé des cours sur Udemy, dont 2 à toi ; Du coup, je pratique particulièrement avec les 20 projets avec JS où je profite pour m'y ajouter sur le stack Webpack, Babel, SASS, histoire de mieux les redécouvrir ; Bref, vraiment top de trouver des compléments de conseils ici aussi ; alors sincèrement merci à toi pour la limpidité de tes cours sur Udemy et de tes tutos supplémentaires partagés sur YT ✌
Merci pour ton soutien Alice!
J’aimerais trop que tu fasse une vidéo sur webpack !
Super vidéo, ses vrai que sass n'est pas si facile que ça, il vient avec beaucoup d'outils de compilation, et beaucoup d'autre fonctionnalité ce qui fait que de un s'est un système plutôt lourd ( ça dépends de la config ). mais pour moi Sass il faut l'utiliser si on a un "GROS" projets car le "DRY" seras beaucoup plus présent, et certaine fonctionnalité peuvent être très utile dans le cadre d'un gros projet ( tout est fait pour faciliter le dev ). Bien mais que dans les gros projets, pour le petit projets je n'en vois pas l'interêt ( ce seras plus une perte de temps que autre chose ) Sinon le reste est top ! au niveau des fonction des boucles, on peut facilement faire un système de grid similaire a Twitter Bootstrap en quelque minute grâce au fonction intégré !
En effet, très bon commentaire, j'acquiesce sur tous les points :)
bonjour Le Designer du Web
Pourrais tu mettre en place une vidéo pour créer un site vitrine (un site où on peux acheter des produits digitaux) avec un système par carte déroulante (a double face ( face une l'image avec le nom du produit et sa petite description en dessous puis en dessous à droite son prix et a gauche un bouton pour aller sur la face arrière) face deux (arrière) une grande description avec en dessous un bouton de direction vers la page de vente qui s'ouvre dans un nouvel onglet) le tout compatible sur tout écrans et au dessus du menu sur la page index un système de diaporama ou l'on vois tout les produits en image.... bien sur le tout en HTML, CSS, SCSS et JS si possible
Moi j'utilise Notepad++ pour coder car mon PC peux prendre que cela ...
Si tu pourrai faire cela pour moi sa serait vraiment cool...
P.S. : au plaisir de te revoir sur vidéo car tu explique très bien et sa m'apprends beaucoup.
Bonjour, je crois savoir que ce que tu appelles les placeholders sont en fait l’héritage non? On ne peut pas faire d’imbrication quand on utilise @extend si? Ce que j’appelle imbrication je crois que tu appelles ça nesting. Super vidéo en tout cas, c’est intéressant d’avoir plusieurs formateurs on voit les choses de plusieurs façons.
salut super tuto comme d hab j'ai une petite question mon scss ne compile pas et mes modifs sont pas pris en compte par le navigateur
bonjour je viens de commencer à voir quelques une de vos vidéos j'effectue un projet en sass et voulais savoir est-ce possible d'avoir un tuto sass concernant comment relier et linker plusieurs pages.Avoir le meme header sur toute mes pages ou un footer et des buttons par exemple pour éviter de faire plusieurs feuilles de styles pour chaque page de mon projet. merci d'avance.
Bonjour, actuellement en formation dev junior chez OpenClassrooms j’ai vu SASS il y a un petit moment déjà. Au moment de l’apprentissage on nous conseillait de systématiquement mettre en place le pattern 7-1. Ceci quitte à avoir des dossiers vides (certains projets n’étant pas très étoffés, des sections comme « vendors » restent bien évidemment vides). Un avis sur cette méthode ?
Ps: je t’ai découvert il y a peu et je dois bien l’avouer, j’ai tout de suite accroché ! Félicitations pour ton contenu toujours très pédagogique, continu comme ça !
Pour apprendre aux élèves à séparer son code dans différents dossiers c’est une bonne idée, mais dès qu’on l’a compris c’est inutile et contre intuitif de créer des dossiers qui vont rester vides ;)
On est d’accord, c’est bien ce que je pensais. Merci de ta réponse :)
Bonjour dans la formation que j’ai faite on crée le fichier _ partial mais dans le fichier style.scss on import comme ça @import « nom partial »; sans mettre le _ devant . Dommage aussi qu’à 4:03 il y ait ton retour vidéo en bas à droite du coup on ne voit pas ce que tu tapes. As tu écrit sass -watch scss/style.scss to styles/style.css ?
Bonjour, je crois savoir que ce que tu appelles les placeholders sont en fait l’héritage non? On ne peut pas faire d’imbrication quand on utilise @extend si? Ce que j’appelle imbrication je crois que tu appelles ça nesting.
Petit détail, il ne faut plus utiliser @import dans Sass mais @use. Ceci vient de la doc officielle de Sass :
« The Sass team discourages the continued use of the @import rule. Sass will gradually phase it out over the next few years, and eventually remove it from the language entirely. Prefer the @use rule instead. (Note that only Dart Sass currently supports @use. Users of other implementations must use the @import rule instead.) »
Merci, Comment l'installer svp j'ai essaye avec les lignes de commande ca n'a pas marche
Pour cette erreur ce n'est pas de mon ressort, elle arrive à beaucoup de monde, c'est de leur côté ...
Tu peux néanmoins tenter de désinstaller reinstaller node, ça aide parfois
@@EcoleduWeb Ok merci Enzo, je vais me lancer dans l'apprentissage de react js egalement
Je te rejoins sur le nesting, utiliser juste pour imbriquer des balises ne sert quasiment à rien, pour moi ça vrai pertinence c'est si on le couple a la méthodologie BEM.
C'est clair !
zut j'utilise `less` dommage !
C'est exactement la même chose ;)
J'ai un souci lors de l'installation des fichiers sass sur mon ordi aidez moi svp...J'aimerais bien suivre ce tuto
si tu utilise visual studio code tu peux installer lextensoin sass live compiler et tu clique sur watch sass
@@Hugo-sj2vm Merci👍