/explorer-lab-rocketpay

O Rocketpay é um componente que simula o formulário de preenchimento de cartão de crédito, onde é possível adicionar máscara aos inputs e atualizar elementos HTML via DOM.

Primary LanguageJavaScriptMIT LicenseMIT

RocketPay

rocketpay

License Forks Stars


💻 Projeto

RocketPay O Rocketpay é um componente que simula o formulário de preenchimento de cartão de crédito, onde é possível adicionar máscara aos inputs e atualizar elementos HTML via DOM. Esse é a 1º edição do Explorer Lab evento produzido pela Rocketseat nos dias 17 à 19 de outubro.

  • Explorer Lab Abertura | JS DOM
  • Explorer Lab Aula 01 | Construindo as bases e explorando O JS DOM
  • Explorer Lab Aula 02 | Profissionanlizando seu projeto
  • Explorer Lab Aula 03 | Ampliando seu portfólio + próximos passos
  • Explorer Lab After | Explorer Career | A carreira dev vista por dentro

🧪 Tecnologias

Esse projeto foi desenvolvido com as seguintes tecnologias:

🚀 Instalação

  # Clone o repositório e entre na pasta do projeto
  $ git clone https://github.com/RayanneRamos/explorer-lab-rocketpay.git
  $ cd explorer-lab-rocketpay

  # Instale as dependências
  $ npm install
  # ou
  $ yarn install

  # Execute a aplicação
  $ npm run dev
  # ou
  $ yarn start

Abra http://localhost:3000 no seu navegador para ver a aplicação rodando!

🔖 Layout

🔥 Desafios

  • Criar o cartão American Express, sua máscara e seu Regex
  • Criar o cartão Discover, sua máscara e seu Regex
  • Criar o cartão Diners, sua máscara e seu Regex
  • Criar o cartão JBC, sua máscara e seu Regex
  • Criar o cartão Maestro, sua máscara e seu Regex
  • Criar o cartão UnionPay, sua máscara e seu Regex
  • Criar o cartão Nubank, sua máscara e seu Regex
  • Criar o cartão BMG, sua máscara e seu Regex
  • Criar o cartão Elo, sua máscara e seu Regex
  • Criar o cartão Hipercard, sua máscara e seu Regex
  • Criar o cartão Alelo, sua máscara e seu Regex
  • Criar o cartão Paypal, sua máscara e seu Regex
  • Criar o cartão Itaú, sua máscara e seu Regex
  • Criar o cartão Bradesco, sua máscara e seu Regex
  • Criar o cartão Santander, sua máscara e seu Regex
  • Criar o cartão Banco do Brasil, sua máscara e seu Regex
  • Criar o cartão Caixa Ecônomica, sua máscara e seu Regex
  • Criar o cartão HSBC, sua máscara e seu Regex
  • Criar o cartão Crefisa, sua máscara e seu Regex
  • Criar o cartão Citibank, sua máscara e seu Regex
  • Criar o cartão Inter, sua máscara e seu Regex
  • Criar o cartão C6 Bank, sua máscara e seu Regex
  • Criar o cartão Next, sua máscara e seu Regex
  • Criar o cartão Neon, sua máscara e seu Regex

📝 Licença

Este projeto está licenciado sob a Licença MIT. Veja o arquivo LICENSE para obter mais detalhes.

Criado by Rayanen Ramos