Micro-Frontends Integration Strategies: Breaking Boundaries
Al-Mashhadani, Omar (2024)
Al-Mashhadani, Omar
2024
All rights reserved. This publication is copyrighted. You may download, display and print it for Your own personal use. Commercial use is prohibited.
Julkaisun pysyvä osoite on
https://urn.fi/URN:NBN:fi:amk-2024051411682
https://urn.fi/URN:NBN:fi:amk-2024051411682
Tiivistelmä
In the face of a growing emphasis on microservices architecture in software development, this study investigates its potential application in frontend development, a term referred to as 'micro-frontends'. Various resources on frontend development and microservices architecture are analysed, with the intention of outlining their definitions, benefits, and drawbacks.
Furthermore, this study highlights the increasing demand on micro-frontends pattern solutions and presents a detailed demonstration of a conventional project’s transition into a micro-frontends architecture.
This thesis focuses on the frontend infrastructure transformation of the EKE-Electronics company’s web application. The goal is to enable smoother transitions between two technologies Angular.js and React.js within a single view frame by replacing the existing iframe solution with a more efficient micro-frontends approach.
The thesis discusses three important questions relevant to the field such as what motivates companies to adopt micro-frontends architectures, the advantages, and the challenges that may arise during the implementation of micro-frontend. The thesis involves utilising existing literature, case studies, and industry reports to identify motivations behind micro-frontends adoption to address the relevant questions. Benefits are analysed and compared with another architecture, emphasising scalability and modularity. Challenges in micro-frontends implementation strategies are analysed, with a focus on modern technologies.
As a result, a functional application was developed. It met user expectations as a proof of concept migrating a micro-frontends architecture to an existing system. Further development is needed to address the application’s routing and authentication issues before it can go into production.
Furthermore, this study highlights the increasing demand on micro-frontends pattern solutions and presents a detailed demonstration of a conventional project’s transition into a micro-frontends architecture.
This thesis focuses on the frontend infrastructure transformation of the EKE-Electronics company’s web application. The goal is to enable smoother transitions between two technologies Angular.js and React.js within a single view frame by replacing the existing iframe solution with a more efficient micro-frontends approach.
The thesis discusses three important questions relevant to the field such as what motivates companies to adopt micro-frontends architectures, the advantages, and the challenges that may arise during the implementation of micro-frontend. The thesis involves utilising existing literature, case studies, and industry reports to identify motivations behind micro-frontends adoption to address the relevant questions. Benefits are analysed and compared with another architecture, emphasising scalability and modularity. Challenges in micro-frontends implementation strategies are analysed, with a focus on modern technologies.
As a result, a functional application was developed. It met user expectations as a proof of concept migrating a micro-frontends architecture to an existing system. Further development is needed to address the application’s routing and authentication issues before it can go into production.