Skip to content

Files

Latest commit

a9353e4 · Jun 16, 2025

History

History
70 lines (56 loc) · 6.35 KB

01_structure.md

File metadata and controls

70 lines (56 loc) · 6.35 KB

Structure

This chapter is about the general structure of the AsTeRICS Grid project:

  1. Project structure
  2. Sources structure

Back to Overview

Project structure

The AsTeRICS Grid project is hosted on GitHub. These are the main folders and files in the project:

  • app/: folder containing static and built resources for the actual AsTeRICS Grid application. Host this folder in addition to ../index.html in the root folder on webserver in order to and open the ../index.html file in order to start AsTeRICS Grid.
  • docs/: folder containing various documentation resources, e.g. this manual
  • scripts/: folder containing shell scripts, e.g. for releasing a new AsTeRICS Grid release
  • src/: folder containing Javascript sources
  • superlogin/: folder containing configuration of couch-auth (former superlogin), a library that handles users and databases for CouchDB, the database backend used by AsTeRICS Grid.
  • .gitignore: file specifying which files to ignore by Git version control
  • .prettierrc: config for Prettier code formatter
  • babel.config.js: configuration for Babel Javascript compiler, only needed for running Jest tests, other Babel configuration is found in webpack.config.js
  • CNAME: configuration file of GitHub, specifying which alternative domain points to the version that is found on the GitHub gh-pages branch. The version on this branch is the version that is delivered when opening https://grid.asterics.eu/.
  • crowdin.yml: configuration used by crowdin translation service
  • index.html: entry point of the application, uses resources from the app/ folder
  • LICENSE: file specifying the license of AsTeRICS Grid which is AGPL3.
  • package.json: npm configuration file specifying dependencies and scripts for the AsTeRICS Grid project
  • README.md: markdown readme file for the GitHub project page
  • serviceWorker.js: Service Worker that manages offline capabilities of AsTeRICS Grid using Workbox
  • unsupported.html: static HTML file that is shown if AsTeRICS Grid is opened with an unsupported browser
  • webpack.config.js: webpack configuration file specifying options for building and bundling the application
  • yarn.lock: file generated by yarn specifying the exact version of dependencies used in the project

Sources structure

All custom sources are located in the src folder which has the following structure:

  • css/: includes custom stylesheets
  • js/: all pure Javascript sources
    • externals/: folder including ES6 module wrapppers of libraries that are included externally within a <script> tag in index.html. Wrapper is needed in order to make the libraries test- and mockable with Jest.
    • input/: folder containing modules implementing various input options like hovering or scanning
    • model/: definitions of data model classes using ObjectModel
    • service/: all kind of service modules providing specific functionalities, like accessing the database or performing grid element actions
    • util/: all modules providing any general functionality that is needed by other modules or services
    • vue/: all Vue.js related modules, not including vue components
    • mainScript.js: entry point of the whole application
    • router.js: module that does routing to different views based on the current hash of the URL, e.g. #main, #login or #grids. Uses the Navigo library.
  • vue-components/: folder containing all Vue.js single-file components
    • components/: folder for general purpose components
    • modals/: folder for modal (popup) components
    • views/: folder for view components, see all kinds of views in the user documentation

Elements in folder "app/"

Besides the sources in the src/ folder the app/ folder contains these elements which in total realize the working AsTeRICS Grid application:

  • build/: folder containing a built and minified file of all sources that are included in the src/ folder. For bundling webpack is used.
  • css/: global stylesheets which are directly included in index.html. The custom ones could also be put into src/css/ and bundled with webpack.
  • dictionaries/: predictionary dictionaries including the most frequently used words of different languages. Dictionaries can be imported in the manage dictionaries view.
  • fonts/: folder containing custom fonts that can be used for element labels or PDF exports
  • img/: folder containing images and icons
  • lang/: translations files, managed by crowdin - only directly alter i18n.en.json
  • lib/: folder containing various javascript libraries, which are not imported using npm.
  • simple/: folder containing a simple version of AsTeRICS Grid which only shows simple buttons which can trigger ARE actions defined in a gridset (.grd) file (archived).
  • index.html: starting point of the application, basic html including all bundled javascript resources and libraries.
  • manifest.webmanifest: Web App Manifest file containing information about the app and making it usable as progressive web app (PWA), e.g. using and installing it in an app-like fashion on smartphones.
  • privacy_[de/en].html: static html files including privacy statements in English and German

Next Chapter →

Back to Overview