dasch-swiss / knora-ui

Reusable GUI elements for Knora
https://dasch-swiss.github.io/knora-ui
7 stars 1 forks source link
angular angular-material npm-module npm-package

Knora-ui modules

Codacy Badge Build Status CircleCI

This is the demo and developing environment for Knora ui modules.

The modules helps to create a graphical user interface, a web application to use Knora in a quick and simple way. The modules are written in typescript to use them with Angular (version 8). We decided to style the components and directives with material design.

But you can use only @knora/core which contains almost all services for the Knora web API. Knora is a software framework for storing, sharing, and working with primary sources and data in the humanities.

Knora and the Knora ui modules is free software, released under the GNU Affero General Public.

This version of Knora-ui requires Knora-api version ^12.0.0.

Published modules

@knora/core

npm

The core module contains every service to use Knora's RESTful webapi. read more...


@knora/search

npm

Search module allows to make simple searches or extended searches in Knora. In extended search, resource class and its properties related to one specific ontology are selected to create your query. read more...


@knora/viewer

npm

The viewer module contains object components to show the resource class representations from Knora, the gui-elements for the property values and different kind of view frameworks. read more...


@knora/action

npm

The action module contains special buttons (e.g. to sort a list), pipes and directives. read more...


Developers note

Prerequisites

We develop the Knora-ui modules with Angular 8, especially with Angular-cli, which requires the following tools:

Yarn

We use yarn instead of npm. To install yarn on macOS:

$ brew install yarn

For other platforms, please go to the yarn website.

Node

Install Node in version 10.9.0 or later. The easiest way to install node in the correct version is to use 'n':

$ yarn global add n
$ n v10.9.0

First steps

Install the node packages with:

$ yarn install --prod=false

and build the libraries with:

$ yarn build-lib

Develop

If you want to add more components, services and so on to a module library, you can do it with:

$ ng generate component [path/in/your/module/][name-of-component] --project @knora/[module-name] --styleext scss

It puts the component or the service into lib/ directly. Otherwise you can define a path inside of lib/.

Before using the module inside of the app, you have to rebuild after the changes: ng build @knora/[module-name].

Run the demo app

Run the app with ng s. The demo app runs on http://0.0.0.0:4200 and we use it for documentation on Knora-ui Github page.

There's a test environment for the modules on https://github.com/dhlab-basel/knora-ui-playground with yalc


YALC

Better workflow than npm | yarn link for package authors.

Yalc publishes the packages to a local store (not the npm website). From there, the packages can be added to your depending project.

Install yalc:

$ yarn global add yalc

Usage

Publish library to local store:

$ yarn build-lib-prod
$ yarn yalc-publish

Use them in your application:

$ yalc add @knora/action
$ yalc add @knora/core
$ yalc add @knora/search
$ yalc add @knora/viewer

To remove from the project and restore package.json run:

$ yalc remove --all