Curso avançado de React: #16 - Dicas e truques com o tailwindcss que vão salvar o seu projeto
Ya has superado la mitad. Estás muy cerca de completar el curso.
Sobre esta lección
Precisa de ajuda? Solicite uma ajuda particular: https://forms.gle/Pu1aT2LsbU1nuTTDA Nessa aula intensa do curso avançado de React, a gente aprofunda ainda mais o uso do Tailwind CSS dentro do projeto, indo muito além da instalação. Eu te mostro como fiz a migração parcial do nosso código de CSS Modules para Tailwind, e aproveito para explicar várias boas práticas que vão facilitar bastante a tua jornada com estilização baseada em utilitários. Além disso, exploro situações reais do projeto que podem gerar dúvidas, como a aplicação de gradientes, e te ensino como reaproveitar esses estilos com eficiência usando as layers e a função @apply. Você vai aprender a organizar seus estilos em camadas como base, theme e components, centralizando configurações que se repetem e tornando o código mais limpo, performático e escalável. Também te mostro como criar temas personalizados com variáveis de cor reutilizáveis, e como lidar com efeitos como hover e active diretamente nas tuas classes. Tudo isso com exemplos práticos no Visual Studio Code, explicando o passo a passo com clareza para que tu entenda a lógica por trás de cada escolha técnica. Essa aula é um divisor de águas para quem quer escrever CSS moderno, reutilizável e mais conectado com o dia a dia de times profissionais que usam Tailwind em produção. Mesmo se tu ainda estiver se adaptando ao novo formato, essa aula vai abrir tua mente para as vantagens de migrar seu CSS tradicional para uma abordagem mais dinâmica e inteligente. Dá o play e vem comigo para dominar de vez o Tailwind CSS no mundo real. Links mencionados no vídeo: 📖 Repositório do projeto - https://github.com/lvsouza/curso-base-de-react/tree/1bc2459c1b3a61567380fe2c8b1252dcc5c293df 🗨️ Discord - https://discord.gg/ZC7JrPZn7P 🎬 CodarSe - https://codarse.com Outros cursos no canal: 🎩 Figma para DEVs - https://youtu.be/4rSPV1NbM10 ☪️ Curso de estilização no React - https://youtu.be/oUbPkR799fc 💎 Curso base de React - https://youtu.be/ggtWTKbhN_U 👑 React, Material UI 5 e Typescript - https://youtu.be/wLH1Vv86I44 🏆 Curso de API Rest, Node e Typescript - https://youtu.be/SVepTuBK4V0 Livros recomendados: 📘 Código limpo - https://amzn.to/43Xiick 📘 Arquitetura limpa - https://amzn.to/3ZMCStr 📘 Migrando sistemas monolíticos - https://amzn.to/45ByPDZ 📘 The Micro SaaS Handbook - https://amzn.to/4jCan93 Conteúdo: 0:00 | Apresentação da aula 0:20 | Avisos importantes 0:35 | Como trabalhar com gradientes no tailwindcss 4:20 | Como funciona as layers no tailwindcss 6:20 | Criando uma classe personalizada com classes tailwindcss 10:20 | Como trabalhar com css global com tailwindcss 11:50 | Trabalhando com a layer components do tailwindcss 16:50 | Evite fazer isso ou você terá problemas 17:52 | Como criar um tema dentro do tailwindcss 19:50 | Finalização e agradecimentos CODARSE - [Membros apenas] Tratamento avançado de CSS #ReactJS #Vite #TypeScript #JavaScript #FrontEnd #Programação
Sobre este curso
Bem-vindo à playlist oficial do Curso Base de React! Aqui você encontra todas as aulas organizadas na ordem certa para aprender React do jeito certo — direto ao ponto, com prática e explicações claras. Neste curso gratuito e completo, você vai: - Entender o que é o JSX e como o React funciona por baixo dos panos - Aprender a criar componentes reutilizáveis - Trabalhar com useState, useEffect, useCallback, useMemo e muito mais - Utilizar React com TypeScript desde o início - Construir uma aplicação prática enquanto aprende cada conceito - Evitar atalhos e aprender React puro antes de partir para frameworks como Next.js O curso é ideal tanto para quem está começando quanto para quem quer fortalecer a base no React com boas práticas e contexto moderno (usando Vite como bundler). Dica bônus: Quer uma experiência de estudo mais limpa e focada, sem distrações do YouTube? Acesse a versão deste curso na plataforma externa: https://codarse.com Quer maratonar? Os membros do canal têm acesso antecipado a todas as aulas. Mas se você está vendo isso depois do lançamento, aproveite: o curso completo já está disponível aqui na playlist! Prepare seu ambiente, inscreva-se no canal, ative as notificações e bora codar com React! #CODARSE
Lo que aprenderás en este curso:
- Comprender la arquitectura de componentes de React
- Gestionar el estado de la aplicación con hooks y context
- Crear interfaces de usuario dinámicas y reactivas
- Implementar enrutamiento y navegación en aplicaciones React