[{"data":1,"prerenderedAt":144},["ShallowReactive",2],{"project-pt-listo":3},{"id":4,"title":5,"author":6,"body":7,"company":121,"date":122,"description":123,"extension":124,"highlight":125,"meta":126,"navigation":127,"path":128,"priority":129,"role":130,"section":131,"seo":132,"sitemap":133,"stem":134,"tags":135,"thumbnail":25,"year":142,"__hash__":143},"work\u002Fwork\u002Fpt\u002Flisto.md","Listo","Salguento",{"type":8,"value":9,"toc":111},"minimark",[10,15,19,30,34,37,40,44,60,63,67,70,79,83,86,89,93,96,105],[11,12,14],"h2",{"id":13},"contexto","Contexto",[16,17,18],"p",{},"Listo é um gerenciador de tarefas local-first criado como exercício de Angular. O projeto explora como organizar uma aplicação frontend com dados persistentes, múltiplos filtros e uma interface acessível sem depender de autenticação ou backend.",[16,20,21,26],{},[22,23],"img",{"alt":24,"src":25},"Símbolo e nome do Listo sobre fundo escuro.","\u002Fimg\u002Fwork\u002Flisto\u002Fog-image.png",[27,28,29],"em",{},"Identidade visual do Listo.",[11,31,33],{"id":32},"problema-técnico","Problema técnico",[16,35,36],{},"A interface precisa manter tarefas pendentes e concluídas sincronizadas com a busca e a data selecionada. A implementação inicial aplicava novos filtros sobre resultados já filtrados, fazendo itens desaparecerem após mudanças sucessivas de busca ou data.",[16,38,39],{},"A solução combina a coleção persistida, o termo de busca e a data selecionada com RxJS. Cada evento recalcula o resultado a partir da fonte original, preservando uma única fonte de verdade. As listas pendente e concluída são derivações desse mesmo fluxo compartilhado.",[11,41,43],{"id":42},"arquitetura-e-dados","Arquitetura e dados",[16,45,46,47,51,52,55,56,59],{},"A aplicação usa componentes standalone do Angular e separa modelos, persistência, serviços e funcionalidades. O Dexie fornece uma camada tipada sobre o IndexedDB e ",[48,49,50],"code",{},"liveQuery"," publica alterações locais de forma reativa. Os serviços encapsulam as operações de tarefas e etiquetas, enquanto ",[48,53,54],{},"combineLatest"," e ",[48,57,58],{},"shareReplay"," coordenam o estado apresentado pela interface.",[16,61,62],{},"Os dados permanecem no dispositivo do usuário. Essa decisão reduz a infraestrutura necessária e favorece privacidade e uso local, com a limitação consciente de não oferecer sincronização entre dispositivos.",[11,64,66],{"id":65},"interface-e-acessibilidade","Interface e acessibilidade",[16,68,69],{},"O layout se adapta de uma janela centralizada no desktop para uma experiência em tela cheia em dispositivos menores. Os controles possuem nomes acessíveis, foco visível e áreas de interação adequadas. A exibição das ações não depende somente de hover, e as transições respeitam a preferência por movimento reduzido.",[16,71,72,76],{},[22,73],{"alt":74,"src":75},"Interface do Listo em tema escuro, com tarefas pendentes organizadas por data, etiquetas e horário.","\u002Fimg\u002Fwork\u002Flisto\u002Finterface-listo.png",[27,77,78],{},"Interface principal com navegação por data, busca e separação entre tarefas pendentes e concluídas.",[11,80,82],{"id":81},"qualidade-e-evolução","Qualidade e evolução",[16,84,85],{},"O projeto foi migrado incrementalmente do Angular 19 para o Angular 22, incluindo Angular Material, o novo builder, SSR e prerenderização. A suíte também foi migrada de Karma e Jasmine para Vitest, removendo a dependência de um navegador instalado no ambiente de integração.",[16,87,88],{},"Os testes cobrem serviços, publicação do estado de busca e data e regressões na combinação dos filtros. O build de produção gera os bundles do navegador, o servidor SSR e a rota inicial prerenderizada.",[11,90,92],{"id":91},"limites-do-projeto","Limites do projeto",[16,94,95],{},"Listo é apresentado como estudo de engenharia, não como produto comercial. Autenticação, colaboração, notificações e sincronização remota estão fora do escopo. As próximas evoluções possíveis são testes end-to-end e uma estratégia opcional de sincronização que preserve a proposta local-first.",[16,97,98],{},[99,100,104],"a",{":rel":101,":target":102,"href":103},"noreferrer","_blank","https:\u002F\u002Flisto.salguento.xyz","Aplicação",[16,106,107],{},[99,108,110],{":rel":101,":target":102,"href":109},"https:\u002F\u002Fgithub.com\u002Fsalguento\u002Ftodo-angular","GitHub",{"title":112,"searchDepth":113,"depth":113,"links":114},"",2,[115,116,117,118,119,120],{"id":13,"depth":113,"text":14},{"id":32,"depth":113,"text":33},{"id":42,"depth":113,"text":43},{"id":65,"depth":113,"text":66},{"id":81,"depth":113,"text":82},{"id":91,"depth":113,"text":92},"Autoral","2026-07","Gerenciador de tarefas local-first com estado reativo e persistência no navegador","md",false,{},true,"\u002Fwork\u002Fpt\u002Flisto","4","Desenvolvedor Frontend","engineering",{"title":5,"description":123},{"loc":128},"work\u002Fpt\u002Flisto",[136,137,138,139,140,141],"TypeScript","Angular","RxJS","IndexedDB","Vitest","SSR",2025,"P_uLAEJY6jT3TlVWw-MQFmn_PLVfB5VgKnfrBsPcCSc",1785351609778]