Primeiras aulas do curso iOS Brasil : Formate datas, cpf e números nacionais

iOS Brasil : Formate datas, cpf e números nacionais

Construindo o layout do app - Introdução

Olá, boas-vindas ao curso de iOS da Alura! Você, que trabalha com desenvolvimento, provavelmente deve ter passado por alguma situação em que foi necessário validar algum tipo de formulário.

Nesse curso, trabalharemos juntos como validar alguns campos corriqueiros, que sempre encontramos em aplicativos de venda ou até mesmo em websites. Afinal, como validamos esses dados no Swift? Durante os estudos, consideraremos alguns campos de peculiaridades brasileiras, como CPF e CNPJ.

Iniciaremos a implementação do aplicativo Alura Ingressos, desde o início, e faremos a validação simples, na qual verificaremos se o formulário está preenchido ou não, antes de usuárias e usuários clicarem no botão "comprar", que submete o formulário.

Além disso, validaremos campo a campo, considerando a particularidade de cada um. Por exemplo, para o campo de e-mail devemos seguir um formato. No caso, utilizaremos um Regex, para validar o formato.

Na sequência, trabalharemos com algumas bibliotecas externas, utilizando um gerenciador de dependências. Sendo assim, instalaremos o CocoaPods no nosso projeto e, depois, instalaremos algumas bibliotecas para fazer as validações.

Para validar o CPF utilizaremos uma biblioteca e para validar o CEP faremos uma requisição para API do ViaCEP. Então, usuárias e usuários digitarão o CEP, por meio do qual o aplicativo obterá o endereço de residência. Por exemplo, se digitarmos o CEP da Caelum, será feita uma requisição para o ViaCEP e os campos de Endereço e Bairro serão preenchidos, automaticamente. Conseguiremos estabelecer essa requisição por meio de uma biblioteca chamada Alamofire.

Após a verificação do CEP, passaremos para a parte de validação do número de cartão de crédito, com a qual confirmaremos se o número inserido está correto ou não.

Por último, entenderemos como trabalhar com moeda no aplicativo, estudando qual o melhor tipo de variável para guardar um valor monetário e também formatar esse tipo de moeda, considerando se queremos o formato brasileiro (R$) ou o formato americano (U$). Para isso, instalaremos uma biblioteca, a partir da qual conseguiremos formatar o tipo de moeda.

Aguardo você para iniciarmos os estudos!

Construindo o layout do app - Iniciando a implementação do app

Vamos iniciar a implementação do nosso aplicativo? Começaremos criando um projeto no Xcode, selecionando a opção "Create a new Xcode projetct", no painel inicial do programa.

Na janela que abrirá, manteremos "Single View Application" selecionada e pressionaremos o botão "Next".

Na janela seguinte, nomearemos nosso aplicativo como Alura Ingressos e clicaremos em "Next". Isso nos levará a uma janela de seleção de diretório, na qual poderemos clicar em "Create".

Primeiro, montaremos a interface (UI) do nosso aplicativo e, depois, seguiremos para a validação de formulário — CPF, CNPJ, entre outros — e consulta de endereço a partir de CEP. Ou seja, trabalharemos a parte de validação somente após montarmos a interface da app.

Vamos clicar em Main.storyboard, no painel à esquerda. Repare que o "View Controller", que vem por default, já estará na tela.

Olharemos a interface de referência para ter uma ideia de como o aplicativo deve ficar e, então, copiar os elementos.

Alguns elementos já são reconhecidos, como:

A partir disso, montaremos a interface da nossa app. O primeiro elemento que vamos inserir é a View amarela, encontrada no topo da tela. Sendo assim, no menu localizado no canto inferior direito, procuraremos por uma View, digitando view no filtro (Filter, em inglês).

Após encontrá-la, iremos arrastá-la para o "View Controller" e ajustaremos as margens a ele. Feito isso, ajustaremos a altura, de acordo com as especificações da referência, acionando o ícone de régua (na vertical), encontrado canto superior direito do painel à direita. Alteraremos Height de 128 para 20.

