Frameworks Modernos: front-end e back-end
Vue 3, Vuetify, Vue Router, Pinia e Axios no front; Express 5, MySQL, Supabase, Firebase Auth e Swagger no back — com os padrões de projeto que vivem dentro de cada ferramenta.
Começar pela aula 01 → Apostila em arquivo único Desafios desta trilha
Aulas
Fundamentos de front-end com Vue.js
Vue.js avançado: Vuetify, Axios, Router e Pinia
Integração front-end/back-end
Projeto fio-condutor: UniEventos
Plataforma de divulgação e inscrição em eventos acadêmicos: SPA em Vue 3 + Vuetify + Pinia consumindo uma API Express com MySQL/Supabase e autenticação Firebase. Cada estudante desenvolve um projeto autoral com a mesma arquitetura e domínio diferente.
Ementa: Desenvolvimento com uso de frameworks; padrões: criacionais, estruturais e comportamentais; aplicação conjunta das abordagens de frameworks e componentes no desenvolvimento de software.
Cronograma 2026.2
Datas conforme o Plano de Curso da turma no SIGAA. ⏰ marca o dia de entrega de uma avaliação. Em caso de divergência com o calendário da turma, vale o aviso do professor.
| Data | Aula | Conteúdo |
|---|---|---|
| 12/08/2026 | 01 | Apresentação da disciplina e revisão de JavaScript |
| 19/08/2026 | 02 | Introdução ao Vue: instância, ciclo de vida e diretivas |
| 26/08/2026 | 03 | Vue: listas, computed e ciclo de vida |
| 02/09/2026 | 04 | Introdução a Vuetify e Vue Router — prazo da Avaliação 1 ⏰ |
| 16/09/2026 | 05 | Componentes, Vue Router e Vuetify avançado |
| 23/09/2026 | 06 | Axios e Pinia |
| 30/09/2026 | 07 | Introdução ao Firebase, Node.js e Express |
| 07/10/2026 | 08 | Endpoints e middlewares — prazo da Avaliação 2 ⏰ |
| 21/10/2026 | 09 | Integrando com SGBD MySQL |
| 28/10/2026 | 10 | Requisições autenticadas com Firebase |
| 11/11/2026 | 11 | Integrando front-end com back-end: CRUD |
| 18/11/2026 | 12 | CRUD com banco em nuvem (Supabase) |
| 25/11/2026 | 13 | Desenvolvimento do back-end |
| 09/12/2026 | 14 | Documentação com Swagger |
| 16/12/2026 | 15 | Apresentação dos resultados — prazo da Avaliação 3 ⏰ |
Avaliação
Média final = (A1 + A2 + A3) ÷ 3. Aprovação com MF ≥ 6,0; exame final se 4,0 ≤ MF < 6,0; frequência mínima de 75%. Entregas via SIGAA. O exame final é uma prova teórica, presencial e individual sobre as três unidades.
| Instrumento | Escopo | Prazo |
|---|---|---|
| Avaliação 1 | Vue 3 com CLI: estrutura, componentes, diretivas, Vuetify e Vue Router básico. | 02/09/2026, 23h59 |
| Avaliação 2 | Vue avançado: Vuetify + Axios + Vue Router + Pinia. | 07/10/2026, 23h59 |
| Avaliação 3 | Back-end com Express, banco de dados (MySQL/Supabase), autenticação Firebase, documentação e deploy. | 16/12/2026, 23h59 |
Stack e ferramentas
| Camada | Tecnologia |
|---|---|
| Runtime | Node.js 22 LTS |
| Front-end | Vue 3.5 · Vite 8 · Vuetify 4 · Vue Router 5 · Pinia 4 · Axios 1.19 |
| Back-end | Express 5.2 · mysql2 · swagger-jsdoc/swagger-ui-express |
| Nuvem | Firebase Auth 12 (modular) · Supabase (Postgres) · MySQL 8 |
Bibliografia da disciplina
- QUEIRÓS, Ricardo; PORTELA, Filipe. Introdução ao Desenvolvimento Moderno para a Web. FCA, 2018.
- ALVES, William P. Projetos de Sistemas Web. Érica, 2015.
- LOUDON, Kyle. Desenvolvimento de Grandes Aplicações Web. Novatec, 2019.
- ERL, Thomas et al. SOA with REST: Principles, Patterns & Constraints. Prentice Hall, 2017.
- PUREWAL, Semmy. Aprendendo a Desenvolver Aplicações Web. Novatec, 2014.
Como usar este material
- Cada aula tem objetivos, teoria com código completo, Mão na massa (guiado), Laboratório em três níveis (A fixação · B aplicação · C desafio), Desafios extras com estrelas, tabela de erros comuns e a atividade assíncrona da semana.
- Marque Concluí esta aula ao fim de cada página e Feito em cada desafio: o progresso fica salvo neste navegador.
- Todos os blocos de código têm botão Copiar — mas digite você mesmo: copiar e colar não fixa nada.
- Atalhos: j próxima aula · k anterior · / busca. Ctrl+P imprime a aula limpa.
Prof. Ivan Luiz Pedroso Pires · Material didático de uso educacional; livre para consulta, estudo e reuso com atribuição.
Início · Banco de Desafios · Links úteis · Fontes no GitHub