ellenmariadev / checkout-page

Checkout Page - Wizzi Challenge

✈️ Wizzi Turismo Inteligente

Checkout de Viagem

O projeto exibe um formulário com os campos Datas Inserir Cidade(Origem/Desiton) Inserir Nº de Passageiros Nome E-mail e realiza a validações desses campos para confirmar o checkout. Saiba mais sobre os requisitos aqui.

Acesse o Layout 🎨

○ Deploy

Acesse o site aqui.

 
 Estrutura do Diretório 
 

src/
├─ app/ ——————————————————⇢ (Configurações do NextJS)
│  ├─ layout.tsx
│  ├─ page.tsx
│  └─ index.spec.jsx —————⇢ (Testes da Homepage)
├─ componentes/ ———————————⇢ (Componente + SASS + Test)
│  ├─ Button
│  │  ├─ index.jsx
│  │  └─ style.module.scss
│  ├─ Confirmation
│  │  ├─ index.jsx
│  │  ├─ index.spec.jsx
│  │  └─ style.module.scss
│  ├─ Count
│  │  ├─ index.jsx
│  │  ├─ index.spec.jsx
│  │  └─ style.module.scss
│  ├─ DatePicker
│  │  ├─ index.jsx
│  │  ├─ index.spec.jsx
│  │  └─ style.module.scss
│  ├─ DropdownCity
│  │  ├─ index.jsx
│  │  ├─ index.spec.jsx
│  │  └─ style.module.scss
│  ├─ Input
│  │  ├─ index.jsx
│  │  └─ style.module.scss
│  └─ index.js
├─ assets/
│   ├─ images
│   ├─ icons
│   └─ index.js
└─ sass/ ——————————————⇢ (Estilizações SASS)
   ├─ abstracts 
   ├─ base
   ├─ components
   └─ layouts

○ Tecnologias

 
 HTML 
  ⇢  
 CSS 
  ⇢  
 JavaScript 
  ⇢  
 SASS 
 

Framework/Bibliotecas

 
 React 
  ⇢  
 Next.js 
  ⇢  
 React Hook Form 
  ⇢  
 React Day Picker 
  ⇢  
 Jest 
  ⇢  
 Axios 
 

🎡 Rodando o projeto localmente

# Clone o repositório
$ git clone <https://github.com/ellenmariadev/checkout-page.git>

# Acesse a pasta do projeto no terminal/cmd
$ cd checkout-page

# Instale as dependências
$ npm install

# Execute a aplicação 
$ npm run dev

# Pronto para acessar 🎉
$ <http://localhost:3000>

🧪 Testes

Execute o comando de testes na pasta do projeto.

$ npm run test