Support for Single Page Application Frameworks on FrameWeb
Resumo
In the field of Web Engineering, many methods have been proposed to guide developers in designing and coding Web applications. The FrameWeb method is a model-driven approach that targets the development of systems that use certain kinds of frameworks in their architecture, proposing the use of models that incorporate concepts from these frameworks during design. Currently, the FrameWeb method does not consider SPA (Single Page Application) frameworks and, in recent years, they have gained a lot of popularity among developers. In this work, we propose to add support for SPA frameworks to FrameWeb. With our research, we have managed to update the FrameWeb meta-model so that its modeling language now supports SPA frameworks and their constructs. FrameWeb tools (graphical editor and code generator) also evolved to support the new elements. Experiments of modeling existing SPAs with this new version of FrameWeb, generating code from the models and comparing with the original, showed that, in average, around 69% of the HTML tags could be generated from the models. The support for SPA frameworks in FrameWeb allows developers to design and model their applications using constructs that relate to the frameworks used in practice, facilitating developer communication using the models and generating code to improve developer productivity.
Palavras-chave:
Web Engineering, MDD, Software Engineering, WIS Frameworks, DSL, FrameWeb, Reuse, method, language, tools, SPA Frameworks
Referências
C. Atkinson and T. Kuhne. 2003. Model-driven development: a metamodeling foundation. IEEE Software 20, 5 (2003), 36–41. https://doi.org/10.1109/MS.2003.1231149
Lorenzo Bettini. 2016. Implementing Domain Specific Languages with Xtext and Xtend - Second Edition (2nd ed.). Packt Publishing
Jagni Dasa Horta Bezerra and Cidcley Teixeira de Souza. 2019. A Model-Based Approach to Generate Reactive and Customizable User Interfaces for the Web of Things. In Proceedings of the 25th Brazillian Symposium on Multimedia and the Web (Rio de Janeiro, Brazil) (WebMedia ’19). Association for Computing Machinery, New York, NY, USA, 57–60. https://doi.org/10.1145/3323503.3360631
Rodrigo Bonifácio, Thiago M Castro, Ricardo Fernandes, Alisson Palmeira, and Uirá Kulesza. 2015. NeoIDL: A Domain-Specific Language for Specifying REST Services.. In SEKE. 613–618
Marco Brambilla, Jordi Cabot, and Manuel Wimmer. 2017. MDSE Principles. Springer International Publishing, Cham. https://doi.org/10.1007/978-3-031-02549-5
Silas Louzada Campos and Vítor E. S. Souza. 2017. FrameWeb Editor: Uma Ferramenta CASE para suporte ao Método FrameWeb. In Anais do 16º Workshop de Ferramentas e Aplicações, 23º Simpósio Brasileiro de Sistemas Multimedia e Web (WFA/WebMedia 2017). SBC, Gramado, RS, Brazil, 199–203
Nilber V. de Almeida, Silas L. Campos, and Vítor E. S. Souza. 2017. A Model-Driven Approach for Code Generation forWeb-based Information Systems Built with Frameworks. In Proc. of the 23rd Brazilian Symposium on Multimedia and the Web (WebMedia 2017). ACM, Gramado, RS, Brazil, 245–252. https://doi.org/10.1145/3126858.3126863
Marcelo Fernandes de Sousa, Raoni Kulesza, Carlos André Guimarães Ferraz, and Matheus Lima. 2019. A Generative Software Development Approach for Mulsemedia Application Domain. In Proceedings of the 25th Brazillian Symposium on Multimedia and the Web (Rio de Janeiro, Brazil) (WebMedia ’19). Association for Computing Machinery, New York, NY, USA, 29–36. https://doi.org/10.1145/3323503.3360290
Amirhossein Deljouyi and Raman Ramsin. 2022. MDD4REST: Model-Driven Methodology for Developing RESTful Web Services.. In MODELSWARD. 93–104
Rodolfo Costa do Prado and Vítor E. S. Souza. 2018. Securing FrameWeb: Supporting Role-based Access Control in a Framework-based Design Method for Web Engineering. In Proc. of the 24th Brazilian Symposium on Multimedia and the Web (WebMedia ’18). ACM, Salvador, BA, Brazil, 213–220. https://doi.org/10.1145/3243082.3243092
Hamza Ed-Douibi, Javier Luis Cánovas Izquierdo, Abel Gómez, Massimo Tisi, and Jordi Cabot. 2016. EMF-REST: generation of RESTful APIs from models. In Proceedings of the 31st Annual ACM Symposium on Applied Computing. 1446–1453.
William B. Frakes and Kyo Kang. 2005. Software reuse research: Status and future. IEEE Transactions on Software Engineering 31, 7 (2005), 529–536.
Florian Haupt, Dimka Karastoyanova, Frank Leymann, and Benjamin Schroth. 2014. A Model-Driven Approach for REST Compliant Services. In 2014 IEEE International Conference on Web Services. 129–136. https://doi.org/10.1109/ICWS.2014.30
Adrian Hernandez-Mendez, Niklas Scholz, and Florian Matthes. 2018. A Model-driven Approach for Generating RESTful Web Services in Single-Page Applications.. In MODELSWARD. 480–487
Martin Höst, Björn Regnell, and Claes Wohlin. 2000. Using Students as Subjects – A Comparative Study of Students and Professionals in Lead-Time Impact Assessment. Empirical Software Engineering5 (2000), 201–214
Beatriz Franco Martins. 2016. Evolução do Método FrameWeb para o Projeto de Sistemas de Informação Web Utilizando uma Abordagem Dirigida a Modelos. Technical Report. Dissertação de Mestrado, Programa de Pós-Graduação em Informática, Universidade Federal do Espírito Santo, Vitória, ES, Brasil
Beatriz F. Martins and Vítor E. S. Souza. 2015. A Model-Driven Approach for the Design of Web Information Systems based on Frameworks. In Proc. of the 21st Brazilian Symposium on Multimedia and the Web (WebMedia 2015). ACM, Manaus, AM, Brazil, 41–48. https://doi.org/10.1145/2820426.2820439
Douglas P. Mattos and Débora C. Muchaluat-Saade. 2018. MultiSEM: A Mulsemedia Model for Supporting the Development of Authoring Tools. In Proceedings of the 24th Brazilian Symposium on Multimedia and the Web (Salvador, BA, Brazil) (WebMedia ’18). Association for Computing Machinery, New York, NY, USA, 109–116. https://doi.org/10.1145/3243082.3243114
Yuri Oliveira, Leonardo Silveira, and Cidcley Souza. 2018. A Model-Driven Approach to Evolve Recommender Systems. In Proceedings of the 24th Brazilian Symposium on Multimedia and the Web (Salvador, BA, Brazil) (WebMedia ’18). Association for Computing Machinery, New York, NY, USA, 169–172. https://doi.org/10.1145/3243082.3267457
Brian Pando and Jose Castillo. 2022. PlantUMLGen: A tool for teaching Model Driven Development. In 2022 17th Iberian Conference on Information Systems and Technologies (CISTI). IEEE, 1–6
Oscar Pastor and Juan Carlos Molina. 2007. Model-Driven Architecture in Practice: A Software Production Environment Based on Conceptual Modeling. Springer Berlin Heidelberg, Berlin, Heidelberg. https://doi.org/10.1007/978-3-540-71868-0
Thiago Delgado Pinto, Willian Inacio Gonçalves, and Pablo Veiga Costa. 2019. User Interface Prototype Generation from Agile Requirements Specifications Written in Concordia. In Proceedings of the 25th Brazillian Symposium on Multimedia and the Web (Rio de Janeiro, Brazil) (WebMedia ’19). Association for Computing Machinery, New York, NY, USA, 61–64. https://doi.org/10.1145/3323503.3360639
Tarik Ponciano, Davi Tabosa, Windson Viana, Paulo Duarte, and Rafael Carmo. 2020. A Generative Approach for Android Sensor-Based Applications. In Proceedings of the Brazilian Symposium on Multimedia and the Web (São Luís, Brazil) (WebMedia ’20). Association for Computing Machinery, New York, NY, USA, 33–40. https://doi.org/10.1145/3428658.3430976
Davide Rossi. 2016. UML-based Model-Driven REST API Development.. In WEBIST (1). 194–201
Emmit Scott. 2015. SPA Design and Architecture: Understanding Single Page Web Applications (1st ed.). Manning Publications Co., USA
Bran Selic. 2003. The pragmatics of model-driven development. IEEE software 20, 5 (2003), 19–25.
Vítor E. S. Souza. 2007. FrameWeb: um Método baseado em Frameworks para o Projeto de Sistemas de Informação Web. Master’s thesis. Universidade Federal do Espírito Santo. [link].
Vítor E. S. Souza. 2020. The FrameWeb Approach to Web Engineering: Past, Present and Future. In Engineering Ontologies and Ontologies for Engineering (1 ed.), João Paulo A. Almeida and Giancarlo Guizzardi (Eds.). NEMO, Vitória, ES, Brazil, Chapter 8, 100–124. [link]
Claes Wohlin, Per Runeson, Martin Höst, Magnus C Ohlsson, Björn Regnell, and Anders Wesslén. 2012. Experimentation in software engineering. Springer Science & Business Media.
Lorenzo Bettini. 2016. Implementing Domain Specific Languages with Xtext and Xtend - Second Edition (2nd ed.). Packt Publishing
Jagni Dasa Horta Bezerra and Cidcley Teixeira de Souza. 2019. A Model-Based Approach to Generate Reactive and Customizable User Interfaces for the Web of Things. In Proceedings of the 25th Brazillian Symposium on Multimedia and the Web (Rio de Janeiro, Brazil) (WebMedia ’19). Association for Computing Machinery, New York, NY, USA, 57–60. https://doi.org/10.1145/3323503.3360631
Rodrigo Bonifácio, Thiago M Castro, Ricardo Fernandes, Alisson Palmeira, and Uirá Kulesza. 2015. NeoIDL: A Domain-Specific Language for Specifying REST Services.. In SEKE. 613–618
Marco Brambilla, Jordi Cabot, and Manuel Wimmer. 2017. MDSE Principles. Springer International Publishing, Cham. https://doi.org/10.1007/978-3-031-02549-5
Silas Louzada Campos and Vítor E. S. Souza. 2017. FrameWeb Editor: Uma Ferramenta CASE para suporte ao Método FrameWeb. In Anais do 16º Workshop de Ferramentas e Aplicações, 23º Simpósio Brasileiro de Sistemas Multimedia e Web (WFA/WebMedia 2017). SBC, Gramado, RS, Brazil, 199–203
Nilber V. de Almeida, Silas L. Campos, and Vítor E. S. Souza. 2017. A Model-Driven Approach for Code Generation forWeb-based Information Systems Built with Frameworks. In Proc. of the 23rd Brazilian Symposium on Multimedia and the Web (WebMedia 2017). ACM, Gramado, RS, Brazil, 245–252. https://doi.org/10.1145/3126858.3126863
Marcelo Fernandes de Sousa, Raoni Kulesza, Carlos André Guimarães Ferraz, and Matheus Lima. 2019. A Generative Software Development Approach for Mulsemedia Application Domain. In Proceedings of the 25th Brazillian Symposium on Multimedia and the Web (Rio de Janeiro, Brazil) (WebMedia ’19). Association for Computing Machinery, New York, NY, USA, 29–36. https://doi.org/10.1145/3323503.3360290
Amirhossein Deljouyi and Raman Ramsin. 2022. MDD4REST: Model-Driven Methodology for Developing RESTful Web Services.. In MODELSWARD. 93–104
Rodolfo Costa do Prado and Vítor E. S. Souza. 2018. Securing FrameWeb: Supporting Role-based Access Control in a Framework-based Design Method for Web Engineering. In Proc. of the 24th Brazilian Symposium on Multimedia and the Web (WebMedia ’18). ACM, Salvador, BA, Brazil, 213–220. https://doi.org/10.1145/3243082.3243092
Hamza Ed-Douibi, Javier Luis Cánovas Izquierdo, Abel Gómez, Massimo Tisi, and Jordi Cabot. 2016. EMF-REST: generation of RESTful APIs from models. In Proceedings of the 31st Annual ACM Symposium on Applied Computing. 1446–1453.
William B. Frakes and Kyo Kang. 2005. Software reuse research: Status and future. IEEE Transactions on Software Engineering 31, 7 (2005), 529–536.
Florian Haupt, Dimka Karastoyanova, Frank Leymann, and Benjamin Schroth. 2014. A Model-Driven Approach for REST Compliant Services. In 2014 IEEE International Conference on Web Services. 129–136. https://doi.org/10.1109/ICWS.2014.30
Adrian Hernandez-Mendez, Niklas Scholz, and Florian Matthes. 2018. A Model-driven Approach for Generating RESTful Web Services in Single-Page Applications.. In MODELSWARD. 480–487
Martin Höst, Björn Regnell, and Claes Wohlin. 2000. Using Students as Subjects – A Comparative Study of Students and Professionals in Lead-Time Impact Assessment. Empirical Software Engineering5 (2000), 201–214
Beatriz Franco Martins. 2016. Evolução do Método FrameWeb para o Projeto de Sistemas de Informação Web Utilizando uma Abordagem Dirigida a Modelos. Technical Report. Dissertação de Mestrado, Programa de Pós-Graduação em Informática, Universidade Federal do Espírito Santo, Vitória, ES, Brasil
Beatriz F. Martins and Vítor E. S. Souza. 2015. A Model-Driven Approach for the Design of Web Information Systems based on Frameworks. In Proc. of the 21st Brazilian Symposium on Multimedia and the Web (WebMedia 2015). ACM, Manaus, AM, Brazil, 41–48. https://doi.org/10.1145/2820426.2820439
Douglas P. Mattos and Débora C. Muchaluat-Saade. 2018. MultiSEM: A Mulsemedia Model for Supporting the Development of Authoring Tools. In Proceedings of the 24th Brazilian Symposium on Multimedia and the Web (Salvador, BA, Brazil) (WebMedia ’18). Association for Computing Machinery, New York, NY, USA, 109–116. https://doi.org/10.1145/3243082.3243114
Yuri Oliveira, Leonardo Silveira, and Cidcley Souza. 2018. A Model-Driven Approach to Evolve Recommender Systems. In Proceedings of the 24th Brazilian Symposium on Multimedia and the Web (Salvador, BA, Brazil) (WebMedia ’18). Association for Computing Machinery, New York, NY, USA, 169–172. https://doi.org/10.1145/3243082.3267457
Brian Pando and Jose Castillo. 2022. PlantUMLGen: A tool for teaching Model Driven Development. In 2022 17th Iberian Conference on Information Systems and Technologies (CISTI). IEEE, 1–6
Oscar Pastor and Juan Carlos Molina. 2007. Model-Driven Architecture in Practice: A Software Production Environment Based on Conceptual Modeling. Springer Berlin Heidelberg, Berlin, Heidelberg. https://doi.org/10.1007/978-3-540-71868-0
Thiago Delgado Pinto, Willian Inacio Gonçalves, and Pablo Veiga Costa. 2019. User Interface Prototype Generation from Agile Requirements Specifications Written in Concordia. In Proceedings of the 25th Brazillian Symposium on Multimedia and the Web (Rio de Janeiro, Brazil) (WebMedia ’19). Association for Computing Machinery, New York, NY, USA, 61–64. https://doi.org/10.1145/3323503.3360639
Tarik Ponciano, Davi Tabosa, Windson Viana, Paulo Duarte, and Rafael Carmo. 2020. A Generative Approach for Android Sensor-Based Applications. In Proceedings of the Brazilian Symposium on Multimedia and the Web (São Luís, Brazil) (WebMedia ’20). Association for Computing Machinery, New York, NY, USA, 33–40. https://doi.org/10.1145/3428658.3430976
Davide Rossi. 2016. UML-based Model-Driven REST API Development.. In WEBIST (1). 194–201
Emmit Scott. 2015. SPA Design and Architecture: Understanding Single Page Web Applications (1st ed.). Manning Publications Co., USA
Bran Selic. 2003. The pragmatics of model-driven development. IEEE software 20, 5 (2003), 19–25.
Vítor E. S. Souza. 2007. FrameWeb: um Método baseado em Frameworks para o Projeto de Sistemas de Informação Web. Master’s thesis. Universidade Federal do Espírito Santo. [link].
Vítor E. S. Souza. 2020. The FrameWeb Approach to Web Engineering: Past, Present and Future. In Engineering Ontologies and Ontologies for Engineering (1 ed.), João Paulo A. Almeida and Giancarlo Guizzardi (Eds.). NEMO, Vitória, ES, Brazil, Chapter 8, 100–124. [link]
Claes Wohlin, Per Runeson, Martin Höst, Magnus C Ohlsson, Björn Regnell, and Anders Wesslén. 2012. Experimentation in software engineering. Springer Science & Business Media.
Publicado
23/10/2023
Como Citar
HOPPE, Pedro Henrique Brunoro; SOUZA, Vítor Estêvão Silva.
Support for Single Page Application Frameworks on FrameWeb. In: BRAZILIAN SYMPOSIUM ON MULTIMEDIA AND THE WEB (WEBMEDIA), 29. , 2023, Ribeirão Preto/SP.
Anais [...].
Porto Alegre: Sociedade Brasileira de Computação,
2023
.
p. 260–268.