Na sequência, alteraremos o Background, ou seja, a cor de fundo da View. Para isso, clicaremos no ícone à esquerda da régua.

Utilizaremos o RGB (240, 200, 60) que foi fornecido na referência. Para alterar, clicaremos no retângulo azul à direita da cor selecionada (White Color), em Background, e selecionaremos a última opção, "Other...".

No quadro de cores (Colors) que se abrirá, setaremos o RGB de acordo com o que pegamos da referência:

Com a view criada, setaremos algumas Constraints, clicando no respectivo ícone — terceiro da esquerda para a direita no canto do rodapé da tela central —, para fixá-la nas margens da nossa aplicação.

Na Alura, você encontra cursos específicos de iOS layout. A primeira parte aborda Stack View, enquanto a segunda parte aborda Constraints.

Caso ainda não tenha visto esses cursos, fica a recomendação para aprofundamento no assunto.

De volta ao ajuste de Constraints, acionaremos as de margens esquerda, direita e topo. Além disso, marcaremos a caixa de seleção de "Height". Feito isso, clicaremos em "Add 4 Constraints" ao final do quadro de "Add New Constraints".

Agora, podemos seguir para o próximo elemento, que também é uma View, com altura (Height) definida como 100. Sendo assim, repetiremos o procedimento da primeira, selecionando e arrastando uma View, do quadro no canto inferior direito para o View Controller.

Em seguida, clicaremos no ícone de régua e configuraremos Height como 100. Feito isso, clicaremos no ícone à esquerda da régua e alteraremos o Background, de acordo com os dados da referência:

Com o RGB configurado, vamos ajustar as margens da View às do View Controller e aplicaremos as Constraints, acionando as mesmas opções da primeira (esquerda, direita, topo e "Height"). Assim, obteremos:

View amarela no topo, com ícone de status de bateria no canto direito. Abaixo uma View maior, colorida com cor escura, quase preta.

Há uma imagem na referência que estamos consultando, mas a aplicaremos adiante. Continuaremos adicionando uma Label. Para isso, digitaremos label no filtro (Filter) de Object Library, no canto inferior direito. Ao localizá-la, a arrastaremos para o View Controller, abaixo da segunda View.

Feito isso, aumentaremos o tamanho dela, arrastando as bordas laterais (esquerda e direita) até acionar a marcação das réguas.

No painel direito, ativaremos a opção de centralizar o texto e substituiremos o texto Label por Informações da sua compra, que formataremos de acordo com as especificações:

Para isso, clicaremos no quadrado com a letra "T" no centro, localizado no canto esquerdo de "Font".

Ao clicar nesse botão, abriremos uma caixa de configuração de texto, que ficará da seguinte forma:

Font: Custom; Family: Arial; Style: Regular; Size: 17

Na sequência, centralizaremos a Label em relação aos outros elementos, utilizando as Constraints. Para isso, acionaremos o segundo botão, da esquerda para a direita, no rodapé da tela central, na qual está o View Controller. Após clicar nele, ativaremos a opção "Horizontally in Container" e pressionaremos "Add 1 Constraint".

Feito isso, acionaremos o botão à direita para setar uma Constraint de topo.

Beleza! Vamos dar um update frame, clicando em "View Controller Scene", no painel esquerdo. Em seguida, pressionaremos o triângulo amarelo à direita de "Informações da sua compra". No quadro que se abrirá, clicaremos em "Fix Misplacement".

Assim, montamos o header do aplicativo. Para montar o que falta, podemos utilizar um Stack View, digitando stack, em Filter de Object Library. Obteremos 2 resultados na busca: "Horizontal Stack View" e "Vertical Stack View". Como queremos empilhar os elementos, posicionando um abaixo do outro, utilizaremos a opção "Vertical Stack View", clicando e arrastando-a para o View Controller.

Ajustaremos o Stack View, arrastando as bordas laterais (esquerda e direita) até o acionamento das marcações de régua.

