Use este identificador para citar ou linkar para este item:
http://repositorio.utfpr.edu.br/jspui/handle/1/39938| Título: | Desenvolvimento de interface web modular com angular 18+: aplicação de boas práticas de componentização e integração front-end |
| Título(s) alternativo(s): | Development of a modular web interface with angular 18+: application of good practices in componentization and front-end integration |
| Autor(es): | Sena, Igor Silva |
| Orientador(es): | Genvigir, Gabriel Canhadas |
| Palavras-chave: | Interfaces de usuário (Sistemas de computação) Componente de software Integração de dados (Computação) User interfaces (Computer systems) Component software Data integration (Computer service) |
| Data do documento: | 3-Dez-2025 |
| Editor: | Universidade Tecnológica Federal do Paraná |
| Câmpus: | Cornelio Procopio |
| Citação: | SENA, Igor Silva. Desenvolvimento de interface web modular com angular 18+: aplicação de boas práticas de componentização e integração front-end. 2025. Trabalho de Conclusão de Curso (Bacharelado em Engenharia de Software) - Universidade Tecnológica Federal do Paraná, Cornélio Procópio, 2025. |
| Resumo: | Este Trabalho de Conclusão de Curso, desenvolvido entre 1o de janeiro e 30 de setembro de 2025, tem como objetivo demonstrar a aplicação do framework Angular 18+ na construção de uma aplicação web do tipo Single Page Application (SPA), com foco em padronização de componentes, reuso de código e melhoria da experiência do usuário. A interface foi construída por meio da criação de componentes reutilizáveis com Angular Material e Sassy Cascading Style Sheets (SCSS), estabelecendo diretrizes unificadas de cores, fontes e interações. A estruturação da aplicação contemplou o uso de roteamento, controle de acesso por perfis e organização modular com vistas à escalabilidade. A integração com serviços backend foi realizada por meio do padrão arquitetural Backend for Frontend (BFF), com consumo e tratamento assíncrono de dados para exibição em formulários, tabelas e dashboards. A entrega contínua da aplicação foi automatizada com ferramentas de Integração Contínua (CI) e Entrega/Implantação Contínua (CD), com monitoramento de qualidade de código por meio da ferramenta SonarQube. Como resultados, destaca-se a entrega de uma aplicação front-end modular, segura, consistente e escalável, além do aprimoramento técnico nas práticas de componentização, integração, refatoração e automação de processos. |
| Abstract: | This Final Project, developed between January 1st and September 30th, 2025, aims to demonstrate the application of the Angular 18+ framework in building a Single Page Application (SPA) web application, focusing on component standardization, code reuse, and improved user experience. The interface was built using reusable components with Angular Material and Sassy Cascading Style Sheets (SCSS), establishing unified guidelines for colors, fonts, and interactions. The application's structure included the use of routing, access control by profiles, and modular organization for scalability. Integration with backend services was performed using the Backend for Frontend (BFF) architectural pattern, with asynchronous data consumption and processing for display in forms, tables, and dashboards. Continuous delivery of the application was automated with Continuous Integration (CI) and Continuous Delivery/Deployment (CD) tools, with code quality monitoring using the SonarQube tool. As a result, the delivery of a modular, secure, consistent, and scalable front-end application stands out, in addition to technical improvements in componentization, integration, refactoring, and process automation practices. |
| URI: | http://repositorio.utfpr.edu.br/jspui/handle/1/39938 |
| Aparece nas coleções: | CP - Engenharia de Software |
Arquivos associados a este item:
| Arquivo | Descrição | Tamanho | Formato | |
|---|---|---|---|---|
| interfacewebmodularangular.pdf | 644,06 kB | Adobe PDF |  Visualizar/Abrir |
Este item está licenciada sob uma Licença Creative Commons
