Novas melhorias: Abertura instanânea de páginas e mais 7 melhorias 🎉
Mais uma semana se passou desde a última publicação sobre as melhorias no TabNews e ao longo desse tempo 8 novas implementações foram feitas!
Na verdade, uma das implementações foi feita na semana retrasada mas eu esqueci de publicar aqui, então vamos começar por ela:
1) Atualização de todas as dependências
Nós atualizamos todas as dependências do backend e frontend do projeto para a última versão possível e compatível. Destaco isso, pois nem todas as dependências nas suas últimas versões são compatíveis com todo o ecossistema de módulos usados no TabNews.
Um exemplo foi o downgrade do react
para a versão 17.0.2
para ficar compatível com o framework para UI que usamos aqui no TabNews, o @primer/react do GitHub. Este problema de incompatibilidade foi solucionado por rafa-thayto e nos ajudou a parar de ter uma dor de cabeça com as instalações das dependências.
De qualquer forma, o mais importante foi atualizado, que são as dependências de produção do backend, incluindo a versão do Node.js. Uma dependência do backend não pode ser atualizada, mas era uma dependência usada apenas no lado do desenvolvimento do sistema chamada kill-port
.
Esta implementação foi liderada por mim e as informações podem ser conferidas por essa Issue* 🎉
2) Abertura instantânea de páginas
Foi implementado o uso do componente Link
do Next.js e agora ele transforma o TabNews em uma SPA Híbrida, onde inicialmente se comporta como uma página estática HTML convencional, mas logo em seguida hidrata ela com recursos avançados, como o carregamento antecipado das URLs das publicações.
Então agora caso você acesse a lista de publicações que está na Home, ao passar o mouse em cima de algum link, dependendo da sua conexão é bem possível que, ao clicar, a página abra instantaneamente pelo fato de todas as informações já estarem na memória do navegador.
Fora isso, foi implementado uma loading bar no topo do site para sinalizar o carregamento da página.
Esta implementação foi realizada por ErickCReis e as informações podem ser conferidas por essa Issue* 🎉
3) TabNews compatível com Windows
Na verdade, rodar o serviço do TabNews em modo de desenvolvimento já era compatível com Windows, porém o comando npm test
infelizmente retornava um erro, e este é o principal comando para você verificar se todo o sistema está se comportando como deveria, tanto antes de uma implementação, quanto depois. Mas agora ele está compatível com Windows, Linux e macOS.
Esta implementação foi realizada por mim, mas teve participação de OtavioVB e aprendendofelipe testando no Windows e as informações podem ser conferidas por essa Issue* 🎉
4) Publicações Lidas e Não Lidas
Antes, todas as publicações do TabNews possuíam a mesma cor de link, independente se você já tivesse visitado ela ou não e isto dificultava um pouco a usabilidade. Agora está muito mais fácil identificar o que são publicações novas e mais para frente queremos sincronizar isso em todos os devices que você esteja logado, vai ser massa.
Esta implementação foi realizada por aprendendofelipe e as informações podem ser conferidas por essa Issue* 🎉
5) Invalidar todas as sessões do usuário ao resetar a senha
Agora, no momento que você reseta a sua senha, o sistema automaticamente invalida todas as sessões que possam estar abertas e vinculadas ao seu usuário em qualquer tipo de device. Isto é um avanço fundamental na segurança do usuário dentro do TabNews.
Esta implementação foi realizada por eletroswing e as informações podem ser conferidas por essa Issue* 🎉
6) Breaking Change no objeto de Conteúdo
Nós adicionamos a propriedade owner_username
no objeto content
para fazer par com o owner_id
. Por compatibilidade, ainda iremos manter o username
, mas que após notificação pública (além desta aqui), iremos remover e fazer uma breaking change na interface pública. Estamos nos dando o luxo de fazer isso dessa forma pela API estar em beta.
Veja um exemplo de um content
retornado pela API:
{
"id": "9cbd96b5-e326-4d8d-ae4a-837ced7cba54",
"owner_id": "110cc974-4c56-4074-afbc-81ce22aa6013",
"parent_id": null,
"slug": "douglas-crockford-criador-do-json-acredita-que-javascript-deveria-ser-aposentado",
"title": "Douglas Crockford, criador do JSON, acredita que JavaScript deveria ser aposentado",
"body": "A linguagem teria se tornado uma “barreira ao progresso”, afirma o programador.\n\nCrockford diz que o JavaScript...",
"status": "published",
"source_url": "https://devclass.com/2022/08/04/retire_javascript_says-json-creator-douglas-crockford/Douglas",
"created_at": "2022-08-08T11:24:34.016Z",
"updated_at": "2022-08-08T11:24:34.016Z",
"published_at": "2022-08-08T11:24:34.046Z",
"deleted_at": null,
"username": "gugadeschamps",
"owner_username": "gugadeschamps",
"parent_title": null,
"parent_slug": null,
"parent_username": null,
"tabcoins": 3,
"children_deep_count": 0
}
O motivo desta implementação é semântico, uma vez que um conteúdo não possui username
, ele possui no máximo um dono e esse dono é quem possui um username
.
O Client Web do TabNews já está usando esta nova propriedade e recomendamos a todos que programaram no passado a algum client
a começarem a utilizar esta nova propriedade owner_username
para saber qual o autor/dono de um conteúdo.
Esta implementação foi realizada por mim e as informações podem ser conferidas por essa Issue* 🎉
7) Fazer o controller
parar de devolver erros 500
Na missão de ter zero erros 500
no TabNews, havia uma forma de consistentemente gerar um que era enviar um method
HTTP desconhecido por algum endpoint qualquer. Por exemplo, se em um endpoint que só aceita GET
você enviar um POST
, era retornado um erro 500
ao invés de 404
. Agora isso foi ajustado e nessa situação é enviado um 404
.
Esta implementação foi realizada por mim e as informações podem ser conferidas por essa Issue* 🎉
8) Página listando as publicações mais recentes
Agora além da visualização da Home que ordena as publicações levando em consideração a quantidade de tabcoins
e a idade dela, você pode consultar a página Recentes que irá listar as publicações sem algoritmo algum, apenas devolverá uma lista ordenada de forma decrescente pela data de publicação (do mais novo para o mais velho).
Esta implementação foi realizada por mim e as informações podem ser conferidas por essa Issue* 🎉
Conclusão
A Milestone 5 com certeza será a recorde de melhorias, pois já estamos com 28 delas em produção! E tem mais coisas muito interessantes para entrar, inclusive que nesse exato momento está com Pull Request sendo revisado e que não vejo a hora de fazer o deploy!
É isso turma, de semana em semana estamos lambendo o projeto e o TabNews por inteiro está sendo lapidado. Na verdade ainda há muita coisa para lapidar e isso é ótimo! Tanto o TabNews quanto a plataforma que estamos construindo é um projeto de longo prazo, mas que já me deixa muito orgulhoso por tudo que já construímos até então e por todas as pessoas que se aproximaram 🤝
Tenham todos uma excelente semana! 😍
⚠️ O repositório Open Source do TabNews ainda está em Modo Privado. Caso queira receber um convite para participar, leia esta publicação.