Aula 1 - Tópicos

[huogerac]

Aula 1

Vamos colocar o chapéu do FRONTEND, vamos codar uma versão inicial e tentar fazer deploy já no dia 1

Requisitos

5 Instalar Node e NPM

Assuntos & Tarefas

• [x] Setup inicial do hackernews (VueJS usando Vue-CLI)
• [x] Vue vs React (bate papo rápido)
• [x] Tailwind (Utility Class) vs Bootstrap (UI Library) e pq isto não é !important
• [x] Webpack e transpilers e as vantagens do frontend separado
• [x] Visão rápida do Vue
• [x] Separar páginas (views) dos componentes
• [x] Estrutura de Layout (herança de páginas == extends do Django Template)
• [x] Linter + code formatter
• [x] Rotas
• [x] API mock
• [x] Deploy
• [x] Links para quem quer se aprofundar
• [ ] Conceito de componentes puros

Links: https://plataforma.dev.pro.br/42242-formacao-fullstack https://github.com/confraria-devpro/hackernews-clone/discussions

[Gabrieltggv]

Link do treinamento do vue brasil https://treinamento.vuejsbrasil.org/

[diegomaranhao]

Links citados na aula: https://evolutio.io/curso/minicurso_frontend_em_2018 https://evolutio.io/curso/minicurso_vuejs https://treinamento.vuejsbrasil.org/

https://cli.vuejs.org/guide/installation.html

https://vuetifyjs.com/en/

https://www.npmjs.com/package/json-server

Comandos úteis: $ vur ui $ vue create hackernewsclone $ npm run serve $ npm run build $ npm install json-server --save-dev $ npm install axios --save

[huogerac]

Links relacionados com a Aula 1

Referência base

• Evolutio.io - Javascript visão alto nível
• Evolutio.io - Programação assíncrona
• Evolutio.io - Let Ecma6
• Evolutio.io - O que diabos aconteceu com o mundo do frontend?
• Webpack and Mr Crocodile
• Babel e transpilers
• Evolutio.io - VueJs vs Angular vs React
• Evolution.io - Reatividade no VueJS
• Componentes puros

Referência prática

• Instalar NodeJS via NVM
• Instalar Vue CLI
• json-server e Json-server para fazer API Mock
• Biblioteca de componentes CSS - Vuetify
• Estrutura de pastas VueJS
• Adiciona Vuetify no projeto

Extra - Cursos gratuitos de VueJS

• https://evolutio.io/curso/minicurso_vuejs
• https://treinamento.vuejsbrasil.org