O projeto no estilo buscador de repositórios não foi novo pra mim, eu já havia feito outro em javascript puro, a um ano atrás, e com isso achei que não me daria muito trabalho, até porque hoje eu sei bem mais doque o eu do ano passado.
A verdade é que senti o peso de um ano de estudos em JS. Fazer este projeto em apenas 4 dias, utilizando React, Typescript, StyledComponents, Jest, express(um micro backend), e ainda com melhores práticas de programação junto as configurações de ESlint e Prettier, foi um tanto quanto desafiador.
O layout da aplicação foi inspirado nas famosas capas de livros da O'Reilly, tendo o gato como personagem devido a sua natureza caçadora. Buscando pela utilidade como fator principal, aproveitei as cores em preto e branco da imagem do gato, e a extendi por toda a aplicação. Os botões com design de "boom da internet" não negam a pressa em finalizar (e que eu já tenho mais de 20 e poucos anos), mas combinou vai...
As seguintes ferramentas foram usadas na construção do projeto:
A API utilizada nessa aplicação foi a do Github: https://docs.github.com/en/rest/guides/getting-started-with-the-rest-api
Antes de começar, você vai precisar ter instalado em sua máquina as seguintes ferramentas: Node.js, react, typescript,
exceto pelo Node, os outros arquivos serão instalados assim que digitar o comando:
yarn install
Além disto é bom ter um editor para trabalhar com o código como o VSCode
# Clone este repositório
$ git clone https://github.com/AngeloLanch/GitFinder
# Acesse a pasta do projeto no terminal/cmd
$ cd gitfinder
# Instale as dependências
$ yarn install
Após fazer o clone do projeto, abra-o em seu editor preferido, navegue para a pasta 'backend' e em seguida digite o comando:
yarn start
Você receberá uma mensagme no console: "running in https://localhost:8080"
Seu servidor já está rodando!
Em seguida, abra outro terminal e navegue de volta para a pasta principal do projeto. Eexecute o comando novamente:
yarn start
A palicação começará a rodar em localhost:3000
-- O Que melhorar ? Alguns pontos que gostaria de melhorar no projeto:
- Página de pesquisa não encontrada (404);
- Loading enquanto as requisições não retornam;
- Melhorar a aplicação do useContext. Ao meu ver, os componentes poderiam receber as informações via props, enquanto as páginas se utilizam dos contextos;
- A junção do estado que armazeda os dados requisitados com o estado que armazeda a flag booleana se os dados foram requisitados ou não, em um único estado, que armazenaria um objeto contentendo {flag, data}
- Realizar mais testes (só tem um no momento)
- Faça um fork do projeto.
- Crie uma nova branch com as suas alterações:
git checkout -b my-feature - Salve as alterações e crie uma mensagem de commit contando o que você fez:
git commit -m "feature: My new feature" - Envie as suas alterações:
git push origin my-feature
Caso tenha alguma dúvida confira este guia de como contribuir no GitHub
Para conseguir utilizar a aplicação corretamente, é necessário possuir os códigos de autenticação de usuário no github. O arquivo .env com os códigos, clientID e clientSecret, não estão contidos neste repositório por motivos de segurança. Para ter acesso completo a aplicação, entre em contato que eu te passo na boa =)
ou crie as suas próprias entrando em "settings" -> "developer Settings" -> OauthApps -> New OauthApp.
- As rotas de entrada e callback devem ser https://localhost:3000
- Após obter suas chaves de acesso, crie um arquivo .env no front e backend da aplicação com as suas chaves de acesso
Feito por: Ângelo Lanche. Este projeto está sobe a licença MIT.