{"id":26601555,"url":"https://github.com/fabiomirandaa/simple-todo-ngrx","last_synced_at":"2025-04-09T16:34:31.773Z","repository":{"id":40788689,"uuid":"253333013","full_name":"fabiomirandaa/simple-todo-ngrx","owner":"fabiomirandaa","description":"Projeto de TodoList com uma básica implementação de NGRX, para entendimento dos conceitos.","archived":false,"fork":false,"pushed_at":"2024-09-06T02:57:45.000Z","size":3771,"stargazers_count":12,"open_issues_count":12,"forks_count":6,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-23T18:51:44.548Z","etag":null,"topics":["angular","angular-example","angular-example-app","ngrx","ngrx-effects","ngrx-example","ngrx-store","redux","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/fabiomirandaa.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-04-05T21:11:57.000Z","updated_at":"2024-10-22T20:09:07.000Z","dependencies_parsed_at":"2023-02-15T07:25:46.743Z","dependency_job_id":null,"html_url":"https://github.com/fabiomirandaa/simple-todo-ngrx","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fabiomirandaa%2Fsimple-todo-ngrx","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fabiomirandaa%2Fsimple-todo-ngrx/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fabiomirandaa%2Fsimple-todo-ngrx/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fabiomirandaa%2Fsimple-todo-ngrx/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/fabiomirandaa","download_url":"https://codeload.github.com/fabiomirandaa/simple-todo-ngrx/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248068157,"owners_count":21042435,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","angular-example","angular-example-app","ngrx","ngrx-effects","ngrx-example","ngrx-store","redux","typescript"],"created_at":"2025-03-23T18:40:42.445Z","updated_at":"2025-04-09T16:34:31.751Z","avatar_url":"https://github.com/fabiomirandaa.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# SimpleTodoNgrx\nProjeto desenvolvido para servir de estudo para o conceito de Effects. É um WebApp de Todo-list muito simplificado.\n\nEsse projeto foi gerado pelo [Angular CLI](https://github.com/angular/angular-cli). Se encontra na versão 12.1 do Angular.\n\n### Como rodar o projeto\nCom node 12+ instalado, rodar o comando `npm install` e após finalizar a instalação, rodar o comando `npm run start`\n\n## Resumo do conceito\n\nPara entendimento deste resumo, você precisa entender os conceitos básicos do Redux. Aviso dado, vamos ao resumo.\n\nBasicamente os Effects é a forma que temos para garantir o tratamento de efeitos colaterais ao dispararmos Actions. Não podemos esquecer que no Redux, os Reducers devem ser feitos com funções puras. \n\nEntão quando criamos um Effect, estamos garantindo que Actions que necessitem de consultas externas,por exemplo, tenham também um tratamento de possíveis erros e possam direcionar o disparo de Actions específicas para momentos de erro.\n\nO Exemplo deste projeto, é o Effect de loadTodos. Vejam:\n\n```typescript\n  loadTodos$ = createEffect(() =\u003e\n    this.actions$.pipe(\n      ofType(getTodos),\n      switchMap(() =\u003e {\n        return this.loadAllTodos();\n      })\n    )\n  );\n\n    private loadAllTodos() {\n    return this.todoService.getTodos()\n    .pipe(\n      map((todos) =\u003e {\n        return { type: TodoActionTypes.LoadTodos, todos };\n      }),\n      catchError((error) =\u003e of({ type: TodoActionTypes.Error, message: error }))\n    );\n  }\n\n```\n\nComo é possível ver, temos um efeito que monitora a ação de `GetTodos`. Nesse efeito, temos ali no método genérico de carregamento de Todos o tratamento de erro, fazendo com que seja chamada a Action específica de erro caso ocorra algum problema com a chamada HTTP.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffabiomirandaa%2Fsimple-todo-ngrx","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffabiomirandaa%2Fsimple-todo-ngrx","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffabiomirandaa%2Fsimple-todo-ngrx/lists"}