digital-edition-frontend-ng is the frontend application of the SLS platform for building digital edition web apps. It supports features typically found in digital scholarly editions, like reading texts, manuscripts, facsimiles and commentaries in parallell views, as well as media collection libraries, indices of named entities and keywords, and an integrated EPUB-viewer.
Internationalization and server-side rendering are supported out of the box, meaning that your web app will be fully indexable by search engines and readable by AI bots. The frontend app utilizes a responsive design and works on both desktop and mobile devices. Many features of the user interface are easily configurable, and theming is straightforward.
Examples of digital editions employing this frontend app include:
The app is built on Angular and uses Ionic web components.
Learn about the latest improvements.
-
Create a fork of
digital-edition-frontend-ng. Only include themainbranch. -
Rename the default branch of the forked repository
base,sharedor something similar. -
Create a new branch in the forked repository and name it
production,prodor something similar. -
Configure your project app by editing
/src/assets/config/config.ts. Documentation on the configuration options is forthcoming.
The base branch of the forked repository must never be manually modified. It must be kept as a clone of the original ”upstream” main branch in digital-edition-frontend-ng. When the upstream main branch is updated, you can sync the updates to the base branch in your forked repository. You can then merge the base branch into your production branch.
This workflow enables updates to the app in the original, upstream repository to be easily distributed to forked project repositories.
By default, the app has Swedish and Finnish language versions enabled. See the documentation (forthcoming) on how to configure internationalization, customize your app, build it for production and deploy it.
- Install Node.js which includes npm. The app is compatible with Node
^18.19.1,^20.11.1and^22.0.0. Check your Node version with:
Node --version
- Install the Angular CLI globally:
npm install -g @angular/cli
-
Clone the repository locally and
cdinto the folder. On Windows you can use GitHub Desktop or Git Bash (see tutorial on Git Bash). -
Install dependencies:
npm install
To build and serve the application on a development server as a client-side app only, run:
npm run start
Open your browser on http://localhost:4200/. The app will automatically rebuild and reload if you change any of the source files.
To build the server-side rendered application, run:
npm run build:ssr
Then, to serve the app, run:
npm run serve:ssr
Open your browser on http://localhost:4201/. You need to manually run the build and serve commands again for changes in the source files to take effect.
digital-edition-frontend-ng is an updated version of digital_edition_web, which is an outdated Ionic 3 / Angular 5 frontend app.
The platform consists of an Angular frontend app, a Flask-driven REST API, a backend search app run by the Elastic (ELK) Stack, a template for a backend files repository and a database template. There is also a tool for creating commentaries to texts in TEI-XML format.