EcompJr/Trein-ReactTeam

Portfólio - Section

Opened this issue · 0 comments

Construção do componente referente ao item de um portifólio

  • O Item de Portfólio deve receber 4 props
    • picture: Imagem da primeira dobra do site ou do sistema
    • name: Nome do projeto
    • type: Tipo do projeto (Esse valor também será usado para filtrar os projetos)
    • onPress: Callback para ação de quando clicar no item (Futuramente vamos implementar a navegação para a página do projeto)
  • Fazer implementação da feature de mouse-hover do componente
  • Opcionalmente: Colocar uma prop de cor relativa a cor de fundo do mouse-hover

Captura de Tela 2019-05-20 às 23 27 21

Construção do componente de botão

  • Criação de componente de botão com duas props:
    • onPress: Callback referente a ação que deve ser executada quando o botão for clicado
    • text: Texto do botão. (Outra opção é usar a implementação via props.children que foi explicada durante o curso)
  • O texto do botão sempre fica em upper-case
  • Implementar estilo de mouse-hover e focus do botão

Captura de Tela 2019-05-20 às 23 27 34

Captura de Tela 2019-05-20 às 23 43 58

Captura de Tela 2019-05-20 às 23 43 55

  • Implementação da lista de portfólio com a possibilidade de filtrar os projetos a serem exibidos ao clicar em um dos botões de filtro
  • O filtro selecionado deve ser um state do componente.
  • Sugestão: Carregar a lista de projetos a partir de um Json salvo na pasta assets com o nome projects.json para ser mais facil de carregar futuramente.
    Exemplo do Json:
[
   {
      picture: "url-to-file.jpg",
      name: "Absam",
      type: "desktop"
   },
  {
   ...
  },
  ...
]