Dominando o Styled Components REACT

Código fonte: github.com/fro...
Fala beginners, hoje vamos falar sobre styled components, uma lib de estilo do react, vamos aprender desde a instalação a como utilizar no nosso projeto criar componentes de estilo e muito mais.
📰 Inscreva-se no nosso Canal no Telegram:
t.me/frontbegi...
👨🏻‍💻 Curso que indico:
💻 Curso CSS e HTML +30 Projetos | Front Beginners: hotm.art/8484-...
💻 FullStack Javascript: hotm.art/PruiOl9
💻 Curso Algoritmo: hotm.art/4KxE0k
✅ Já nos segue nas outras redes sociais?
Instagram: @frontbeginners
📚 Livros que indico:
Código Limpo: amzn.to/3vWLKy9
Arquitetura Limpa: amzn.to/376U7Oe
Domain-drive design: amzn.to/3vzvN0Y
Entendendo Algoritmos: amzn.to/3kxvihv
Padrões de Projeto: amzn.to/3y68Tjh
🖥 Meus equipamentos:
Teclado Keychron k2 v2: bit.ly/3BtZNy2
Mouse Mx Master 3: bit.ly/3RsvM7n
Mousepad: bit.ly/3QunWc3
Luz led Sokani P25: bit.ly/3B5HM7V
Bastão de Led RGB Sokani x25: bit.ly/3Btjmqh
Suporte Celular: amzn.to/3gyF0RQ

[@andrevitor_macedo]

REALIDADE! Esse cara ensinou neste vídeo 100% do que vocês iram usar em qualquer trabalho na europa e nos estados unidos! Confia nessa aula e grava o que ele passou, não teve enrolação É ISSO AI e pronto !

[@FrontBeginners]

Hehehe muito bom André, bom saber que tem pessoas que valorizam nosso conteúdo ❤️

[@williamalves471]

esse mano é muito foda na moral, eu só vejo video dele

[@cahdemarchi5258]

O bom é que vc explica de uma forma simples, na prática e os usos em projetos reais. Obrigada, foi uma baita aula. 13/100 ✔️

[@FrontBeginners]

Feliz que tá gostando Cah … tento ensinar pro meu eu do passado, com pri gostaria de aprender hehe

[@guga-araujo]

Excelente video! Pelo o que eu entendi, o que se usa por baixo dos panos é SCSS, pois permite esse estilo de aninhamento que torna muito mais organizado.

[@heldercambuta723]

Comecei a estudar styled-components recentemente a partir da documentação... Essa aula abriu-me a mente sobre outras possibilidades! Agora deixa ir fazer manutenção nos componentes, que fiz um código muito zoado!😂😂 🚀🚀🚀

[@nicolasalexandre1195]

sou apaixonado por styled-components, quando aprendi a usar nunca mais parei kkkk, muito top sua video-aula parabens irmão.

[@FrontBeginners]

Vlw meu querido, tmj ❤️

[@Todorokizinho]

Comecei a estudar React esta semana finalmente, e perguntei para pessoas qual seria a melhor forma e mais confortável para estilizar componentes e um projeto React, e me deparei com essa belezura que é o styled-components. Simplesmente estou viciado em estilizar assim, é até mais bonito de se ver.

[@denisonkolling]

Carlinhos da Massa o brabo!!! Só dicas top, muita função prática, boraaaa!!!

[@mariolima8781]

Melhor didatica que já vi, agora to conseguindo enterder muita coisa vlw professor

[@FrontBeginners]

Tmj Mario 🚀🚀🚀

[@oziasjunior6007]

Muito boa a aula. Atualmente trabalho usando o framework Laravel, mas tenho muito interesse em aprender a usar o React para futuros projetos.

[@FrontBeginners]

Saquei, e gosta de laravel?

[@oziasjunior6007]

@@FrontBeginners gosto muito, mas não vejo muitas oportunidades de emprego como vejo para quem trabalha com React. Então pretendo aprender React como forma de abranger mais possibilidades profissionalmente.

[@FrontBeginners]

Sim isso é vdd, boa sempre bom evoluir

[@leonardoabdalla1944]

Realmente merece um like

[@flaviodamataflv]

Parabéns Jorge, suas aulas são excelentes , estão me ajudando muito, é o melhor de graça, que Deus abençoe grandemente voçê e o seu canal.

[@FrontBeginners]

Vlw meu querido ❤️

[@aandmesquita]

O bixo é brabo 👏🚀

[@FrontBeginners]

🚀🚀🚀

[@douglasmatos2134]

Cara, eu tinha visto uns 3 videos sobre temas, e simplesmemte não compreendia de onde as coisas estavam vindo... Estou refatorando meu portfólio (html css e js) para react... E quando foi colocar tema vi q nao da para selecionar elementos da mesma forma kkkkk e meu cérebro bugou, tentei aprender, mas as vezes parecem que ensinam coisas simples com muito cuidado, e coisas complexas de forma avoada kkkkkkk pra quem não esta habituado com 50 pastas com 5 linhas de codigo em cada uma, a gente se perde só nas pastas ("de onde ta vindo esse import?! ") mas no seu video pude compreender muito mais, mesmo as vezes me perdendo um pouco no fim e tendo de rever pausando para compreendee de onde estavam vindo os trexos de codigo e como eles estavam vindo kkkkk Obrigado pelo seu video! Ajudou muitooooo!

[@ygaaaoo]

Graças a Deus eu estou aprendendo react e seus vídeos está e irão me ajudar muito ainda. Vlw Jorge, na hora certa chegou esses vídeos pra mim

[@FrontBeginners]

Que bom que tem ajudado, vamos fortalecer juntos 🚀🚀

[@oziasjunior6007]

Agora tudo fez sentido hehe

[@FrontBeginners]

Hehe

[@raiffemouraa]

muito bom essa aula cara, didática muito boa e simples de entender... valeu

[@felipeleopoldino5185]

13/100 simplesmente top 🚀🚀🚀

[@FrontBeginners]

Vlw meu querido 🚀🚀🚀

[@oliveiradev]

Canal brabo

[@pedrogermanoads]

13/100 brabo demais

[@FrontBeginners]

Vlw Pedro tmj 🚀🚀

[@rafahalcantara]

Tinha muitos conceitos sobre o styled que eu não sabia. Aprendi agora

[@FrontBeginners]

Opa que show irmão, que bom q consegui ajudar !!!

[@lucianoferreira8620]

Parabéns! Ótima explicação

[@FrontBeginners]

Vlw Luciano 🚀🚀

[@zolkmusic]

13/100 🔥🔥🚀🚀 AULA INCRÍVEL!

[@FrontBeginners]

Tmj meu Bom 🚀🚀🚀

[@wallacesilva6087]

O que tava precisando valeuu!

[@FrontBeginners]

Ai sim 🚀🚀

[@thaissacarvalho3485]

Excelente video! Aprendi bastante!

[@FrontBeginners]

Tmj meu querido 🙅🏻‍♂️

[@TelliscisHilstons]

13/100 Boraaaaaa 🚀🚀🚀🚀

[@FrontBeginners]

Pra cima 🚀🚀🚀

[@tivrusky3483]

Muito foda! Gostei mesmo, mas fiquei com uma dúvida aqui que foge o escopo da aula. Caso eu queira utilizar o styled components com typescript, como faço pra exportar e utilizar as interfaces?

[@juniorfront]

Poderia fazer um video falando sobre as diferenças do emotion e o styled components

[@andreurbaneck]

que dahora

[@FrontBeginners]

🚀🚀

[@geligegamer]

13/100 ✅ 🚀🚀🚀

[@FrontBeginners]

🚀🚀🥰

[@adrianasilvadomingos2114]

Aula top!! 👌 só a extenção vscode styled que parece não ta mais funcionando. 2024 ✌

[@Evandro20]

Conteúdo brabo, vou até salvar pra me rever depois caso esqueça kkkk

[@LusquinhaNathan]

Otima aula!!

[@Gabweb95]

Ando usando tailwind, mas quem sabe css de verdade consegue se adaptar rápido a qualquer tecnologia de estilização, salve!!

[@guilhermeh.v.santos7424]

Bora!!!

[@FrontBeginners]

Avante 🚀🚀

[@rodrigobonfim9011]

13/100 done!

[@FrontBeginners]

🚀🚀🚀

[@gustavodntts]

13/100 🚀🚀🚀 Eu não fazia ideia do poder do styled component. Eu lembro de ter utilizado a um tempo atrás mas não nesse nível de profundidade, criando temas específicos. Em relação ao Tailwind, eu ainda prefiro o Styled Component. O Tailwind é bem prático mas requer um aprendizado "próprio" e eu acho que o código fica um pouco mais difícil de ler. Além da necessidade de estar com a documentação debaixo do braço o tempo todo.

[@cssgabriel]

