Este projeto implementa um CRUD (Create, Read, Update, Delete) de endereços utilizando Vue 2, Vuex, Axios e Vuetify. O projeto é modularizado para facilitar a manutenção e a escalabilidade.
- Node.js v12.22.1 ou superior
- Vue.js v2.6.11 ou superior
- Vuex v3.6.2 ou superior
- Vue Router v3.6.5 ou superior
- Vuetify v2.6.0 ou superior
- Axios v1.6.8 ou superior
- Moment.js v2.30.1 ou superior
Para configurar o projeto em seu ambiente local, siga os passos abaixo:
-
Clone este repositório para o seu ambiente local:
git clone https://github.com/mkamaroski1/front-end-teste.git
-
Navegue até o diretório do projeto:
cd front-end-teste -
Instale as dependências do projeto:
npm install
-
Inicie o servidor de desenvolvimento:
npm run serve
npm run serve: Inicia o servidor de desenvolvimento.npm run build: Compila a aplicação para produção.npm run lint: Executa o linting nos arquivos do projeto.npm run test: Executa os testes unitários com Jest.
├── index.html
├── main.js
├── api
│ └── ... # abstrações para fazer requisições a API
├── components
│ ├── App.vue
│ └── ...
├── i18n
│ └── index.js # configuração do Vue I18n
├── router
│ └── index.js # configuração do Vue Router
├── store
│ ├── index.js # onde montamos os módulos e exportamos o store
│ ├── actions.js # ações raiz
│ ├── mutations.js # mutações raiz
│ └── modules
│ └── addresses.js # módulo para gerenciamento de endereços
└── tests
├── unit
├── AddressForm.spec.js
└── RegisterAddress.spec.js
└── AddressList.spec.js
Todos os componentes foram testados utilizando Jest. Os testes abrangem a renderização correta dos componentes, a interação com o usuário e a verificação das ações e mutações do Vuex.
Estilos Este projeto utiliza o Vuetify para estilização e componentes UI.
Para mais informações sobre os componentes do Vuetify e como utilizá-los, consulte a documentação oficial do Vuetify.