Course Hive
Search

Welcome

Sign in or create your account

Continue with Google
or
Curso base de React Native 2025: #54 - Criando componente de MatchListItem
Play lesson

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

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 Nesta aula, Dev, a gente vai mergulhar de cabeça na construção do componente de listagem de histórico de partidas para o nosso app em React Native. Vamos organizar a estrutura do componente, criar as props necessárias, trabalhar com diferentes status de partida, rounds e modos de jogo, e garantir que tudo fique bem modularizado dentro da página home. Você vai ver na prática como planejar e estruturar componentes reutilizáveis, usando TypeScript para garantir segurança de tipos e clareza no código, enquanto preparamos o terreno para montar as telas do app de forma consistente. A gente também vai cuidar da estilização e da interação do componente. Você vai aprender a usar layouts horizontais e verticais, aplicar espaçamentos, cores dinâmicas e ícones que mudam conforme o status da partida. Além disso, vamos configurar eventos de clique com Pressable, permitindo que cada item da lista tenha comportamento interativo, exatamente como no protótipo. Durante a aula, você vai perceber como pequenas decisões de design de código fazem toda a diferença para que a interface fique responsiva e funcional. Por fim, vamos preparar o componente para uso prático na aplicação, pensando em escalabilidade e reutilização. Você vai ver como lidar com listas dinâmicas, exibir informações de rounds e status corretamente, e configurar divisores visuais entre itens para deixar a interface limpa e intuitiva. Ao final desta aula, você terá um componente robusto e pronto para integrar nas telas do app, além de dominar técnicas essenciais para desenvolver interfaces complexas de forma organizada e eficiente. Links mencionados no vídeo: 🗨️ Discord - https://discord.gg/ZC7JrPZn7P 🎬 CodarSe - https://codarse.com 🖥️ Protótipo no Figma: https://www.figma.com/community/file/1543675168225105299 📖 Repositório: https://github.com/lvsouza/youtube-react-native-forca-play/tree/971d5b1951d0a77b65cdd0adb62d267095a272c4 🎮 App na Google Play: https://play.google.com/store/apps/details?id=com.lvsouzadev.forcaplay 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:21 | Avisos importantes 0:48 | Entendendo o que será feito 2:00 | Criando componente para MatchListItem 25:30 | 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

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