Após ajustar as bordas, prenderemos o Stack View em relação à Label de cima, clicando no terceiro botão, da esquerda para a direita, do rodapé da tela central, e acionando as Constraints da esquerda, do topo e da direita.

Em seguida, clicaremos em "Add 3 Constraints". Essa ação desencadeará um pequeno erro (as bordas do Stack View ficarão vermelhas, em vez de pretas), porque é necessário algum elemento para preencher o conteúdo, mas não tem problema, pois adicionaremos elementos ao Stack View, logo na sequência.

Seguindo a referência, adicionaremos uma pequena View, a que tem altura (Height) de apenas 5.0 e que aparece novamente um pouco mais abaixo.

Procuraremos por View novamente no filtro de Object Library, selecionaremos e a arrastaremos para o Stack View. Após soltá-la, precisaremos setar uma Constraint de altura, ativando Height e configurando-a de acordo com a referência, inserindo 5.

Adicionaremos a Constraint, clicando em "Add 1 Constraint" e colocaremos um Background para ela. A cor de fundo será igual à da segunda View que adicionamos. Sendo assim, para agilizar, clicaremos no retângulo azul do canto direito, para abrir as opções de Background e selecionaremos o tom escuro do canto esquerdo, na faixa de Recently Used Colors, referente ao tom que utilizamos recentemente.

O próximo elemento é uma imagem, uma Image View, com altura de 130.0, que também adicionaremos ao Stack View. Da mesma forma que fizemos com os outros, buscaremos por image no filtro de Object Library, selecionaremos e arrastaremos Image View para o Stack View.

É importante tomarmos cuidado, pois o Stack View ficou do mesmo tamanho da View que inserimos anteriormente, ou seja, está com altura de 5.0. Podemos soltar a Image View na parte branca, abaixo da View, mas ela não estará dentro do Stack View. Precisamos arrastá-la prestando atenção à indicação de que está dentro do Stack.

Com a imagem posicionada no devido local, configuraremos a altura dela como 130.

Adiante, setaremos a imagem. Primeiro, vamos arrastar todos os elementos. Sendo assim, adicionaremos três Labels:

Note que as três possuem mesma formatação:

Portanto, buscaremos novamente por label em Object Library e arrastaremos o resultado para dentro do Stack. Feito isso, aplicaremos as devidas configurações do texto, no painel direito, em "Font", que ficará da seguinte forma:

Font: Custom; Family: Avenir; Style: Heavy; Size: 14

Em seguida, alteraremos a cor. Ao consultar o RGB, constataremos que já utilizamos esse tom. Sendo assim, clicaremos no retângulo azul, no canto direito da opção "Color", no painel direito, para aplicar a alteração, selecionando a primeira cor, da esquerda para a direita, de Recently Used Colors.

Aplicadas as devidas configurações em uma Label, podemos fazer cópias a partir dela e setar a propriedade Text nos outros elementos. Assim, poupamos o trabalho de formatar exatamente igual, diferentes textos. Para fazer as cópias, basta selecionar a Label que acabamos de configurar — é possível clicar nela, tanto no storyboard, quanto no View Controller —, manter a tecla "Option" pressionada, clicar e arrastar o mouse para baixo, até obter 2 cópias. Pronto! Temos 3 Labels devidamente formatadas. Vamos setar o texto delas?

Selecionaremos Label por Label para configurar "Text", no painel direito, de acordo com o que temos na referência. Sendo assim, de cima para baixo, disponibilizaremos as seguintes informações:

Assim, concluímos a formatação dessas Labels. Agora, falta adicionarmos mais algumas e alguns Text Fields. A próxima Label é de "1.Suas informações", que possui uma View embaixo, igual à que inserimos anteriormente, de altura 5.0. Podemos fazer uma cópia dela, mas antes adicionaremos uma View e editaremos a propriedade Text dela, inserindo 1.Suas informações. Formataremos o texto, de acordo com as especificações, que são as mesmas que utilizamos na primeira Label:

