Utilizando TailwindCSS no React Native com NativeWind

Nessa vídeo eu vou mostrar pra você como configurar o Tailwindcss no React Native utilizando o NativeWind. O Tailwindcss é um utility-first CSS que aumenta muito a produtividade para estilizar interfaces com classes.
Curso de React Native
www.rocketseat...

[@YuriMatheusGomes]

TailwindCSS no React Native é covardia pura. Sou aluno Rocketseat e você é um professor bem top de RN ... seria legal pegar um app bonito para codar ele com o tailwind.

[@orodrigogo]

Opa. Gostei da ideia 🤩

[@allancassio6674]

como instalar o font family no app?

[@Futebolmemorable]

Uma duvida que eu tenho, na web quando quero mudar o weight da font de regular para bold, eu uso a propriedade de font weight, no react native para fazer isso tem que trocar a familia de font? ou posso usar a propriedade de font weight e passa por exemplo 700

[@RobsonSilva-ww4uj]

Sim

[@Futebolmemorable]

@@RobsonSilva-ww4uj Um exemplo, eu tenho que usar `` FontFamily: "Inter_Bold_700" `` ou eu posso usar apenas `` FontWeight: 700 // Quando eu faço dessa forma, fica em negrito, mais parece que não é a font que eu quero `` Se alguém puder tirar essa dúvida agradeço muito.

[@charliesamoel8828]

No caso de aplicações hibridas, qual a solução mais simples, devo usar metro ou webpack para configuração do ambiente web?

[@dinaelmiranda2585]

Mesmo seguindo os passos, os estilos da className não refletiram na minha aplicaçaõ.

[@misterjs023]

saudações teacher!, ultimamente tenho usado muito o pacote twrnc (Tailwind React Native Classnames), parece mais simples de configurar (na prática é só instalar e sair usando, que nem o expo😅 ), e parece oferecer o que o NativeWind oferece (ainda não explorei tudo mais acho que é isso), já deste uma olhada neste pacote? seria uma alternative boa para o NativeWind?

[@thiagokrathos]

Vamos atualizar o curso ignite? bjo!!

[@32Doom32]

Cara, seu conteúdo é muito fácil de entender. Você explica muito bem e sem enrolação, você é melhor que muitos canais grandes.

[@kleisernairobi6561]

Diz aí Rodrigo, qual a forma de estilização vc usa profissionalmente em seus projetos? Não entra na minha cabeça essa forma de estilização ao estilo HTML/CSS que antigamente a gente chamava de código espaguete. No React, eu até curto ChakraUI, que são propriedades e não classes.

[@carloscurcino]

Estou tendo erro ao buildar com o eas, alguém sabe por quê??

[@facury3057]

Tbm, conseguiu resolver?

[@FelipeSouza-vz6gc]

Conteudo muto bom, quero começar a usar NativeWind acho que vai facilitar e melhor o padrão de estilo. só tenho uma dúvida como poderia criar mais de um tema, exemplo dark Mode, Green Mode, to pensando usar como mostrou o arquivo de adicionar um Colors próprio só não sei se eu teria vários Colors

[@gabrielarosa4017]

Segui o passo a passo do video, mão tah dando erro no meu tailwindcss na hora que roda o app. Me parece que não tah encontrando o arquivo global.css Consegue me dar um help??

[@ladislaucumbicapascoal]

rodrigão é o cara do RN. conteudos tops, didactica super, super

[@orodrigogo]

Muitoooo obrigado. Gratidão 🤩

[@MagnoKellyFelipe]

Boa Rodrigo. Irmão tem como vc explicar uma solução de previnir printscreen no iOS? No android é tranquilo e simples , mas no iOS tá sinistro. Obrigado pelo seu tempo👍

[@gabrielleoliveira7131]

Tenho dificuldade em fazer o deploy de projetos na Expo App Store quando uso nativewind, saberia me dar uma solução? Inicialmente deu problema no eas build, consegui buildar, mas dps deu problema no update apontando pro nativewind especificamente

[@bpinela]

Rodrigo, você considera a v4 estável suficiente pra iniciar uma aplicação?

[@abilioscoelho]

Matavilha Rodrigão, mais um vídeo sensacional! Gostaria de sugerir um tema para próximos vídeos: Offline first utilizando PowerSync e sqlite

[@silvadeveloper-t1k]

uma didática impecável, sensação de pegar na tua mão e dizer: olha é assim que você tem que fazer. parabéns preciso fazer um curso seu onde encontro?

[@allancassio6674]

Rodrigo. pq não achamos mais os links do codigo ou de materiais nos vídeos?

[@williamcerqueira7236]

É uma possibilidade nova ainda. Seria viável ja usar em produção?

[@MateusSantos-oi4vf]

Professor do céu se o senhor tivesse upado esse vídeo uns 4 dias antes meu projeito iria ser com tailwind kkkkkk. Mas os próximos serão. Sua didática é fenomenal! Obrigado.

[@alaelciolucas174]

Muito bom cara quando vai sair o próximo aplicativo com tailwindcss no canal?

[@lguedes768]

Muito interessante o conteúdo, como sempre! O cara do react-native!

[@rafael37663]

Cara, muito top, estou prestes a criar uma nova aplicação com react native e tailwind, sabe me dizer se tem alguma biblioteca para native que se pareça com o shadcn ui ou radix ?

[@maurotwister475]

Tem sim cara, o NativeCN UI. Há um video do @Rodrigo aqui no canal que usa usa lib.

[@rafael37663]

@@maurotwister475 booua men, vou dar uma olhada valeu 👍

[@carlosoliveira8439]

Ele não tem suporte pra grid né?

[@heitormarini5249]

Tem, a documentação tem até sobre flex box e até animações. Bem completo

[@sombrakey]

Valeu demais por esse conteúdo!!

[@orodrigogo]

Fico feliz em ajudar 🤩

[@felipecosta4132]

Fala rodrigão, minhas fontes não estão fazendo efeito no app. Testei com 2 já. Me dá uma luz aí

[@misterjs023]

Olá Felipe, posso saber se instalaste e importaste as fontes desejadas?

[@felipecosta4132]

@@misterjs023 Estou utilizando fontes do google, mas dá erro dizendo que não está instalado no sistema sei lá

[@misterjs023]

​@@felipecosta4132 entendo, tenta fazer novamente a instalação, confira que se estás importando bem as fontes, e implementa a lógica de não abrir a aplicação enquanto as fontes não tiverem sido carregadas (meio que a splash screen, aproveita ela pra carregar as fontes e não redireciona o user pra nenhuma outra tela enquanto as fontes não forem carregadas)

[@felipecosta4132]

@@misterjs023 Ela funciona no estilo inline style={{...}}, mas no tailwind não

[@misterjs023]

@@felipecosta4132 acho que no tailwind não tem como passar a fontFamily no className (caso seja isso que estás fazendo)