/devweb

Disciplina de Desenvolvimento Web

MIT LicenseMIT

Discord CCC - #desenvolvimento_web

Vídeo de apresentação

Desenvolvimento Web 2020.3 - RAE

  • As interações (síncronas e assíncronas) serão feitas via discord CCC, no canal #desenvolvimento_web

  • A avaliação será feita a partir de um projeto individual (ver Avaliação abaixo)

  • A cada semana o aluno deve, até o domingo,...

    • Revisar o material indicado (vídeos e material auxiliar)
    • Cumprir a entrega da semana
    • Revisar a entrega da semana passada de 2 colegas indicados
      • Você pode cadastrar mais colegas além desses
      • Pelo menos UMA issue deve ser cadastrada durante esse processo
      • Não precisa cadastrar uma issue por revisão, mas, pelo menos 1 issue
      • A issue não precisa ser uma correção, mas pode ser uma sugestão de algo novo ou fazer algo de forma diferente
    • (OPCIONAL) Tirar dúvidas e interagir com os colegas sobre o conteúdo do material
    • (OPCIONAL) Participar de lives sobre codificação/conteúdo (anunciadas no discord)

Entrega

Cronograma

Início Conteúdo Conceitos Vídeo Material Auxiliar Entrega
1 01/09/2020 Básico HTML, HTTP e JS. Introdução e base. - vídeo 1
- vídeo 2		 Conceitos Iniciais - Criar repositório
- Definir o projeto (no README)
- Criar HTML (sem JS) da funcionalidade mais importante do seu projeto
2 07/09/2020 Node/Express JS, Node, Express, Rotas, REST - vídeo 1
- vídeo 2		 NodeJS Formulário de projeto
3 14/09/2020 Node/Express Modelagem e Implementação REST vídeo 1 Node/Express com...
- Uma rota POST
- Uma rota GET (afetada pelo POST)
4 21/09/2020 React Components Primeira estrutura REACT vídeo 1 slides Um componente com...
- Estado interno sendo alterado
- Props que afetam o componente
5 28/09/2020 React Components Primeiros subcomponentes, Props, State vídeo 1 slides Um subcomponente com...
- Props sendo afetado pelo estado do componente pai
6 05/10/2020 React useEffect Interação com backend (GET/POST/PUT) vídeo 1 Um componente com...
- Estado sendo definido por um GET
7 12/10/2020 Jest Testes de componentes vídeo 1 Testar um componente que tenha...
- Props e alteração de estado
8 19/10/2020 React Context Propagação de estado em árvore vídeo 1 Uso de um contexto para...
- Propagação de estado para baixo e para cima
9 26/10/2020 React Router Novas telas para a aplicação vídeo 1
10 02/11/2020 Web APIs / Storage / Service Worker vídeo 1 -
11 09/11/2020 CSS/UI/UX vídeo 1 -
12 16/11/2020 Projeto 1ª Entrega
13 23/11/2020 Projeto
14 30/11/2020 Projeto Entrega final
15 07/12/2020 Final

Ementa

  • Introdução à Internet e à Web
  • Protocolos de comunicação e transferência de dados
  • Linguagens de script
  • Desenvolvimento para a Web (lado cliente)
  • Tópicos avançados

Objetivos

Criar um sistema web (de internet) com um servidor simples de dados e uma interface (frontend) complexa utilizando um arcabouço moderno de componentes e seguindo as melhores práticas de desenvolvimento.

Avaliação

Cada aluno deve, individualmente, criar um sistema web focando principalmente no frontend e tendo um backend simples em REST.

O projeto deve ter como características:

  • Ser algo que você queira fazer!
  • Ser código aberto
  • Estar publicado em um repositório git com…
    • 1 arquivo README.md descrevendo o projeto
    • 1 diretório (backend) para o servidor
    • 1 diretório (frontend) para o cliente
  • Usar como base o express-generator e o create-react-app
  • Ter, no mínimo, 3 telas, sendo…
    • 1 tela com exibição de itens de uma lista / coleção e um filtro
    • 1 tela com edição / inserção de itens
    • 1 tela a mais a sua escolha
  • Ter componentes bastante interativos
  • Ter 1 barra de navegação com campos adicionais, incluindo componente de busca

O projeto terá um conjunto de 8 entregas bem definidas (50% da disciplina). Ao final dessas 8 entregas, os alunos trabalham na melhoria do projeto para uma entrega final (50% da disciplina).

Cada entrega intermediária será avaliada da seguinte forma:

  • 5 pontos por uma entrega com a funcionalidade com pequenos problemas, não importa a qualidade do código
  • 10 pontos pela entrega com a funcionalidade esperada completa
  • -5 pontos caso não realize a revisão entre-pares daquela entrega.

O projeto final será avaliado pela funcionalidade (10 pontos) e corretude, e qualidade de código (40 pontos). Todas as issues no final do projeto devem estar resolvidas.

As entregas são sinalizadas por preenchimento de formulário online com a versão referente a entrega até o domingo (23:59 AOE).

Bibliografia recomendada