USE ESSA BIBLIOTECA para criar App mais rápido no React Native (shadcn/ui no ReactNative?)
HTML-код
- Опубликовано: 3 окт 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 🤩
Rodrigo, uma sugestão: coloca o link das libs que voce utiliza nos seus videos na descrição. ✌️
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
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. 🚀
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! 🤩
Rodrigão, parabéns pelo video! melhor agora no seu próprio canal!
bah muito bom, iniciando um projeto para um cliente aqui nessa pegada ai. tu manda d+
Que maneiro. Bora pra cima! hehee
Rodrigão, agora sim meus layouts irão render. Obrigado por compartilhar!
Que massa, haha. Tamo junto!
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 🤩
show Rodrigo, boa apresentação! D+
Valeeeu demais!
Top demais!
Obrigado por esse conteúdo!
(agora que vi que fui o primeiro)
Opa, fico feliz que curtiu! 🤩
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 😄
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 🚀
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
Tenho usado à Gluestack-ui como opção primária e UI Kitten - mais completo.
Boa! 👏
Comentando pra ajudar.
😁
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! 🤩
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.
Ótimo, parabéns pelo tuto
Muitooo obrigado! 🤩
Rodrigo, onde que vc descobriu que tinha que criar um arquivo utils e importar clsx, twmerge? não achei na documentação :(
Melhor coisa 👨🏻💻🚀
🚀🚀🚀
Opa mais uma aula :D
Bora pra cima 🚀
Cara show!!!
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?
funciona no app do expo normal, mas quando eu emulo nativo usando o expo-client a estilização nao funciona, alguma ideia?
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 👏🏼
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
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.
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: ruclips.net/video/fVEa8Hb9kg8/видео.htmlsi=rcJPinWSkqqsNK1y
Tem minhas recomendações, está bem completo.
@@orodrigogo Muito obrigado. Irei dar uma olhada hoje 🙏🏽
mano. faltou fazer o push para o git?
Tá na mão:
github.com/orodrigogo/nativecn-app
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. 🚀
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.
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.
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. =/
nossa cara que coisa linda vou mudar meu app 0o
tbm kk
🤩🤩🤩
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👍
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 🚀
o meu ta dando
Error running TailwindCSS CLI, please run the CLI manually to see the error.
:/
shadycêeneuai no reacty nativy...
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.
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
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. 🤩
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
Valeu!
Valeu demais 🤩
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?
quase infartei quando vi o titulo estava procurando um lib tipo shad
hahaha 🤩
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. 🚀
pai do céu. Achei que ja estava inscrito.. +1
Veeem, hehe
O que a galera tem usado pra estilização no react native atualmente?
Um top 5 hoje: Stylesheet, Nativewind, Tamagui, Restyle e gluestack-style
qual distro vc usa?
Estou utilizando popOS.
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
low-code é bem legal mesmo
Boa 🚀
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!
Rodrigo um App usando api de map do mapbox , app de taxi
Boa sugestão, hein. Daria um App massa aqui . Valeeeeu 🤩
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 🤗