Na sequência, faremos a cópia da View de altura 5.0, selecionando-a, pressionando a tecla "Option", clicando e arrastando o mouse para baixo, até posicioná-la abaixo da Label que acabamos de configurar.

Os próximos elementos incluem Labels e Text Fields intercalados. Então, podemos criar e formatar um de cada e, depois, fazer as cópias necessárias.

Arrastaremos uma Label, de Object Library para Stack View, e depois procuraremos por text field para fazer o mesmo com ele, arrastando-o para baixo da Label que acabamos de adicionar.

Os textos que trabalharemos a seguir, devem ser formatados da seguinte forma:

Selecionaremos a Label para aplicar as devidas configurações e editaremos a propriedade de "Text" para "Nome completo". Feito isso, podemos clicar nela e em "Text Field" juntos, para fazer as cópias, pressionando a tecla "Option" e arrastando-os para baixo, até obter 3 cópias, ou 4 conjuntos de Label e Text Fields no total.

Em seguida, editaremos as propriedades de Text das Labels, inserindo os seguintes textos, na respectiva ordem:

Até o momento, nosso View Controller está da seguinte forma:

View amarela no topo, com ícone de status de bateria no canto direito. Abaixo uma View maior, colorida com cor escura, quase preta. Abaixo, a Label "Informações da sua compra". Abaixo, uma View fina, no mesmo tom da segunda, funciona como uma linha divisória. Abaixo, a Image View, sem a imagem. Abaixo, as três Labels, de "Local", "Endereço" e "Preço". Abaixo, outra Label de "1. Suas informações. Abaixo, outra View fina, que funciona como linha divisória, igual a encontrada acima. Abaixo, os conjuntos de Label e Text Fields intercalados, organizados na seguinte ordem: "Nome completo", "E-mail", "CPF" e "CEP"

Vamos rodar a aplicação para ter uma ideia de como está ficando? Antes, na barra superior da tela, clicaremos em "iPhone 7 Plus", à direita de "Alura Ingressos", e alteraremos para "iPhone 7". Na sequência, daremos um Build, clicando no botão de "Play", localizado à esquerda, para rodar.

Legal! Na execução, constataremos que todos os elementos que inserimos, estão ficando iguaizinhos ao gabarito. Adiante, continuaremos adicionando as imagens e os Text Fields restantes.

Construindo o layout do app - Construindo o layout do app

Continuando o desenvolvimento da nossa app, o próximo elemento que vamos adicionar é o Text Field de "Endereço" e "Bairro".

Para isso, vamos continuar copiando as Labels e Text Fields que adicionamos e formatamos anteriormente. Selecionaremos "CEP" e, com a tecla "Shift" pressionada, selecionaremos o Text Field abaixo dele também. Replicaremos, pressionando a tecla "Option" e arrastando os dois itens para baixo com o mouse. Ao obtermos 2 cópias, renomearemos as Labels: uma como "Endereço" e a outra como "Bairro".

Os próximos elementos são de cartão de crédito, então temos:

Para implementar os itens da parte de cartão de crédito, podemos aproveitar o título de "1. Suas informações", que utilizamos anteriormente, e renomeá-lo. Sendo assim, faremos uma cópia, novamente, selecionando a Label, pressionando a tecla "Option" e arrastando-a para o final da lista de "View", no painel esquerdo.

Feito isso, note que estranho: estamos gerando cópias, mas não é possível visualizá-las. Por que será? Isso acontece porque estamos utilizando um espaço além do que o View Controller oferece. Nesse caso, podemos aumentar esse espaço, selecionando o View Controller, clicando no ícone de régua (Show the Size Inspector), no canto superior direito, e alterar a propriedade Simulated Size de "Fixed" para "Freeform".

Assim, conseguiremos ajustar a altura (Height) do View Controller. Vamos configurar com 980, por exemplo. Legal! Repare que já ganhamos um pouco mais de espaço no View Controller para continuar a implementação.

