Skip to content

Instantly share code, notes, and snippets.

@nunesfb
Last active June 7, 2023 16:21
Show Gist options
  • Save nunesfb/44e360bb237a3e530f5a22fccdd34bae to your computer and use it in GitHub Desktop.
Save nunesfb/44e360bb237a3e530f5a22fccdd34bae to your computer and use it in GitHub Desktop.
Projeto Tryunfo

Projeto Tryunfo 🕹️

⚠️ ATENÇÃO: Esse checklist é apenas um template. Para replicar realize o fork deste gist! ⚠️

1. O que preciso saber para fazer o projeto? 🤔

  • Criar componentes de classe em React;
  • Utilizar JSX no React;
  • Utilizar o método render() para renderizar seus componentes;
  • Fazer uso de props corretamente;
  • Fazer uso de PropTypes para tipagem;
  • Manipular o uso do estado
  • Manipular o uso de eventos
  • Criar e manipular formulários no React

2. Que conteúdos revisar? 📚

2.1 - Aulas do Course

  1. FE3.1 - Estado e Evento no React
  2. FE3.2 - Formulário no React

2.2 - Mentorias/Materiais complementares

2.3 - Conteúdos de soft skills

  • Está com dificuldades para manter a disciplina? Que tal dar uma olhada nessa matéria da Forbes com dicas para desenvolver disciplina, divulgadas na última edição do Trybe News?
  • A Lanai é uma ex-pessoa estudante da Trybe. Confira nesse post do Linkedin algumas das suas dicas de gestão pessoal e organização, utilizando o Google Calendar.
  • Como tem sido sua comunicação nas mentorias, monitorias, grupos de estudo e Slack? Tem conseguido trazer com assertividade seus pedidos e ofertas de ajuda nos projetos? Relembre aqui como praticar a assertividade e conquistar credibilidade na sua comunicação.
  • Quer entender um pouco mais sobre a importância das Soft Skills no mercado de trabalho? Confira aqui um artigo escrito pelo Matheus Ramos (Theus) (Tribo B) e Ebio Narduche (Tribo A).

2.4 - Dicas da Turma / Instrução (Em constante atualização)

3. Checklist ✅

3.1 - Planejamento

  • Abrir o PR para esse projeto
  • Criar seu cronograma de planejamento, use como base a seção 2 e 3 de Frontend

3.2 - Requisitos obrigatórios

  • 01 - Crie o formulário que será usado para adicionar cartas ao baralho
  • 02 - Adicione as props necessárias ao componente de formulário
  • 03 - Crie e renderize o componente Card com as props necessárias
  • 04 - Crie o preview da carta que está sendo criada pelo formulário
  • 05 - Faça a validação do botão de Salvar no formulário
  • 06 - Crie a função do botão salvar
  • 07 - Crie a validação do Super Trunfo
  • 08 - Exiba a lista de cartas que estão salvas no estado
  • 09 - Crie um botão para remover uma carta do baralho

3.3 - Requisitos bônus

  • 10 - Crie o filtro pelo nome da carta
  • 11 - Crie o filtro por raridade da carta
  • 12 - Crie o filtro de Super Trunfo
  • 13 - Crie o filtro pelo nome da carta

4. Planejamento 📆

O projeto possui 9 requisitos obrigatórios, para ser aprovado dentro do prazo regular vai ser necessário fazer no mínimo 7 dos 9 requisitos obrigatórios.

  • Dúvidas comuns - Se outras pessoas tiveram, é possível que você também tenha!
    • Ao rodar o npm install, npm start, npm test, ter certeza que entrou na pasta correta do projeto;
    • Lembrar de definir os propTypes em cada componente que estiver recebendo props;
    • Colocar a key sempre que estiver renderizando uma lista de elementos HTML no React;

5. Comemorar 🍾

Ao final desse projeto, você vai ter uma aplicação muito estruturada usando boas práticas de desenvolvimento e que pode (e deve) ser compartilhado com muito orgulho no seu Linkedin. Portanto, vamos com tudo para esse projeto!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment