Course Hive
Search

Welcome

Sign in or create your account

Continue with Google
or
Curso base de React Native 2025: #21 - Criando o componente de header
Play lesson

📱Curso base de React Native - React Native Completo: +78 Aulas do Zero à DOIS apps prontos - Curso base de React Native 2025: #21 - Criando o componente de header

4.0 (1)
23 learners

What you'll learn

This course includes

  • 25.5 hours of video
  • Certificate of completion
  • Access on mobile and TV

Summary

Keywords

Full Transcript

Precisa de ajuda? Solicite uma ajuda particular: https://forms.gle/Pu1aT2LsbU1nuTTDA Nessa aula do nosso curso Base de React Native, vamos dar um passo muito importante: transformar o protótipo em componentes reais dentro do nosso aplicativo. Chegou a hora de sair do papel e começar a ver as telas tomando forma diretamente no emulador. Vou te mostrar como estruturar a tela inicial em partes, separando o header, a listagem e o formulário, exatamente como no protótipo. Assim, você vai entender como pensar cada pedaço da interface como um componente reutilizável e bem organizado. O foco dessa aula está em criar o componente de header. Vamos construir ele do zero, estilizar de acordo com o protótipo e ainda torná-lo dinâmico, para que consiga exibir o nome do usuário de forma personalizada. Além disso, você vai aprender a configurar corretamente o background da aplicação através das rotas, garantindo que todas as telas sigam um padrão visual consistente. Essa é uma prática essencial para manter o app organizado e próximo do design planejado. Durante a implementação, também vamos trabalhar com propriedades no componente, aplicando boas práticas que facilitam a reutilização e deixam o código mais limpo. Você vai perceber que aos poucos o app começa a ganhar vida e identidade, aproximando cada vez mais o protótipo da realidade. Essa aula é fundamental para consolidar a ideia de como componentes e estilos se unem para formar a base sólida do seu aplicativo React Native. Links mencionados no vídeo: 🗨️ Discord - https://discord.gg/ZC7JrPZn7P 🎬 CodarSe - https://codarse.com 🖥️ Protótipo no Figma: https://www.figma.com/community/file/1542265508040591315 📖 Repositório: https://github.com/lvsouza/youtube-react-native-humor-tracker/tree/eb5d4c03edc612628fa456e96cfd912f70cd1606 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 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:20 | Avisos importantes 0:52 | Entendendo o protótipo 2:05 | Alterando o background color do app como um todo 3:46 | Criando o componente de Header 14:15 | Finalização e agradecimentos CODARSE - Componentizando o projeto #ReactNative #CursoReactNative #ReactNativeDoZero #CriarApp #DesenvolvimentoMobile #ReactNativeGratis #AppEmMinutos #JavaScript #ReactNativeTutorial #Expo #ProgramacaoMobile #ReactNativeBrasil #PrimeiroApp #MobileDeveloper #ReactNativeBeginner

Course Hive

Continue this lesson in the app

Install CourseHive on Android or iOS to keep learning while you move.

Related Courses

FAQs

Course Hive
Download CourseHive
Keep learning anywhere