Bacana! Sendo assim, vamos continuar com a edição da cópia da Label que adicionamos anteriormente. Alteraremos a propriedade Text dela para 2. Cartão. Embaixo, colocaremos a imagem que possui altura (Height) de 45.0 e, abaixo dela, um Text Field para o número do cartão.

Sendo assim, buscaremos por image no filtro de Object Library, e arrastaremos o resultado para o Stack View. Já vamos aproveitar para setar uma Constraint com altura de 45, clicando no terceiro ícone, da esquerda para a direita, do rodapé da tela central. Em seguida, ativaremos "Height" e alteraremos o valor, de 128 para 45.

Embaixo da Image View, vamos adicionar um Text Field, buscando por ele na Object Library e arrastando-o para o Stack View. Como esse campo será para "número de cartão", já podemos preencher a propriedade Placeholder, no painel direito, digitando número do cartão. Assim, sinalizamos o local em que o número do cartão deve ser inserido.

Abaixo, teremos uma Label para "Vencimento" e, à direita dela, teremos outra para "Cód. Seg.". Ou seja, precisaremos utilizar mais de um Stack View para dividir esse espaço, pois teremos dois Text Fields para "Vencimento" — um para mês (MM) e outro para ano (AA) — e outro Text Field para "Cód. Seg." (Código de Segurança).

Solucionaremos esse problema com outro Stack View, no caso, o "Horizontal Stack View". Faremos a busca na Object Library e arrastaremos o resultado desejado ("Horizontal Stack View") para baixo do Text View de "número de cartão".

Feito isso, já podemos mudar a distribuição dele, para que os próximos elementos fiquem distribuídos igualmente no Stack View. Para isso, selecionaremos o "Horizontal Stack View" que acabamos de adicionar e, no painel direito, alteraremos a propriedade Distribution, de "Fill" para "Fill Equally".

Dentro desse Stack View, adicionaremos mais dois do tipo "Vertical Stack View". É importante conferir no painel esquerdo se esses dois Stacks estão na mesma estrutura hierárquica. Provável que o último inserido não esteja. Nesse caso, basta selecioná-lo e arrastá-lo para a esquerda, de modo que fique alinhado ao de cima.

Com os Stacks devidamente posicionados, podemos adicionar as Labels. Para fazer a inserção com mais precisão, podemos arrastar a Label da Object Library para o primeiro Stack View, dentro do Horizontal Stack View.

A primeira Label será de "Vencimento", sendo assim, após adicioná-la, podemos alterar a propriedade Text dela para Vencimento. Para agilizar, podemos fazer uma cópia da Label de "Vencimento", selecionando-a, pressionando a tecla "Option" e arrastando-a para a outra Vertical Stack View, dentro da Horizontal Stack View. Com a cópia pronta, editaremos a propriedade Text dela, substituindo Vencimento por Cód. Seg..

Embaixo da Label de "Vencimento", adicionaremos dois Text Fields, então precisamos adicionar mais um Horizontal Stack View. Clicaremos e arrastaremos um da Object Library para baixo da Label de "Vencimento". Mudaremos, novamente a distribuição (Distribution) dele para "Fill Equaly" e, na sequência, adicionaremos mais dois Text Fields, dentro dele. Para facilitar, podemos fazer uma cópia do Text Field que acabamos de inserir, clicando nele e arrastando-o para baixo, com a tecla "Option" pressionada.

Agora, falta colocarmos um Text Field para "Cód. seg.". Para isso, pegaremos um da Object Library e arrastaremos para baixo da Label de "Cód. Seg". Lembrando que esses devem ficar na mesma hierarquia.

Vamos inserir os Placeholders para que usuárias e usuários saibam o que devem digitar nos Text Fields? O primeiro, abaixo de "Vencimento", é de mês, então utilizaremos MM. Ao lado, é de ano, portanto preencheremos com AA. Deixaremos o alinhamento desses Placeholders como Centralizado.

