Curso
React Native: Estilizando componentes
De nada adianta criamos um aplicativo com funcionalidades muito úteis, porém que não é claro para o usuário como utilizá-lo. Estilizar os componentes faz com que o usuário tenha uma experiência melhor para utilizar o seu aplicativo.
Esse curso inclui:
Suporte em tempo real
Certificado
Carga horária:
13 horas
Curso de React Native (10 aulas)
Aula 1 - Introdução
Muito se fala sobre a estilização de um aplicativo, mas o que realmente significa estilizar e porque isso é feito é o que vamos aprender nesta aula.
Aula 2 - Entendendo o exemplo
Para aprender a estilizar componentes, vamos criar o aplicativo que será visto nesta aula. Através dele vamos aprender a estilizar textos, imagens e definir os espaços entre cada um desses componentes.
Aula 3 - Estilizando um componente
No React Native existem duas formas de estilizar um componente: através do objeto StyleSheet ou inline. Nesta aula vamos relembrar esses conceitos.
Aula 4 - Definindo o tamanho e cor de fundo
Existem algumas formas de destacar um componente e uma delas é alterando a sua cor de fundo. Outra alteração que podemos fazer é definir um tamanho fixo para o componente.
Aula 5 - Definindo a borda
Em alguns casos queremos destacar uma caixa de texto, porém não queremos pintar o seu fundo. Uma alternativa para isso é definir uma borda para o componente.
Aula 6 - Definindo espaço entre componentes
Quando utilizamos componentes filhos para criar o componente pai notamos que eles ficam todos grudados uns nos outros. Para separá-los utilizamos as propriedades margin e padding que veremos nesta aula.
Aula 7 - Estilizando textos
Um título, um subtítulo, uma palavra em destaque ou então uma citação são textos. Para diferenciá-los entre si utilizamos algumas propriedades que veremos nesta aula.
Aula 8 - Flexbox
Posicionar componentes ao centro da tela verticalmente e horizontalmente, crescer o tamanho de um componente para preencher todo espaço da tela são algumas das propriedades flexbox que veremos nesta aula.
Aula 9 - Arquitetura do projeto
Conhecer a estrutura do nosso projeto bem como a divisão de arquivos e pastas e a forma como os componentes serão divididos é o assunto desta aula.
Aula 10 - Conhecendo nosso ponto de partida
Está quase na hora de começar a aplicar na prática os conceitos de estilização, mas antes vamos baixar e conhecer o projeto base que será usado neste curso.
Veja outros cursos de React Native
React Native: Consumindo APIs
React Native: Consumindo APIs Públicas de Terceiros
React Native: Usando Array.map e Array.filter