Input de cartão de crédito com JS

Workshop

15 vídeos • 01:23:38

Seção 01 | Introdução

  1. 1.

    Introdução

    00:45
  2. 2.

    Requisitos do Projeto

    03:10
  3. 3.

    Iniciando o Projeto e limpando os arquivos

    03:05

Seção 02 | HTML

  1. 4.

    Criando a estrutura do HTML

    05:57

Seção 03 | CSS

  1. 5.

    CSS: Criando o Layout

    05:07
  2. 6.

    CSS: Estilizando o Cartão

    08:53
  3. 7.

    CSS: Estilizando o Formulário

    08:30

Seção 04 | JS e Interatividade

  1. 8.

    JS: Acessando os elementos HTML

    06:48
  2. 9.

    JS: Formatando o número do cartão

    09:19
  3. 10.

    JS: Transpondo outros campos para o cartão

    02:39
  4. 11.

    JS: Aceitando apenas dígitos numéricos

    03:02
  5. 12.

    Criando o verso do cartão

    07:15
  6. 13.

    Fazendo o verso aparecer automaticamente

    03:02
  7. 14.

    Animando a rotação do cartão

    07:18
  8. 15.

    Responsividade para Mobile

    08:48
Login
Workshops>Input de cartão de crédito com JS>Criando a estrutura do HTML

Acesso exclusivo para membros PRO

Esse conteúdo é exclusivo para nossos assinantes.

Libere esse e muito mais conteúdo assinando o Codante PRO.

Criando a estrutura do HTML

Desenvolvemos a estrutura HTML do projeto de um formulário de cartão de crédito reativo. Traduzimos o design do Figma para o VS Code, estruturando a interface do nosso projeto. Criamos seções para a tela de fundo, o cartão de crédito e o formulário, com detalhes como o título, entradas de dados com rótulos e placeholders para o número do cartão.

Comentários

(0)