{"id":20314710,"url":"https://github.com/brendon3578/project-angular-my-financies","last_synced_at":"2026-05-05T01:35:35.702Z","repository":{"id":179330484,"uuid":"662748148","full_name":"Brendon3578/project-angular-my-financies","owner":"Brendon3578","description":"Repositório de estudo sobre o Angular 16, foi criado um CRUD para administrar entradas de despesas e receitas do usuário","archived":false,"fork":false,"pushed_at":"2023-08-03T02:52:04.000Z","size":829,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-14T12:49:35.604Z","etag":null,"topics":["angular","angular15","dashboard","http-client","javascript","json-server","ng2-charts","reactive-forms"],"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/Brendon3578.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":"2023-07-05T19:57:22.000Z","updated_at":"2024-09-12T10:56:59.000Z","dependencies_parsed_at":null,"dependency_job_id":"79122f9d-0ebc-4616-8106-43a8e60956d7","html_url":"https://github.com/Brendon3578/project-angular-my-financies","commit_stats":null,"previous_names":["brendon3578/project-angular-my-financies"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Brendon3578%2Fproject-angular-my-financies","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Brendon3578%2Fproject-angular-my-financies/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Brendon3578%2Fproject-angular-my-financies/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Brendon3578%2Fproject-angular-my-financies/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Brendon3578","download_url":"https://codeload.github.com/Brendon3578/project-angular-my-financies/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241818877,"owners_count":20025210,"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","angular15","dashboard","http-client","javascript","json-server","ng2-charts","reactive-forms"],"created_at":"2024-11-14T18:16:26.537Z","updated_at":"2026-05-05T01:35:30.671Z","avatar_url":"https://github.com/Brendon3578.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Projeto Angular Minhas Finanças 💳\n\n![Angular](https://img.shields.io/badge/angular-%23DD0031.svg?style=for-the-badge\u0026logo=angular\u0026logoColor=white)\n![RxJS](https://img.shields.io/badge/rxjs-%23B7178C.svg?style=for-the-badge\u0026logo=reactivex\u0026logoColor=white)\n![SASS](https://img.shields.io/badge/SASS-hotpink.svg?style=for-the-badge\u0026logo=SASS\u0026logoColor=white)\n\nRepositório de estudo sobre o Angular 16, foi criado uma aplicação no modelo de CRUD (Create, Read, Update, Delete) para administrar entradas de despesas e receitas do usuário.\n\nO Projeto foi desenvolvido utilizando o HTTP Cliente nativo do Angular para lidar com requisições HTTP, foi usado o Reactive Forms para trabalhar com formulários de modo reativo\n\n\u003cp align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview.PNG\"style=\"border-radius: 5px\" alt=\"Website\" width=\"710\"\u003e\n    \u003c/kbd\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n\u003cspan align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview-2.PNG\"style=\"border-radius: 5px\" alt=\"Website\" height=\"340\"\u003e\n    \u003c/kbd\u003e\n\u003c/span\u003e\n\u003cspan align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview-3.PNG\"style=\"border-radius: 5px\" alt=\"Website\" height=\"340\"\u003e\n    \u003c/kbd\u003e\n\u003c/span\u003e\n\u003c/p\u003e\n\n## 🔮 Tecnologias\n\n- Angular 15\n- Angular Material\n- DayJs\n- NG2 Chart (chart.js - biblioteca de gráfico - para o Angular)\n- ~~json server para um servidor simples em json (`db.json`)~~\n  - Substituição de servidor RESP API fictício de json-server para o programa Mockoon\n\n## 🧱 Features\n\n- Utilização do gráfico da biblioteca NG2 para a página de Dashboard\n- Utilização do **HTTP Client** e **Observables** do Angular para requisições HTTP\n- Utilização do **Angular Material** para estilização nativa do Angular\n- Servidor REST API fictício com o Mockoon para a aplicação\n- Filtragem na tabela de Entradas utilizando **Reactive Forms**\n\n## Abrir a aplicação no ambiente de desenvolvimento\n\n- Baixe as dependências com o comando `npm install`\n- Use a CLI do Angular para iniciar a aplicação com o comando `ng serve`\n- Usa-se o programa Mockoon para servir como servidor REST para a aplicação, para isso abra o **environment** `minhasfinancias-mockoon.json` que está nesse repositório dentro do programa Mockoon\n  - Para a autenticação dentro da aplicação usa-se o login `brendon@email.com` e a senha `1234`\n  - A funcionalidade de cadastro ainda não está implementada nesta aplicação\n\n## 🖼 Imagens da Aplicação\n\n## Página de Login\n\n\u003cp align=\"center\"\u003e\n\u003cspan align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview-9.PNG\"style=\"border-radius: 5px\" alt=\"Website\" width=\"735\"\u003e\n    \u003c/kbd\u003e\n\u003c/span\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n\u003cspan align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview-10.PNG\"style=\"border-radius: 5px\" alt=\"Website\" height=\"340\"\u003e\n    \u003c/kbd\u003e\n\u003c/span\u003e\n\u003cspan align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview-11.PNG\"style=\"border-radius: 5px\" alt=\"Website\" height=\"340\"\u003e\n    \u003c/kbd\u003e\n\u003c/span\u003e\n\u003c/p\u003e\n\n### Página de Dashboard\n\n\u003cp align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview.PNG\"style=\"border-radius: 5px\" alt=\"Website\" width=\"700\"\u003e\n    \u003c/kbd\u003e\n\u003c/p\u003e\n\n### Página de Categorias\n\n\u003cp align=\"center\"\u003e\n\u003cspan align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview-1.PNG\"style=\"border-radius: 5px\" alt=\"Website\" height=\"340\"\u003e\n    \u003c/kbd\u003e\n\u003c/span\u003e\n\u003cspan align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview-2.PNG\"style=\"border-radius: 5px\" alt=\"Website\" height=\"340\"\u003e\n    \u003c/kbd\u003e\n\u003c/span\u003e\n\u003c/p\u003e\n\n### Página de Entradas\n\n\u003cp align=\"center\"\u003e\n\u003cspan align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview-3.PNG\"style=\"border-radius: 5px\" alt=\"Website\" height=\"340\"\u003e\n    \u003c/kbd\u003e\n\u003c/span\u003e\n\u003cspan align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview-4.PNG\"style=\"border-radius: 5px\" alt=\"Website\" height=\"340\"\u003e\n    \u003c/kbd\u003e\n\u003c/span\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n\u003cspan align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview-5.PNG\"style=\"border-radius: 5px\" alt=\"Website\" width=\"700\"\u003e\n    \u003c/kbd\u003e\n\u003c/span\u003e\n\u003cspan align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview-6.PNG\"style=\"border-radius: 5px\" alt=\"Website\" width=\"700\"\u003e\n    \u003c/kbd\u003e\n\u003c/span\u003e\n\u003cspan align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview-7.PNG\"style=\"border-radius: 5px\" alt=\"Website\" width=\"700\"\u003e\n    \u003c/kbd\u003e\n\u003c/span\u003e\n\u003c/p\u003e\n\n## Página de erro 404 (Quando a rota não é encontrada)\n\n\u003cp align=\"center\"\u003e\n    \u003ckbd\u003e\n        \u003cimg src=\"./.github/preview-8.PNG\"style=\"border-radius: 5px\" alt=\"Website\" height=\"400\"\u003e\n    \u003c/kbd\u003e\n\u003c/p\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbrendon3578%2Fproject-angular-my-financies","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbrendon3578%2Fproject-angular-my-financies","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbrendon3578%2Fproject-angular-my-financies/lists"}