boraaa 13/100.. TMJ

[@FrontBeginners]

🤞

[@ivanrabelo1558]

To aqui em dia 13!

[@FrontBeginners]

Boaaa 🚀🚀

[@denneraladim6190]

Qual você recomendaria utilizar no react o sass, css module ou styled components ? e qual as vantagens ?

[@AlessandroCamargo-nk3fy]

13/100

[@FrontBeginners]

Tmj meu querido 🚀🚀🚀

[@MatheusSilva-qm3ph]

Essa aula foi braba.....Só me perdi na parte do (children) qual aula me aconselha a rever? Obrigado!

[@guilhermeh.v.santos7424]

Children seria o que ta dentro da tag, no caso Front Beginners ai o texto "front beginners" é o children(filho) assim como button é o pai(parent) do front beginners, que acredito que vc pode ouvir isso tbm. Essa relação de "hierarquia", poderia ser outras tags tbm. É como se fossem pastasdo computador... Desktop > Meu Computador > Disco C > Projetos. uma ta dentro da outra desktop é pai(parent) de meu computador e meu computador é filho(children) de desktop e se tem pasta no meu nivel tbm existe siblings(irmãos).

[@FrontBeginners]

Boa explicação Guilherme é isso Matheus.

[@MatheusSilva-qm3ph]

@@guilhermeh.v.santos7424 Boa explicação, compreendi melhor. Obrigado

[@caiomucio9237]

Mano, você parece muito o fisiculturista Júlio Balestrin kkkk

[@iamjvfs]

13/100 😍😍

[@FrontBeginners]

Sempre fortalecendo 🚀🚀😂

[@ricardocedraz2250]

13/100✅

[@FrontBeginners]

Gostou da aula?

[@ricardocedraz2250]

@@FrontBeginners tudos os seus vídeos são fantásticos, agradeço grandemente por vc disponibilizar seu tempo à fazer este projeto. Vamos avante (atualmente estou pausado nos estudos de JS e comecei a entender Java e SQL). Mais todos os dias estou aqui acompanhando os vídeos e fazendo manutenção do que já aprendi.

[@FrontBeginners]

Boa Ricardo fico feliz 🫶🏻 e obrigado pela parceria tbmZ

[@denneraladim6190]

É verdade que o styled components não vai mais ser atualizado ?

[@BrunoNunes72]

Mesmos tipos de componentes com estilos diferentes, como devo organizar? Alguem pode me tirar essa duvida? Ex.: minha aplicação tem 3 tipos de botões. Devo criar e exportar os tres num único arquivos Buttons.style.js? Ou crio um arquivo para cada estilo de botão? Qual seria a melhor pratica?

[@eloysalva1324]

13/100 🧟‍♂

[@FrontBeginners]

Sempre presente ✅

[@pedroluis9549]

27/05/2024 - 13/100 🚀🚀

[@victorsaad59]

Alguém sabe qual a extensão que ele usa para o preenchimento automático da tag de fechamento quando a de abertura é digitada?

[@nuffle8590]

se chama Auto Rename Tag!

[@crisdolister]

Amigo...estou tentando usar o styled components mas no meu Vs code nao esta sugerindo , saberia dizer o que seria?

[@dsirexx]

Vc instalou?

[@crisdolister]

@@dsirexx ah sim..tudo instalado e importado..inclusive alterei a versão

[@MatheusSilva-qm3ph]

Bora codar, sou brabo. #Dia13/100

[@FrontBeginners]

hahaha bora brabo 🚀🚀🚀

[@igorhenriquevieiradejesus9405]

top de mais,mas este zóio ai nao engana bora f1? kkkkkk

[@FrontBeginners]

hahahaha pecado man, eu tava cansado mesmo. Não fumo 🫶🏻❤️

[@igorhenriquevieiradejesus9405]

@@FrontBeginners parabens pelo conteudo 👏👏👏

[@ramonStones]

Eu nunca vou pagar pau pra mulher, nunca vou dar moral mesmo que elas não quer, elas quer meu dinheiro e de mim vai ter nada, é o que posso na internet enquanto minha mãe paga.

[@rafahalcantara]

Sigma Lifestyle?

[@marcosdesouza8872]

13/100

[@FrontBeginners]

Bora Marcos 🚀🚀

[@italorodrigues9354]

13/100

[@FrontBeginners]

Boa sucesso 🚀🚀

[@mateusdavi8017]

13/100

[@FrontBeginners]

Boa Mateus 🫶🏻