Te juro que não entendi muito bem "Metodologia BEM" no curso que estou fazendo, mas com sua didática ficou muito mais inteligível. Então é certeza que se eu não entender alguma coisa de CSS bastar vir no seu canal que vou aprender na integra. Muito obrigado! 🙂
Jamau, muito obrigado MESMO por seu comentário. Fico satisfeito ao ler mensagens assim. :) Também temos um curso que aborda BEM e diversas outras metodologias e boas práticas de CSS. Vamos abrir uma nova turma em breve, se estiver interessado, só cadastrar seu e-mail para ser avisado: www.cssalemdosensocomum.com.br/
Estou começando a aprender sobre desenvolvimento Web, mas sei a importância de ter um código bem escrito, por isso já estou aqui procurando sobre o que é BEM pra desde já começar usar em meus exercícios rsrs
Depois que aprendi name space, BEM e SMACCS (no seus cursos), me da uma p*ta aflição ver um tutorial que vão colocando nomes aleatórios em classes hahahahaha
aprender a visualizar os blocks na imagem antes de codar, é bem interessante. Nos ajuda a aninhar pais e filho, ou divs dentro de divs. Faz sim esse conteúdo, vai me esclarecer muito. Parabéns pelo belíssimo trabalho! Tem nos edificado muito.
Desde que conheci eu uso essa metodologia bem no meu sass.Acho que tem que ter um bom senso e pensar no bloco como um todo desse jeito você usará bem menos classes 👏.
No 1:30 +/- vc comenta de fazer análise de layouts (um vídeo só sobre isso). Sei que no fim do vídeo vc fez uma análise, mas como inciante em web, ainda me perco em como nomear de forma eficiente. Seria legal fazer um vídeo: be-a-bá do BEM (pegar alguns layouts de sites e sugerir como nomear os elementos). Não precisaria nem escrever código, uma escrita a mão em cima do layout já ajudaria muito, pra fazer uns 3 diferentes como prática).
@@dpwoficial obrigado pela resposta, acho que entendi. É que como o botão estava dentro do card, eu imaginava que ele também precisaria receber a classe card. Posso ter entendido errado, mas eu li em algum lugar que um elemento pode receber classes como block e também como elemento, mas não sei se é errado fazer isso, por exemplo: "card__posts posts"
@@Souumzumbi Não há problema algum em usar um componente dentro de outro, pelo contrário, é até algo bastante comum de ser feito. É chamado de composição de componentes. Componentes "menores" sendo usados juntos para fazer um componente mais complexo.
uma coisa que melhorou muito meus projetos: antes eu tinha medo de renomear uma classe e ela estiver sendo usada em outra parte do projeto, não sabia se ela estava sendo usada por algum js, etc Hoje, como crio os layouts baseados em componentes, sei que posso renomear, pois aquela classe só está sendo usada naquele componente. E se não tiver o namespace "js", também sei que não vai bugar nenhum script
Já viu o sonarqube, que é possível configurar o ide pegando as rules do servidor, análise código durante a escrita ? Só que não encontrei para css aplicando o BEM😅
Muito legal o vídeo! Tenho uma dúvida: essa convenção tem algum conflito com a estrutura SASS, levando em conta que esse ultimo tem um padrão hierárquico? Obrigado!
Sempre busquei deixar o HTML o mais limpo possível e o BEM é terrível nesse sentido, acabei optando por usar o RSCSS nos meus projetos, mas entendo que depende do time chegar a uma definição pra que todos entendam e façam da mesma forma.
Eu também acho rscss legal, concordo com muitas coisas dele; gosto especialmente da sintaxe de Variantes (que eu acho que BEM deveria se inspirar, aliás). O que você disse está certíssimo: depende do time chegar a uma definição. Mas uma coisa que conta é: adoção da comunidade. No mundo real, qual a probabilidade maior ao encontrar/entrar em um projeto, BEM ou rscss?
@@dpwoficial sim, igualmente para quem usa stylus ou less sendo que a comunidade em sua maioria usa sass... complicado, o jeito é tentar se inteirar da forma mais ampla possível pra se adaptar a qualquer time. Abraço e parabéns pelo conteúdo!
Olá me desculpa fazer está pergunta mais como poço saber se um item e elemento ou bloco exemplo eu tenho uma div container dentro dela tem um li e dentro do li tem um a com href
Depois de muito tempo parado, voltei a estudar CSS, e obviamente a metodologia BEM. A minha duvida fica em outro quesito. Por que tantas pessoas utilizam a font-size rem se a recomendação do W3C é utilizar o em?
@@dpwoficial No w3c em font-size diz que em font-size estático usa-se px, e variavel em. O W3c não cita o rem como referencia. Pelo menos eu não achei isso. No canal curso em video, que é uma referencia em tecnologia, também é citada esta informação. Posso mandar o link se precisar. Acho um pouco estranho tanta gente utilizar o rem.
Basicamente, no vim (ou emuladores) a ideia é usar o menos possível o mouse; fazer tudo só com o teclado. Aí pode ver que ele começa da linha atual a contagem para cima e para baixo, né? Daí se eu quiser mover o cursor X linhas para cima, uso `X+k`; se quiser mover Y linhas para baixo, `Y+j`. É meio doido no começo, mas depois que acostuma, não tem coisa melhor. xD
Tenho uma dúvida, é correto usar os elementos no BEM? Tipo: .about img .about__item img Ou correto seria: .about .about__image .about__item .about__image
Muito legal, BEM é a metodologia que mais me identifiquei. Mas tipo, eu uso o fw Bulma pra quase tudo, mas o Bulma não usa o BEM. A minha dúvida é se é uma boa prática usar o BEM nesse caso?
Vai depender do que for convencionado, mas nada impede de serem usados em conjunto. Inclusive, as classes BEM servem muito bem para diferenciar o que é código específico do projeto e o que é do framework.
Por exemplo em uma view de listagem de posts estaria correto utilizar blog__header e blog__body? E para o post ( componente vue separado) post__title, post__content, etc
"blog__header" e "blog__body" seriam Elementos (filhos) de "blog". Não sei se é o melhor caminho para uma listagem de posts -- dependendo, pode ser; é que não conheço a estrutura mesmo. Quanto a "post__title", "post__content" etc., tá legal sim.
Oi, Luis. Tudo bom? Pode usar no Sass que você vai ver como é tranquilo. Dá uma olhada na desc do vídeo o artigo no blog que mostra como usar no Sass. Você vai gostar. Ah, e anotada a ideia de abordarmos o Pug. :)
@@dpwoficial sim, eu to aprendendo sass ainda, to lendo a documentação, ele facilita tudo msm, inclusive so comecei a usar por causa do seu video sobre
Topppp. Like. Ei, sei que não é o foco do canal, mas se não puder fazer um video sobre isso, me tira essa dúvida no comentário pf. Eu queria saber como seria feito a autenticação do usuário na hora de acessar as rotas privadas do frontend. Tipo, eu vi um post em um blog que ele só verifica se o localStorage o token é diferente de nulo. Mas isso é uma falha grave, pois se setar qualquer token, poderá ser visto o conteúdo daquela rota (mesmo que não possa editar ou mandar dados, já que pra isso, vai dar token inválido no backend)
Oi, Obito. Obrigado por comentar. Realmente, este é um tópico bem amplo. Mas, adiantando, existem diversas maneiras de se fazer isso, a depender da tecnologia de back que você está usando. Acredito que este código que você está comentando vou somente um exemplo, pois é realmente bem fraquinho em cenários do mundo real.
No BEM, a gente só usa o modificador para mapear a estilização que a gente quer dar no CSS? O que eu quero dizer é que, se apenas tiver o modificador, nada acontece. É uma marcação, certo?
Não entendi direito sua pergunta... Mas um Modificador, como indica o próprio nome, modifica um Bloco ou Elemento, alterando algumas de suas características. Por exemplo, você fez um componente de botão, aí precisa que, em alguns casos, ele seja de um tamanho diferente dos demais, aí você cria um Modificador.
Não precisa do `&` puro para aquelas definições, coloca direto; para Elementos e Modificadores, aí sim com com `&__el` e `&---mod`. Dá uma olhada na descrição do vídeo que tem link para nosso artigo com exemplos de BEM com Sass. 👍
como ficaria esse conceito em um menu? contendo... (.menu ul li a) pra mim sinto dificuldades de aplicar quando se tem varios elementos desse jeito. poderia me explicar de uma melhor forma?
Em 13:52 mostramos um exemplo de uma lista com BEM que é parecido com o que poderia ser feito em um menu (simples). A ideia é usar nomes que sejam descritivos e permitam identificar cada elemento dentro da estrutura (sem, necessariamente, repetir toda a hierarquia HTML).
Opa, uma dúvida, eu costumo utilizar o bem, como nesse modelo "btn btn__size --large btn__shape --round", estaria incoerente ou poderia ser aplicado dessa forma também?
Só imagino a cara do povo do HTML q teve o trabalho de criar a semântica do elemento pra galera ficar colocando class="btn" ¬¬ Qual a necessidade, meu povo? PORQUE gzuis?
Desculpem a sinceridade, mas considero o método absurdamente improdutivo, desnecessário e... bom, deixa a manutenção do sistema centenas de vezes pior, engessa tudo, um caos em sistemas grandes, com grandes equipes, um tiro que sai pela culatra. Vão de Styled components, que já evita name clashes, permitem compound components e lógica na estilização, e pronto galera - muito mais flexível, fácil e poderoso... lembrem: keep it simple!!
@@dpwoficial Se puder conferir: th-cam.com/video/8EUsRcfye_8/w-d-xo.html E: th-cam.com/video/QdfjWRc4ySA/w-d-xo.html Bom... to avisando mais por camaradagem mesmo, pro pessoal não se iludir com BEM. Mas tranquilo, esse tipo de discussão sempre acontece, opiniões divergen.
⭐ Interessado por convenções, nomenclatura, boas práticas e arquitetura CSS?
mailchi.mp/e40fa97b13dd/cssasc-t1
⭐ Download GRÁTIS do e-book "Os 3 Conceitos Fundamentais de CSS"
mailchi.mp/500e81011405/3-conceitos-css
Te juro que não entendi muito bem "Metodologia BEM" no curso que estou fazendo, mas com sua didática ficou muito mais inteligível. Então é certeza que se eu não entender alguma coisa de CSS bastar vir no seu canal que vou aprender na integra. Muito obrigado! 🙂
Jamau, muito obrigado MESMO por seu comentário. Fico satisfeito ao ler mensagens assim. :)
Também temos um curso que aborda BEM e diversas outras metodologias e boas práticas de CSS.
Vamos abrir uma nova turma em breve, se estiver interessado, só cadastrar seu e-mail para ser avisado: www.cssalemdosensocomum.com.br/
Estou começando a aprender sobre desenvolvimento Web, mas sei a importância de ter um código bem escrito, por isso já estou aqui procurando sobre o que é BEM pra desde já começar usar em meus exercícios rsrs
Vai começar com o pé direito.
To aprendendo desenvolvimento Web e tava precisando desse vídeo. Toooop demais
vlwww
Muito bom o vídeo. Foi o vídeo que mais deixou claro o assunto
Que bom, Vinícius. O CSS vai para outro nível com BEM.
Aliás, abordamos com mais detalhes em nosso curso: www.cssalemdosensocomum.com.br/
entrei, dei like, depois eu volto pra assistir
hahaha, quando voltar, dá outro like! ;)
BEM + Sass Melhor combinação
De acordo.
Ah cara, sorte eu dei de encontrar esse canal. Primeiro que eu ativei o sino. Obrigado pelo seu trabalho, dpw. Estou aprendendo bastante.
o ho ho! Muito obrigado, man!
Se quiser dar aquela força extra indicando o canal nos seus grupos e redes sociais, aí te agradeço por demais.
Parabens pelo vídeo
Vlw, Kelvin!
Rapaz, achei interessante, vou aderir 😅
Vale a pena.
Cara, excelente conteúdo, muito obrigado pela aula.
Imagina. Tamos aê.
Até que enfim uma explicação decente que me fez entender como utilizar o BEM ... super obrigado :)
Que bom que o vídeo ajudou BEM.
Obrigada!!!
Disponha!
Obrigado. Muito boa sua explicação do tema.
Disponha!
Depois que aprendi name space, BEM e SMACCS (no seus cursos), me da uma p*ta aflição ver um tutorial que vão colocando nomes aleatórios em classes hahahahaha
hahaha, uma vez que você vê as boas práticas, é impossível "desver". =P
Que curso você se refere? Sou novo no canal.
Procura por "CSS: um passo adiante".
@@dpwoficial ola não estou encontrado seu curso na udemy, foi removido?
@@gleisonsubzeroKZ Sim. Ele não consta mais no catálogo da Udemy; desculpe.
Muito bem explicado, gostei muito da metodologia e com certeza aplicarei em meus projetos.
Muito obrigado por compartilhar conhecimento de qualidade!
Eu que agradeço pelas palavras. :)
Já tinha visto outros videos, mas o teu foi o melhor por esclarecer a questão da flexibilidade da metodologia. Ganhou um escrito, irmão!
Muito obrigado, Lucas!
Com certeza não vai se arrepender da inscrição. ;)
aprender a visualizar os blocks na imagem antes de codar, é bem interessante. Nos ajuda a aninhar pais e filho, ou divs dentro de divs. Faz sim esse conteúdo, vai me esclarecer muito. Parabéns pelo belíssimo trabalho! Tem nos edificado muito.
Já está feito, Marlon. :)
th-cam.com/video/aUe-YXUJVgk/w-d-xo.html
Prossiga com os vídeos sobre BEM, gosto bastante da sua didática e dos seus vídeos. Top! ... Ahh... Faz sobre o ITCSS com o BEM se é que é possível.
Vlw, Chrystian! ITCSS é um tema muito legal, também. Com certeza vamos abordar em algum momento.
Desde que conheci eu uso essa metodologia bem no meu sass.Acho que tem que ter um bom senso e pensar no bloco como um todo desse jeito você usará bem menos classes 👏.
E faz muito BEM de usar! ;)
Não é a toa que ela é uma das metodologias de CSS mais usadas no mundo.
Faça um bem pra você mesmo, use bem!
BEM falado. :)
Q vídeoooo Massaaaa hehe
Vídeo BEM massa. 🙃
Vídeo BEM informativo.
🙃
Que explicação sensacional, sem palavras!
Muito obrigado!
Faz o vídeo de análise!! Eu vim justamente procurar vídeo disso, mas ainda não achei nenhum :(
Que análise?
No 1:30 +/- vc comenta de fazer análise de layouts (um vídeo só sobre isso). Sei que no fim do vídeo vc fez uma análise, mas como inciante em web, ainda me perco em como nomear de forma eficiente. Seria legal fazer um vídeo: be-a-bá do BEM (pegar alguns layouts de sites e sugerir como nomear os elementos). Não precisaria nem escrever código, uma escrita a mão em cima do layout já ajudaria muito, pra fazer uns 3 diferentes como prática).
@@lorenapn Ahh, legal. Boa ideia. Vou colocar na lista aqui. 👍
muito bem explicado! mais um inscrito!
Opa, aí sim, Helton! o/
achei que era BEM de Bonito, Elegante e Majestoso
haha Pode ser também! :)
Devagar e bem explicado, vlw pelo vídeo cara.
Eu que agradeço pelo comment. :)
No exemplo dado aos 13:30, seria errado utilizar no button a classe card__btn?
Se o botão fizesse parte, exclusivamente, do card, não; no exemplo, o botão era um outro componente.
@@dpwoficial obrigado pela resposta, acho que entendi. É que como o botão estava dentro do card, eu imaginava que ele também precisaria receber a classe card. Posso ter entendido errado, mas eu li em algum lugar que um elemento pode receber classes como block e também como elemento, mas não sei se é errado fazer isso, por exemplo: "card__posts posts"
@@Souumzumbi Não há problema algum em usar um componente dentro de outro, pelo contrário, é até algo bastante comum de ser feito.
É chamado de composição de componentes. Componentes "menores" sendo usados juntos para fazer um componente mais complexo.
melhor canal
haha Obrigado pela consideração. Ainda chegamos lá. o/
Excelente vídeo, estou estudando a apostila Caelum da Alura e me deparei com o conteúdo sobre BEMCSS. Seu vídeo foi muito esclarecedor, obrigado!
Bom saber, Adryan. Abs
Show. Quero me aprofundar nessas metodologias.
Boa, Luís. Vai ver que isso vai te ajudar muito e seu código vai ficar BEM melhor. :)
uma coisa que melhorou muito meus projetos: antes eu tinha medo de renomear uma classe e ela estiver sendo usada em outra parte do projeto, não sabia se ela estava sendo usada por algum js, etc
Hoje, como crio os layouts baseados em componentes, sei que posso renomear, pois aquela classe só está sendo usada naquele componente. E se não tiver o namespace "js", também sei que não vai bugar nenhum script
Esse namespace js- salva vidas, cara... O cara que inventou isso merece um prêmio!
Já viu o sonarqube, que é possível configurar o ide pegando as rules do servidor, análise código durante a escrita ? Só que não encontrei para css aplicando o BEM😅
Nunca nem ouvi falar. '-'
Muito legal o vídeo!
Tenho uma dúvida: essa convenção tem algum conflito com a estrutura SASS, levando em conta que esse ultimo tem um padrão hierárquico?
Obrigado!
Zero conflitos. Pelo contrário: usando parent selector de Sass para gerar BEM é bastante limpo e eficiente. :)
Parabéns pelo vídeo, não conhecia, achei muito interessante , vou começar a usar.
Obrigado, Paulo.
Faz BEM em começar a usar. Com certeza vai ajudar a melhorar seu código. :)
Muito bom! parabens!
vlw, Igor!
Muito bom
vlw
Sempre busquei deixar o HTML o mais limpo possível e o BEM é terrível nesse sentido, acabei optando por usar o RSCSS nos meus projetos, mas entendo que depende do time chegar a uma definição pra que todos entendam e façam da mesma forma.
Eu também acho rscss legal, concordo com muitas coisas dele; gosto especialmente da sintaxe de Variantes (que eu acho que BEM deveria se inspirar, aliás).
O que você disse está certíssimo: depende do time chegar a uma definição.
Mas uma coisa que conta é: adoção da comunidade. No mundo real, qual a probabilidade maior ao encontrar/entrar em um projeto, BEM ou rscss?
@@dpwoficial sim, igualmente para quem usa stylus ou less sendo que a comunidade em sua maioria usa sass... complicado, o jeito é tentar se inteirar da forma mais ampla possível pra se adaptar a qualquer time.
Abraço e parabéns pelo conteúdo!
Exatamente isso.
Muito obrigado pela participação, Daniel. Apareça. :)
Olá me desculpa fazer está pergunta mais como poço saber se um item e elemento ou bloco exemplo eu tenho uma div container dentro dela tem um li e dentro do li tem um a com href
Não entendi direito. Qual seria a estrutura?
Depois de muito tempo parado, voltei a estudar CSS, e obviamente a metodologia BEM. A minha duvida fica em outro quesito. Por que tantas pessoas utilizam a font-size rem se a recomendação do W3C é utilizar o em?
Onde consta que a recomendação do W3C é utilizar "em"?
@@dpwoficial No w3c em font-size diz que em font-size estático usa-se px, e variavel em. O W3c não cita o rem como referencia. Pelo menos eu não achei isso. No canal curso em video, que é uma referencia em tecnologia, também é citada esta informação. Posso mandar o link se precisar. Acho um pouco estranho tanta gente utilizar o rem.
@@anarktv8098 Opa, pode enviar o link?
Voltei a usar BEM por conta desse canal TOP!!! Esperando vídeo sobre greensock
Aposto que seu código ficou BEM melhor! xD
Olha... Greensock é um bom tema, mesmo! ;)
Ficou muito top o vídeo!
Muito obrigado, Eduardo! o/
Em que situação é útil o número da linha do seu vscode começar a contagem da linha atual?
haha, para quem usa vim (ou emulador de vim) isso é útil pra caramba. ;)
@@dpwoficial pq? haha
Basicamente, no vim (ou emuladores) a ideia é usar o menos possível o mouse; fazer tudo só com o teclado.
Aí pode ver que ele começa da linha atual a contagem para cima e para baixo, né? Daí se eu quiser mover o cursor X linhas para cima, uso `X+k`; se quiser mover Y linhas para baixo, `Y+j`.
É meio doido no começo, mas depois que acostuma, não tem coisa melhor. xD
@@dpwoficial hummmmmmmm que trampo haha
😜
a metodologia BEM é mais pra nome de class? mas tp seria uma boa ideia usar bem e a cascata default do css ?
Sim, é mais para nome de classes.
A Cascata de CSS a gente sempre usa, querendo ou não. =P
Tenho uma dúvida, é correto usar os elementos no BEM? Tipo:
.about img
.about__item img
Ou correto seria:
.about .about__image
.about__item .about__image
Preferencialmente, a segunda opção.
Mesmo fora de BEM, não é muito bom usar seletor de elementos.
@@dpwoficial obg
@@Megatorial Não há por onde.
Muito legal, BEM é a metodologia que mais me identifiquei. Mas tipo, eu uso o fw Bulma pra quase tudo, mas o Bulma não usa o BEM. A minha dúvida é se é uma boa prática usar o BEM nesse caso?
Vai depender do que for convencionado, mas nada impede de serem usados em conjunto.
Inclusive, as classes BEM servem muito bem para diferenciar o que é código específico do projeto e o que é do framework.
Bem interessante! No caso dos elementos do bootstrap, você "ignora" as classes dele e cria novas para estilização?
Por exemplo utilizo navbar, grid, spinners, display, flex, spacing, sizing e text do bootstrap e quero aplicar essa metodologia
Pode usar junto, sem problema.
Dá uma olhada na nossa live de tira-dúvidas sobre BEM que abordamos isso: th-cam.com/video/STUy1I2qQjE/w-d-xo.html
Eu consigo conciliar essa metodologia BEM com bootstrap, teria um exemplo de código?
Oi, Pedro.
Tem como, sim. Dá uma olhada aqui: en.bem.info/forum/52/
Por exemplo em uma view de listagem de posts estaria correto utilizar blog__header e blog__body? E para o post ( componente vue separado) post__title, post__content, etc
"blog__header" e "blog__body" seriam Elementos (filhos) de "blog". Não sei se é o melhor caminho para uma listagem de posts -- dependendo, pode ser; é que não conheço a estrutura mesmo.
Quanto a "post__title", "post__content" etc., tá legal sim.
ou você poderia fazer um video usando pug, aquele template html, vlw video top, vou tentar aplicar o BEM no sass
Oi, Luis. Tudo bom?
Pode usar no Sass que você vai ver como é tranquilo. Dá uma olhada na desc do vídeo o artigo no blog que mostra como usar no Sass. Você vai gostar.
Ah, e anotada a ideia de abordarmos o Pug. :)
@@dpwoficial sim, eu to aprendendo sass ainda, to lendo a documentação, ele facilita tudo msm, inclusive so comecei a usar por causa do seu video sobre
Olha só! Legal saber. Você vai ver que vai te ajudar MUITO.
Foi BEM explicado kkkkkkkkkk
#tudumtss
ok obg
De nada.
Topppp. Like. Ei, sei que não é o foco do canal, mas se não puder fazer um video sobre isso, me tira essa dúvida no comentário pf.
Eu queria saber como seria feito a autenticação do usuário na hora de acessar as rotas privadas do frontend. Tipo, eu vi um post em um blog que ele só verifica se o localStorage o token é diferente de nulo. Mas isso é uma falha grave, pois se setar qualquer token, poderá ser visto o conteúdo daquela rota (mesmo que não possa editar ou mandar dados, já que pra isso, vai dar token inválido no backend)
Oi, Obito. Obrigado por comentar.
Realmente, este é um tópico bem amplo. Mas, adiantando, existem diversas maneiras de se fazer isso, a depender da tecnologia de back que você está usando.
Acredito que este código que você está comentando vou somente um exemplo, pois é realmente bem fraquinho em cenários do mundo real.
Masaaaassa!!!!
o/
No BEM, a gente só usa o modificador para mapear a estilização que a gente quer dar no CSS? O que eu quero dizer é que, se apenas tiver o modificador, nada acontece. É uma marcação, certo?
Não entendi direito sua pergunta...
Mas um Modificador, como indica o próprio nome, modifica um Bloco ou Elemento, alterando algumas de suas características.
Por exemplo, você fez um componente de botão, aí precisa que, em alguns casos, ele seja de um tamanho diferente dos demais, aí você cria um Modificador.
teria algum problema em vez de usar dois __ ou dois --, daria pra usar apenas um? eu normalmente faço assim parece até com o bootstrap
estaria errado?
Se for para seguir BEM, estaria errado sim.
Teria que ser nav__menu, nav__item etc.
Pra usar esse padrão dentro do sass?
Como ficaria?
.c-list {
& {
list-style: none;
maron: 0;
padding: 0;
}
&__link {
color: $colorBlue;
text-decorator: none;
}
}
Não precisa do `&` puro para aquelas definições, coloca direto; para Elementos e Modificadores, aí sim com com `&__el` e `&---mod`.
Dá uma olhada na descrição do vídeo que tem link para nosso artigo com exemplos de BEM com Sass. 👍
Vc prefere dois monitores a um super wide ??
Sim.
como ficaria esse conceito em um menu? contendo... (.menu ul li a) pra mim sinto dificuldades de aplicar quando se tem varios elementos desse jeito. poderia me explicar de uma melhor forma?
Em 13:52 mostramos um exemplo de uma lista com BEM que é parecido com o que poderia ser feito em um menu (simples). A ideia é usar nomes que sejam descritivos e permitam identificar cada elemento dentro da estrutura (sem, necessariamente, repetir toda a hierarquia HTML).
Opa, uma dúvida, eu costumo utilizar o bem, como nesse modelo "btn btn__size --large btn__shape --round", estaria incoerente ou poderia ser aplicado dessa forma também?
Tá errado. Teria que ser "btn btn--large btn--rounded".
Meu xará kkkkk
Tá de zoas! haha o/
Opa! Primeiro a curtir e a comentar!
haha, vlw, Chrystian! ;)
Só imagino a cara do povo do HTML q teve o trabalho de criar a semântica do elemento pra galera ficar colocando class="btn" ¬¬
Qual a necessidade, meu povo? PORQUE gzuis?
¯\_(ツ)_/¯
BEM até que é legal, mas ainda bem que inventaram tailwind hehe
São coisas completamente diferentes. Incomparáveis.
@@dpwoficial discordo. Eu entendo que são duas abordagens para escrever e manter css.
@@LennonSantosBR Site BEM: "BEM is a component-based approach to web development".
Site TW: "A utility-first CSS framework".
@@dpwoficial banana e maçã são diferentes, mas são frutas.
Com o conhecimento que vc tem quanto ganha por mes? pq sabe muito.
Obrigado, Matheus!
Meu codigo CSS tá uma bagunça sksksksks
www.cssalemdosensocomum.com.br/
eu aqui em 2022
OK...
Desculpem a sinceridade, mas considero o método absurdamente improdutivo, desnecessário e... bom, deixa a manutenção do sistema centenas de vezes pior, engessa tudo, um caos em sistemas grandes, com grandes equipes, um tiro que sai pela culatra. Vão de Styled components, que já evita name clashes, permitem compound components e lógica na estilização, e pronto galera - muito mais flexível, fácil e poderoso... lembrem: keep it simple!!
Todos os pontos levantados foram devidamente refutados no vídeo.
Aqui tem mais infos e exemplos: th-cam.com/video/STUy1I2qQjE/w-d-xo.html
Vlwww
@@dpwoficial Se puder conferir: th-cam.com/video/8EUsRcfye_8/w-d-xo.html
E: th-cam.com/video/QdfjWRc4ySA/w-d-xo.html
Bom... to avisando mais por camaradagem mesmo, pro pessoal não se iludir com BEM. Mas tranquilo, esse tipo de discussão sempre acontece, opiniões divergen.