A DSL-based Approach for Code Generation and Navigation Process Management in a Single Page Application

Abstract

Single page applications (SPAs) are web applications that offer a fast and responsive user experience, but also pose some challenges in terms of navigation process management and platform compatibility. In this paper, we propose a DSL-based approach for code generation and management of SPA navigation process, based on the visual vocabulary proposed by Garrett. We use a Domain-Specific Language (DSL) to describe the elements of the SPA, such as pages, connectors, and transitions, in a concise and abstract way. We also propose a metamodel for Garrett vocabulary, which defines the concepts and relationships of the DSL. Then, we apply a Model-Driven Engineering (MDE) technique to transform the DSL specification into a platform-specific project architecture and basic code for an SPA. We present a case study of using our DSL to generate an Angular SPA and evaluate the benefits of our approach in terms of productivity, maintainability, and reusability.