ipetinate / workshop-vue

Criando uma Aplicação Web PWA/SPA com Vue.js + Vuetify e consumindo dados através de requisições HTTP com AXIOS HTTP Client

Workshop Vue - Aplicação Web

Criando uma Aplicação Web PWA/SPA com Vue.js + Vuetify e consumindo dados através de requisições HTTP com AXIOS HTTP Client

---

Conteúdo abordado:

• O que é:

  • Vue.js
  • Vuetify
  • PWA e SPA
  • AXIOS Client HTTTP

• Instalação do Vue-CLI 3

• Iniciando Projeto Vue com Webpack via Vue UI

• Instalando Plugins no Vue: Vuetify e AXIOS

• Instalando Plugins no VS Code: Vetur, Vuetify

• Configuração básica do manifest.json

• Montando interface simples no componente Home.vue com elementos do Vuetify

• Montando API Fake com arquivo db.json e JSON Server

• Consumindo dados da api fake no Front-end com Axios

---

Atenção:

• Todos os arquivos estão comentados e com guias do que são/significam, então leia e qualquer duvida entre em contato ou abra uma issue (não é recomendado, mas nesse caso não tem problema)
• Verifique os README dos diretórios deste repósitorio para maiores informações, procurei detalhar melhor o processo de API Fake com JSON Server no README da Pasta /database que está dentro da pasta /web-app, e as informações mais detalhadas sobre as estrutura do projeto e o que são cada item pode ser encontrada no README do diretório /web-app
• A Apresentação de slides em formato PowerPoint e PDF pode ser encontrada na pasta Apresentação

---

Comandos Úteis [Terminal/PowerShell/CMD]:

npm install -g @vue/cli     ----> instala o Vue CLI na versão 3, -g para instalação global
vue create web-app          ----> cria um novo projeto Vue com webpack e configurações default
vue ui                      ----> inicia a dashboard gráfica do vue

Requisitos e Links:

• NodeJS [página de download]

• Vue-CLI 3 [documentação e quickstart]

• Vuetify [documentação e quickstart]

• AXIOS [documentação e quickstart]

• JSON Server [repositório npm]

• Material Icons [consulta de icones]