Thanks to visit codestin.com
Credit goes to github.com

Skip to content

lcslago/multistep-form

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

44 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Logo do projeto

Multi-step form

Página demonstrativa e funcional de um formulário em multiplas etapas. Fiz esse projeto com o intuito de pôr em prática os conceitos de customização e classes utilitárias no contexto de TailwindCSS e continuar meus estudos com JavaScript vanilla.

🔨 Funcionalidades

A página foi desenvolvida tanto para celulares, usando a metodologia Mobile first, quanto para desktops.

layout mobile do projeto   layout desktop do projeto

O modelo apresenta quatro etapas que vão desde o cadastro de uma senha até o sumário contendo um resumo do que foi preenchido no formulário. A etapa 1 apresenta um validador de senhas simplificado feito como pretexto para praticar expressões regulares. Também aproveitei para explorar a simplicidade e agilidade que o Tailwind oferece para implementar animações. No processo também aprendi a implementar cookies de forma segura à prova de injections.

campo obrigatório   mínimo oito caracteres   senha forte

Por fim, o projeto utiliza de session storage para armazenar dados de planos escolhidos que serão lidos e manipulados para página de sumário, experimente e veja como funciona!

📁 Acesso

O link de acesso está na descrição.

✔️ Técnicas e tecnologias usadas

  • ECMAScript 6
  • Manipulação do DOM
  • Paradígma de orientação a eventos
  • Programação funcional

About

Modelo de formulário de múltiplas etapas - HTML | Tailwind | Js

Resources

Stars

Watchers

Forks