Curso base de React Native 2025: #51 - Criando componente de BUTTON
Автор: Lucas Souza Dev
Загружено: 2025-12-30
Просмотров: 35
Precisa de ajuda? Solicite uma ajuda particular: https://forms.gle/Pu1aT2LsbU1nuTTDA
Nessa aula do nosso curso Base de React Native, vamos colocar a mão na massa para criar os botões que vão dar vida às nossas interfaces. Vamos começar pelo botão Primary, totalmente estilizado e pronto para uso, explorando conceitos como tipagem em TypeScript, Pressable do React Native e integração com nosso tema de cores. Vou te mostrar cada detalhe, desde a criação do componente até os ajustes de padding, tamanho, fonte e arredondamento, garantindo que o botão fique fiel ao protótipo e pronto para qualquer tela do nosso aplicativo.
Depois de criar o Primary, vamos expandir para o botão Outline, entendendo como construir variantes de componentes com bordas e cores diferentes, mantendo a consistência visual do app. Durante o processo, vamos lidar com comportamentos interativos, como efeito de pressão e opacidade, mostrando como controlar estados dentro do componente e reutilizar o código de forma inteligente. Essa é uma oportunidade de aprender técnicas práticas para desenvolver componentes escaláveis e personalizáveis, essenciais para qualquer projeto profissional em React Native.
Ao final da aula, você terá uma base sólida de botões prontos para usar em qualquer parte da aplicação, com aparência e comportamento consistentes, além de conhecimento para criar novas variações de forma rápida. Essa aula é perfeita para quem quer acelerar o desenvolvimento de interfaces, entender como organizar componentes reutilizáveis e dominar detalhes de estilo e interação que fazem diferença na experiência do usuário. Com isso, você estará um passo à frente na construção de apps profissionais em React Native.
Links mencionados no vídeo:
🗨️ Discord - / discord
🎬 CodarSe - https://codarse.com
🖥️ Protótipo no Figma: https://www.figma.com/community/file/...
📖 Repositório: https://github.com/lvsouza/youtube-re...
🎮 App na Google Play: https://play.google.com/store/apps/de...
Outros cursos no canal:
🎩 Figma para DEVs - • Figma para DEVs: #00 - Apresentação do curso
☪️ Curso de estilização no React - • Estilização no React: Aula 00 - Curso de f...
💎 Curso base de React - • Curso base de React 2025: #00 - Apresentaç...
👑 React, Material UI 5 e Typescript - • React, Material UI 5 e Typescript: #00 - I...
🏆 Curso de API Rest, Node e Typescript - • API Rest, Node e Typescript: #00 - Apresen...
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
Meu setup:
📺 Monitor 24: https://amzn.to/4msD7TY
🤖 Processador: https://amzn.to/4oJLZpN
🎧 Fone bluetooth: https://amzn.to/4lESd7r
⌨️ Teclado e mouse: https://amzn.to/4oPdgHu
💪 Suporte articulado: https://amzn.to/41hIrRE
Conteúdo:
0:00 | Introdução da aula
0:25 | Avisos importantes
0:34 | Entendendo a variação dos botões
1:30 | Criando o botão de primary contained
7:50 | Criando botão outlined com variação de cores
14:23 | Finalização e agradecimentos
CODARSE - Componentização com React Native
#ReactNative #CursoReactNative #ReactNativeDoZero #CriarApp #DesenvolvimentoMobile #ReactNativeGratis #AppEmMinutos #JavaScript #ReactNativeTutorial #Expo #ProgramacaoMobile #ReactNativeBrasil #PrimeiroApp #MobileDeveloper #ReactNativeBeginner
Доступные форматы для скачивания:
Скачать видео mp4
-
Информация по загрузке: