USE ESSA BIBLIOTECA para criar App mais rápido no React Native (shadcn/ui no ReactNative?)
ฝัง
- เผยแพร่เมื่อ 8 ก.ย. 2024
- No aniversário da Rocketseat, quem ganha uma OFERTA EXCLUSIVA é você!
Descubra mais: rseat.in/E5xT0...
Essa biblioteca vai ajudar você a criar seus Apps 10 vezes mais rápido com React Native. Uma biblioteca com diversos componentes com a estrutura pronta para você estilizar com tailwindcss e modificar como quiser.
E pra gente usar essa biblioteca na prática, vamos criar um App do zero.
Arquivos do projeto: github.com/oro...
Projeto completo: github.com/oro...
Vai ficar de fora dessa OPORTUNIDADE nunca antes vista?
O One Future vem ai: rseat.in/E5xT0Slto
realiza meu sonho ensina criar um app de live igual do app da bigo e buzzcast ?
ensina criar site e mais facil que desenvolver app depois eu transformo o codigo para rodar em app
Rodrigão sempre salvando quando o assunto é React Native, Obrigado por mais uma Aula
Opa, valeu demais amigo. Bora trazer bastante conteúdo aqui no canal 🤩
Rodrigão salva a galera! Obrigado mesmo por compartilhar. Fera d+.
Tamoooo junto! Bora trazer bastante conteúdo nesse canal! 🤩
Fala Rodrigo, faz um video sobre o Skia, parece estar absurdo
Excelente sugestão. Anotado aqui 🤗
TOP Rodrigo So Não esquece de subir no Github Parabens qdo Tiver condições vou fazer o Curso do Ignite Ate
Opa, muito obrigado. Coloquei aqui o projeto completo: github.com/orodrigogo/nativecn-app
Rodrigão, agora sim meus layouts irão render. Obrigado por compartilhar!
Que massa, haha. Tamo junto!
Melhor canal para aprender React Native e Expo é claro
Que honra! Vocês tem ajudado muito a evoluir e crescer aqui o canal. Valeu demais! 🤩
bah muito bom, iniciando um projeto para um cliente aqui nessa pegada ai. tu manda d+
Que maneiro. Bora pra cima! hehee
show Rodrigo, boa apresentação! D+
Valeeeu demais!
Rodrigo, uma sugestão: coloca o link das libs que voce utiliza nos seus videos na descrição. ✌️
Como sempre conteúdo muito top! Parabéns Rodrigo!!
Talvez seria interessante trazer um vídeo apresentando um comparativo destas libs no tamanho do pacote gerado (native base, tailwind, shadcn/ui)
Opa, muitoooo obrigado. E boa sugestão de vídeo, hein. Valeeeu! 🤩
Muito bom seus vídeos, sempre dando uma luz em nossos projetos
Fico muito feliz, value demais. Bora trazer bastante conteúdo aqui para o canal. 🚀
Tenho usado à Gluestack-ui como opção primária e UI Kitten - mais completo.
Boa! 👏
Obrigado pelo conteúdo meu caro, estou verificando se caio na leva de React Native hahah, estou cansado de fazer automações!
Boa 🚀
Show !!!Rodrigo você é demais cara .
Opa, valeu demais. Fico felizão! 🤩
Senssacional Rodrigo!
Valeeeeu amigo 🤩
Para mais alguém que teve problemas com o funcionamento do Tailwind. Apenas adicionando o App ao arquivo de configuração do tailwind.config.js:
content: ["./App.{ts,tsx}", "./src/**/*.{ts,tsx}"]
Tive meu problema resolvido!
Boa. Obrigado por compartilhar 👏🏼
pois e mano, peguei umas aulas dele de native base, react hooks form, salvou de mais ja, e agora veio essa novidade ai, bora ver de qual e.
Opa, fico muito feliz em ajudar. Bora trazer bastante conteúdo nesse canal! 🤩
Comentando pra ajudar.
😁
Fala Rodrigão, blz? Parabéns pelos seus conteúdos, são TOP!!! Mas diz aí, quando vai postar vídeos sobre Flutter? >
Valeu demais, fico muito feliz. Por enquanto, meu foco é o React Native mesmo. hehe 😄
Melhor coisa 👨🏻💻🚀
🚀🚀🚀
Rodrigo, parabéns pelo excelente conteúdo. O native base está sendo depreciado, em substituição estão sugerindo o gluestack, que tal uma análise e/ou tutorial!!!
Opa, valeu demais amigo. Obrigado pela sugestão, gostei da ideia de vídeo 🚀
Ótimo, parabéns pelo tuto
Muitooo obrigado! 🤩
Fala Rodrigão!!! desde ja agradeço esse conhecimento magnifico
Valeu demais, fico feliz! Verdade hein, daria um bom vídeo hein... hehe
se fizer god@@orodrigogo
Opa mais uma aula :D
Bora pra cima 🚀
Top demais!
Obrigado por esse conteúdo!
(agora que vi que fui o primeiro)
Opa, fico feliz que curtiu! 🤩
Cara show!!!
funciona no app do expo normal, mas quando eu emulo nativo usando o expo-client a estilização nao funciona, alguma ideia?
nossa cara que coisa linda vou mudar meu app 0o
tbm kk
🤩🤩🤩
o meu ta dando
Error running TailwindCSS CLI, please run the CLI manually to see the error.
:/
Top demais Rodrigo!
Você ja usou flutter ? Tenho usado nos últimos meses e é bizarro como a arvore de elementos do flutter parece mais organizada e modular quando comparado ao react native, que parece ser uma adaptação pra mobile.
Ja comparou as duas techs? Vlww!!
Não cheguei a usar. Vou dar uma olhada para comparar, hehe.
Valeu!
Valeu demais 🤩
quase infartei quando vi o titulo estava procurando um lib tipo shad
hahaha 🤩
shadycêeneuai no reacty nativy...
Rodrigo, estou ainda no segundo teste, 19:15, ... e nada acontece,
Using src/app as the root directory for Expo Router.
Web C:\MyProjetos\React_JS
ativecn-app
ode_modules\expo/AppEntry.js ░░░░░░░░░░░░░░░░ 0.0% (0/1)done
Web C:\MyProjetos\React_JS
ativecn-app
ode_modules\expo/AppEntry.js ▓▓▓▓░░░░░░░░░░░░ 25.0% ( 4/11)
O browser abre e ainda fica carregando, ... o primeiro funciona de boa, será que o problema está na versão 50 do SDK?
Confirma se você colocou export default na função. O erro diz que ele não está conseguindo encontrar o arquivo principal. Ou, executar novamente com npx Expo start -clear para resetar o cache.
Isso é para qm já está em um nível maior. Estou começando agr, não entendi quase nada, ainda mais esses tantos de arquivos de configuração, nem sei oq significa e nem de onde vem e para q serve
Opa, um vídeo mais focado em básico ajudaria? Da uma olhada nos que tem aqui no canal criando um App do zero 🤗
@@orodrigogo Ok, vou seguir a dica e me inscrever. Obgd👍
Foda de mais seus videos Rodrigo! So que o estranho é que para mim está dando erro ao executar o app com o nativewind v4 com Expo SDK 50. Erro: tailwindcss(native) rebuilding... taking long all time.
pai do céu. Achei que ja estava inscrito.. +1
Veeem, hehe
Rodrigo uma duvida que eu tenho e quando eu vou instalar uma biblioteca e da erro de dependência de versão, o que eu tenho que fazer? A maioria das biblioteca esta dando esse erro.
Confirma se vc está usando a versão mais recente do node.
Excelente vídeo! Tenho uma pergunta, React Native é um bom caminho para o mercado de trabalho para dispositivos mobile?
Com certeza. Tem muitas oportunidades! 🤩
Bacana, achei que o mercado estivesse meio morno para React Native!
Aproveitando nossa conversa, existe a possibilidade de executar o emulador Android via docker?
O que a galera tem usado pra estilização no react native atualmente?
Um top 5 hoje: Stylesheet, Nativewind, Tamagui, Restyle e gluestack-style
Como esta a perfomance dessa lib? Eu usei o NativaBase e me decepcionei o quanto ele não é performático.
Como ela usa os componentes e API do próprio React Native, então é bem tranquilo. Zero impacto. 🚀
low-code é bem legal mesmo
Boa 🚀
Essa é considera melhor lib de inteface pra se trabalhar com server components no next js? Ou tem outra melhor?
Não necessariamente. No caso do React Native server components ainda não tem tanto suporte mas está avançando. Geralmente, utiliza-se API. Aqui tem um exemplo: x.com/SzymonRybczak/status/1769747995862384756
Faz um video com expo router tabs e nativewind por favor, n é possivel que essa montueira de erros é só comigo
Opaaa, obrigado pela sugestão 🚀
mano. faltou fazer o push para o git?
Tá na mão:
github.com/orodrigogo/nativecn-app
Vou começar um projeto novo pra empresa com react native. Posso utilizar essas abordagens ai ? Quais frameworks/libs voce recomenda ? Nunca mexi com react native mas mexo com react. (Fui aluno seu no explorer, manda bem demais rodrigão)
Quando puder, assiste esse vídeo: th-cam.com/video/fVEa8Hb9kg8/w-d-xo.htmlsi=rcJPinWSkqqsNK1y
Tem minhas recomendações, está bem completo.
@@orodrigogo Muito obrigado. Irei dar uma olhada hoje 🙏🏽
interessante, eu estava usando o react-native-ui-lib, que tambem implementa o tailwind
Essa lib tem uma documentação bem massa também, né.
@@orodrigogo "parecer não é ser" kkkkk, algumas paginas tem exemplos outras nao. mas eu curti a lib.
Rodrigo, vale a pena usar o NativeWind para projeto grande em produção e tão?
Estou pensando em refatorar meu app
Vale sim. Eu recomendo 😁
@@orodrigogo Já ficaria responsivo nos tablets tambem? E você já usa em seus clientes?
Vc vai lançar algum curso com essa lib na trila do Ignite?
Não tenho uma previsão, mas pode ser que sim, hehe. 🤩
@@orodrigogo espero que sim :) , vc manja de algo a respeito do desenvolvimento de apps usando tauri? Sabe se tem alguma previsão de algo na rocket falando de Tauri ou Rust? Sou assinante de vcs desde 2022, top demais
Que massa@@lucascoliveira3957 , bom demais ter vc com a gente. Sobre Tauri ou Rust, por enquanto não tem previsão. =/
O uso do tailwind impacta de alguma forma a performance final do aplicativo?
Não 😄. Por que no final, quando fazermos o build do App todo o código será nativo. 🚀
Olá, show esse conjunto de componente, nessa versão 50+ já está disponivel a lib de http e graphql para acesso ao back-end sem ter que usar o fetch e as gambiarras?
Pode sim, esses componentes são independentes. 🤩
bom dia rodrigo, estou fazendo o projeto da NLW e não tenho os arquivos que foram disponibilizados, você ainda tem eles p me disponibilizar?
Coloquei nesse link pra você: we.tl/t-mX490n9IGQ Lembrando que esse link expira em 7 dias.
@@orodrigogo obrigado!
ola, Rodrigo, sou back-end java, e actualmente estou estudando React native, estou com uma duvida.
caso eu use o expo e instalo bibliotecas nativas e depois dar um expo prebuild, seria necessario instalar o sdk ou alguma configuracao do android studio para seu funcionamento?
obs.: tirando o emulador porque uso o meu celular
Precisa só ter configurado o ambiente Android ou iOS para rodar o App direto no emulador sem precisar do Expo Go. Quando vc usar o prebuild ele vai gerar o código nativo Android e iOS. Se quiser, pode até começar o projeto direto com bare workflow. Vou deixar aqui um passo a passo: react-native.rocketseat.dev/android/windows
então esse nativecn é como se fosse um native base só que com tailwind?
Quase amigo. As duas principais diferenças são: com o nativecn você não está instalando novas libs, sómente copiando e colocando a estrutura de um componente para o seu projeto. Segundo, é que vem sem visual pra vc estilizar como quiser com o tailwind.
Pq ngm cria componentes e ui pro react native ? Tem tão poucas opções
Você diz bibliotecas com componentes prontos?
@@orodrigogoisso Rodrigão pro react padrão tem muitas mas eu não encontro muitas pro mobile
Fala Rodrigo, tu tem alguma indicação de conteúdo sobre criação de modulos nativos?
Não me vem nada na cabeça, mas posso trazer por aqui em breve 🚀
@@orodrigogo Seria top demais
Rodrigo um App usando api de map do mapbox , app de taxi
Boa sugestão, hein. Daria um App massa aqui . Valeeeeu 🤩
qual distro vc usa?
Estou utilizando popOS.
cade o maczão rodrigao
Opa, Mac está aqui hehe. Passei a usar mais esse ambiente mais pensando na galera que não tem. Mas nos próximos devo voltar a usar 🤗