Projeto TrocateTech é um projeto que foi feito para a empresa de freelance Vibbra. Feito com minha paixão acima de tudo uma vez que foi com ele que aprendi a ver como o mundo de freelance é maravilhoso por te dar a chance de usar tudo o que temos de melhor.
- Vídeos de Considerações {#v}
- 1. Descrição da aplicação {#1}
- 2.<Técnico>Divisão das pastas do projeto {#2}
- 3. Imagem Docker {#3}
- 4. Link para a aplicação {#4}
- 5. Considerações finais {#5}
Vídeo sobre considerações técnicas: Vídeo Técnico
Vídeo de uso/testes Vídeo de uso
O cenário proposto na aplicação seria efetuar a criação de uma interface onde é possível cadastrar,excluir,editar e pesquisar pontos turísticos.
Profissionais que atuam em uma rede de indicação de trabalhos freelance que precisam comprar, vender ou trocar produtos de tecnologia (notebooks, mouses, teclados, etc) que possibilitem a realização de seus trabalhos de forma rápida, otimizando seus custos com estruturas de trabalho.
Comunicações com a api As APIs não estão disponíveis, portanto, erros serão disparados no console, mas, isso é apenas para de demonstrar que a comunicação foi, de fato, configurada. A parte inicial da URL foi guardada como variável de ambiente.
Login A tela de login contempla a parte do front-end na comunicação com o backend e no storage do JWT token nos Cookies. É importante salientar que como a API não está funcional, foi gerado o token com a biblioteca UUI e guardado.
Tratamentos de erros Os campos de e-mail e senha estão avisando quando seus valores são inválidos
Tela inicial A tela inicial é onde listamos todas as negociações disponíveis na plataforma. Graças a tecnologia de SSG do NextJS, é possível coletarmos todas as negociações ao mesmo tempo, e guardá-las na memória, assim, não será necessário que a plataforma esteja sempre consultando o banco de dados e, consequentemente, aliviando o Banco de dados.
A regeneração dos dados pode ocorrer de tempos em tempos (o que é inviável para o negócio proposto pela plataforma), ou a cada mudança nas informações. Como é uma plataforma para usuário de uma empresa, e não para milhões de pessoas, foi considerado que o SSG era a melhor abordagem.
Graças ao SSG, o filtro que consta em tela pode filtrar as informações em tempo real - tirando a necessidade de efetuar o filtro e ter que ser acionado a partir de um botão.
Tela de cadastro das negociações
A tela de cadastro, visualmente, é uma coisa bem simples. Porém, a tecnologia de componentização traz todo o poder de trabalharmos com componentes separados, evitando assim, muito re-uso de códigos. Todo controle de estados também são controlados pelo _Context API. _
Testes Alguns poucos módulos contemplam o uso de testes automatizados. Dentro do projeto é possível efetuar o teste com JEST/React-Testing-Library.
Typescript O uso de typescript aumenta a complexidade e o tempo de desenvolvimento da aplicação, porém, diminui consideravelmente o tempo gasto com bugs que surgem.
O processo de componentização e tipagem (Typescript) de um projeto é algo sensacional, mas, exigem uma grande habilidade de organização.
As pastas estão divididas em:
Components Pastas onde foram separados os componentes usados nas páginas.
Contexts Os contextos criados com intuito de compartilhar os estados de outros components.
Funções Algumas funções foram separadas nessa pasta, porém, apenas funções que possam ser reaproveitadas por outros componentes, senão, elas são criadas dentro dos próprios componentes.
Interfaces Interface de objetos que foram criados a fim de dirimir casos de erros.
Pages Rotas da aplicação
Apesar de termos um link com o projeto já em deploy, caso for necessário, favor usar a imagem Docker. kajiyamavk/trocatech
Caso não queira trabalhar com Docker, não tem problema. Entre em https://trocatech-ngp9yyge3-kajiyamavk.vercel.app/
O mundo freelance é esplêndido para o desenvolvedor. Sou uma pessoa que não gosta de ficar parado. Sou uma pessoa que faz questão de não ficar parado. Acho tudo interessante, e acredito que o aprendizado deve ser contínuo. Não estudo as questões da tecnologia por obrigação, mas por sede. Agradeço à Vibbra pela oportunidade gigante de ter participado um pouco desse projeto. Infelizmente, muitos pontos não puderam ser aplicados uma vez que o escopo não estava abordando os assuntos pendentes, mas isso não muda a experiência incrível que foi.