Legal! Continuando, abaixo do que acabamos de inserir, temos um Text Field para que usuárias e usuários escolham o número de parcelas. Então, vamos adicionar mais um Text Field, pegando e arrastando-o da Object Library para o Stack View. Configuraremos o Placeholder como número de parcelas. Podemos digitar 3 dígitos no Placeholder de "Cód. Seg.", para indicar quantos dígitos devem ser inseridos.

Feito isso, partiremos para a parte de confirmação, na qual temos uma Label, uma View e outra Label, que informa em quantas vezes a conta foi parcelada. De novo, duplicaremos a Label de "2. Cartão", junto à View, selecionando ambas e arrastando-as para baixo do Text Field de "número de parcelas", com a tecla "Option" pressionada.

Adaptaremos o texto, clicando na cópia da Label de cartão e digitando 3. Confirmação na propriedade Text dela. Em seguida, adicionaremos a View, buscando-a na Object Library e arrastando-a para baixo dos últimos elementos que inserimos. Configuraremos essa View de acordo com as especificações:

Começaremos setando a altura, clicando no terceiro ícone da esquerda para a direita, no rodapé da tela central, ativando a opção "Height" e alterando o valor de 128 para 40. Em seguida, clicaremos em Background, no painel direito, e selecionaremos "Other..." para configurar o RGB da seguinte forma:

Com o Background configurado, podemos copiar a Label de "Bairro", selecionando-a e arrastando-a para o centro da View que configuramos agora, com a tecla "Option" pressionada. Alteraremos a propriedade Text para 12x R$16.58 (ou R$199,00 à vista).

Por último, adicionaremos um botão. Para isso, em Object Library, procuraremos por button e arrastaremos a opção "Button" para baixo da última View. Vamos mudar o Background dele para verde, configurando o RGB de acordo com as especificações:

E alteraremos o texto da propriedade Title do Button, no painel direito, para Comprar. Aproveitaremos para mudar a cor da fonte também, clicando em Text Color e selecionando "White Color".

Assim, terminamos o Layout da nossa app. Vamos rodar para conferir como ficou? Iremos gerar um Build, clicando no botão de "Play" no canto superior esquerdo. Bacana! Toda a implementação que fizemos está bastante parecida com o gabarito que estamos seguindo. Porém, falta inserirmos as imagens. Sendo assim, vamos inseri-las.

Começaremos pelo logo da app, procurando por image no filtro de Object Library. Clicaremos e arrastaremos a "Image View" para o Header.

Na sequência, vamos alterar o tamanho dela, acionando o ícone de régua, no canto superior direito, do painel direito. Alteraremos algumas dimensões, deixando:

Após redimensionar, posicionaremos a Image View no centro da segunda View de cima para baixo. Carregaremos a imagem digitando logo_alura, na propriedade Image, no painel direito, e teclando "Enter".

Clicando no link a seguir, você acessa a atividade na qual as imagens foram disponibilizadas para download.

Após o download, basta colocar as imagens no projeto e setar, conforme a necessidade.

Agora, vamos setar umas Constraints de alinhamento na imagem do logo. Clicaremos nela e, depois, acionaremos o segundo ícone, da esquerda para a direita, do rodapé da tela central. Isso abrirá o quadro de "Add New Alignment Constraints", no qual ativaremos as opções "Horizontally in Container" e "Vertically in Container" e clicaremos em "Add 2 Constraints".

Em seguida, acionaremos o ícone à direita, abrindo o quadro de "Add New Constraints", configuraremos um tamanho fixo para ela — ativando as opções de "Width" e "Height" — e confirmaremos a adição das duas Constraints.

Para adicionar a imagem seguinte, clicaremos na respectiva Image View e digitaremos banner em Image, no topo do painel direito. Selecionada a imagem, teclaremos "Enter". A próxima imagem é a de bandeiras_cartoes, que adicionaremos seguindo o mesmo procedimentos das duas anteriores.

Com as imagens adicionadas, que tal rodar a app de novo? Vamos gerar um Build, clicando no botão de "Play" no canto superior esquerdo. Aguardaremos e obteremos um resultado legal! Nossa aplicação está quase igual à do gabarito.

Falta ajustarmos alguns espaçamentos e adicionar um Scroll View para ter acesso aos elementos que estão embaixo e que não conseguimos visualizar. Lembrando que aumentamos a altura do View Controller para inserir todos os elementos; no entanto, sem o Scroll View, não é possível visualizá-los. Sendo assim, adiante, vamos implementá-lo.

Sobre o curso iOS Brasil : Formate datas, cpf e números nacionais

O curso iOS Brasil : Formate datas, cpf e números nacionais possui 164 minutos de vídeos, em um total de 41 atividades. Gostou? Conheça nossos outros cursos de iOS em Mobile, ou leia nossos artigos de Mobile.

Matricule-se e comece a estudar com a gente hoje! Conheça outros tópicos abordados durante o curso:

Aprenda iOS acessando integralmente esse e outros cursos, comece hoje!

  • 1150 cursos

    Cursos de programação, UX, agilidade, data science, transformação digital, mobile, front-end, marketing e infra.

  • Certificado de participação

    Certificado de que assistiu o curso e finalizou as atividades

  • App para Android e iPhone/iPad

    Estude até mesmo offline através das nossas apps Android e iOS em smartphones e tablets

  • Projeto avaliado pelos instrutores

    Projeto práticos para entrega e avaliação dos professores da Alura com certificado de aprovação diferenciado

  • Acesso à Alura Start

    Cursos de introdução a tecnologia através de games, apps e ciência

  • Acesso à Alura Língua

    Reforço online de inglês e espanhol para aprimorar seu conhecimento

Premium

  • 1150 cursos

    Cursos de programação, UX, agilidade, data science, transformação digital, mobile, front-end, marketing e infra.

  • Certificado de participação

    Certificado de que assistiu o curso e finalizou as atividades

  • App para Android e iPhone/iPad

    Estude até mesmo offline através das nossas apps Android e iOS em smartphones e tablets

  • Projeto avaliado pelos instrutores

    Projeto práticos para entrega e avaliação dos professores da Alura com certificado de aprovação diferenciado

  • Acesso à Alura Start

    Cursos de introdução a tecnologia através de games, apps e ciência

  • Acesso à Alura Língua

    Reforço online de inglês e espanhol para aprimorar seu conhecimento

12X
R$75
à vista R$900
Matricule-se

Premium Plus

  • 1150 cursos

    Cursos de programação, UX, agilidade, data science, transformação digital, mobile, front-end, marketing e infra.

  • Certificado de participação

    Certificado de que assistiu o curso e finalizou as atividades

  • App para Android e iPhone/iPad

    Estude até mesmo offline através das nossas apps Android e iOS em smartphones e tablets

  • Projeto avaliado pelos instrutores

    Projeto práticos para entrega e avaliação dos professores da Alura com certificado de aprovação diferenciado

  • Acesso à Alura Start

    Cursos de introdução a tecnologia através de games, apps e ciência

  • Acesso à Alura Língua

    Reforço online de inglês e espanhol para aprimorar seu conhecimento

12X
R$100
à vista R$1.200
Matricule-se

Max

  • 1150 cursos

    Cursos de programação, UX, agilidade, data science, transformação digital, mobile, front-end, marketing e infra.

  • Certificado de participação

    Certificado de que assistiu o curso e finalizou as atividades

  • App para Android e iPhone/iPad

    Estude até mesmo offline através das nossas apps Android e iOS em smartphones e tablets

  • Projeto avaliado pelos instrutores

    Projeto práticos para entrega e avaliação dos professores da Alura com certificado de aprovação diferenciado

  • Acesso à Alura Start

    Cursos de introdução a tecnologia através de games, apps e ciência

  • Acesso à Alura Língua

    Reforço online de inglês e espanhol para aprimorar seu conhecimento

12X
R$120
à vista R$1.440
Matricule-se
Procurando planos para empresas?
Acesso por 1 ano
Estude 24h/dia onde e quando quiser
Novos cursos toda semana