Für die Projektarbeit wird davon ausgegangen, dass die Software-Entwicklung (Programmierung und Tests) auf einem separaten (meist lokalem) "Entwicklungs"-Rechner (beispielsweise ein Windows-PC) stattfindet. Dazu wird unter anderem ein lokaler Webserver auf dem Rechner installiert. Eine "Produktionsversion" der Projektdateien wird dann (mittels Polymer-CLI) auf dieser Basis erzeugt. Dabei werden unter anderem die JavaScript-Programmcodeabschnitte "komprimiert" (= 'minified') und weitere Dateien so zusammengestellt, dass sie beim Betrieb der Internetpräsenz /App möglichst effektiv über das Internet zu den Clients (Nutzer-Browser) übermittelt werden können. Die so erzeugten kompakten Dateien werden auf den "Produktions"-Webserver übertragen.

Das openWIM-System besteht aus zwei Teilen. Zum einen die statischen Dateien, zu denen die den HTML-, CSS- und Programmcode für die projektspezifischen Komponenten gehören und zum anderen die im Projekt genutzten hinzugeladenen externen Komponenten und Scripts. In den openWIM-spezifischen Komponenten (sowie den von dort aus hinzugeladenen Scripts) steckt der Programmcode zur Nutzung der Objektdatenbank(en) und die optimierten Datenkommunikation sowie für den offline-Betrieb.

Die openWIM-spezifischen Komponenten und Scripte benötigen sowohl auf dem Entwicklungssystem als auch auf dem Produktionsserver eine "Laufzeit-Umgebung", in der basierend auf node.js weitere Software (ExpressJs, PouchDB, ...) installiert ist.

Die nachfolgend beschriebenen Installationen sind sowohl auf dem Entwicklungssystem als auch auf dem Produktions-Webserver durchzuführen:

1. Nur auf dem Entwicklungssystem: Installation von GIT:

   ie Polymer CLI -Software benötigt zu ihrer Installation eine installierte GIT -Software. Sie kann als passende Exe-Datei (beispielsweise Git-2.11.1-64-bit.exe) von https://git-scm.com/download/win heruntergeladen werden. Zur Installation von GIT muss dieses Programm ausgeführt werden.

   Die jeweils neueste Entwicklerversion kann per git clone https://github.com/git/git installiert werden.

   (In einem Artikel der c´t: "Unvergessen" wird die Nutzung von Git beschrieben.

2. Auf dem Entwicklungssystem und dem Webserver: Installation einer node.js-Umgebung:

   Das Installieren sowie Aktualisieren von Node.js und npm wird in einem separaten Dokument beschrieben.

3. Die Basis-Verzeichnisse (auf beiden Systemen) erstellen und betreten:

       mkdir wim-server
       cd wim-server

   (Bei Windows analog)

4. Bereitstellen der Datei package.json:

   Falls noch keine Datei "package.json" im Basisverzeichnis des openWIM-Servers vorhanden ist, sollte sie per

      $> npm init

   erstellt werden. Die Datei enthält dann "organisatorische" Angaben zur im Verzeichnis installierten Software. Sie wird von allen weiteren per npn installierten Modulen mit den dafür notwendigen Angaben ergänzt. Als Ergebnis wird eine Datei mit ungefähr folgendem Inhalt erzeugt:

   {
     "name": "wim-server",
     "version": "1.0.0",
     "description": "openWIM-Webserver",
     "main": "wim-server.js",
     "scripts": {
       "test": "echo \"Error: no test specified\" && exit 1",
       "postinstall": "bower install"
     },
     "author": "VB",
     "license": "ISC"
   }

5. Installation von PouchDB zusammen mit Express:

   Diese Installation erfolgt auf Windows und Unix gleichartig mit Hilfe von npm. Unter Windows muss dazu ein MS-DOS-Fenster ("Eingabeaufforderung" genannt) gestartet und auf das Verzeichnis, in das Verzeichnis des zu installierenden Servers gesetzt werden. Unter Unix analog. Dann:

      $> npm install express --save
      $> npm install body-Parser
      $> npm install pouchdb-node
      $> npm install express-pouchdb pouchdb express

   Gemeinsam mit Express, PouchDB und express-PouchDB wird das DatenbankSystem "levelDB" installiert und standardmäßig genutzt. Das PouchDB-System kann aber auch auf anderen Datenbanksystemen aufsetzen.

   Sollte auf dem Unix-Rechner noch nicht der für die Installation benötigte (mindestens) C++11 -Compiler installiert sein, gibt es bei hiltmon.com eine Anleitung dazu. (wget http://people.centos.org/tru/devtools-2/devtools-2.repo -O /etc/yum.repos.d/devtools-2.repo sowie yum install devtoolset-2-gcc devtoolset-2-binutils devtoolset-2-gcc-c++ und ggf. weiteres )

6. Installation der Datenbank-Administrations- und Testschnittstelle "Fauxton":

   ... tbd ...

   ((( Zur Nutzung von Fauxton muss ein Pouch-Server gestartet sein: ($ pouchdb-server) ?tbd?)))

7. Installation von PouchDB-Server:

   ... tbd ...

   PouchDB kann auf Windows (oder Unix-Systemen) auch unter node.js zusammen mit Express installiert werden. Damit der DB-Inspektor Fauxton genutzt werden kann, ist die Installation von pouchdb-server unter node.js sinnvoll:

   $ npm install -g pouchdb-server

   Mehr dazu bei github.
   Ob die zuvor durchgeführte Installation von express-PouchDB:

   $ npm install express-pouchdb pouchdb express

   separat notwendig war, ist unklar.

Gemäß Anleitung in "Polymer CLI" /"Set up basic app project" bzw. Polymer Project / Step 1. Get set up.

1. Die Installation von "Git" (siehe oben) wird vorausgesetzt.

2. Der front-end package Manager "Bower" wird installiert:

      npm install -g bower

3. Der "Polymer commandline Interpreter (CLI)" wird installiert:

      npm install -g polymer-cli

4. (Datei-) Grundstruktur erstellen:

   Dazu (1) zum Basisverzeichnis des Projektes gehen ( cd wim-server ) und (2) das Projekt initialisieren:

      polymer init starter-kit

   Dabei wird eine nachfolgend skizzierte Verzeichnisstruktur angelegt:

       /
       |---index.html
       |---src/
       |---bower_components/
       |---images/
       |---test/

   Darin bedeuten (1) "index.html": die "Startseite" bzw. Rahmenseite der Internetpräsenz; (2) "src": das Verzeichnis mit den projektspezifischen Komponenten etc.; (3) "bower_comnponents": das Verzeichnis aller aus Bibliotheken hinzugeladenen Komponenten etc.; (4) "images": das Verzeichnis für statische Bilddateien; (5) "test": Dateien zum Testen der projektspezifischen Komponenten.

   Die Verzeichnisnamen werden in der Polymer.json -Datei eingetragen. Es müsste also auch möglich sein, bei Bedarf eigene Bezeichner zu verwenden.

5. Die angelegten Vorlagen-Seiten ansehen:

   Einen mittels Polymer CLI bereitgestellten lokalen (Test-)Server starten:

      polymer serve --open

   Das "--open" startet den Default-Webbrowser mit http://localhost:8080 .
   Dieser einfache lokale Test-Server ist jedoch nur für die Vorlageseiten und ihre Weiterentwicklungen brauchbar. Sobald - wie bei openWIM - komplexere Anforderungen (z.B. mit Datenbasen) gestellt werden, muss ein entsprechender eigener Server zum Einsatz kommen.

Der (Test-)Server kann auch mit den zum Hochladen generierten Dateien gestartet werden:

   polymer serve build/bundled

Die so angelegten Dateien werden gemäß den Projektanforderungen geändert und ergänzt.

1. ... :

   ...

2. Einbinden von Web-Komponenten aus Element-Katalogen:

   ( Gemäß Anleitung in Polymer Project / Step 3. Add some elements )

   Zunächst wird die zu benutzende Komponente in einem der Komponenten-Kataloge gesucht. Bei webcomponents.org steht in der linken Spalte der Komponenten-Präsentationsseite das Bower-Kommando zum Einbinden /Download (beispielsweise "bower install --save PolymerElements/paper-slider"). Dazu muss derzeit zuvor noch auf das "+" in der linken Spalte geklickt werden.

   Im Root-Verzeichnis des Projektes wird dann dieses Bower-Kommando ausgeführt.

3. Einbinden der Komponente in die App-Datei:

   Die benötigte Komponente muss geladen werden. Daher muss am Anfang der HTML-Datei bei den anderen import-Anweisungen eine Zeile wie:

   eingefügt werden.

   Im HTML-Code wird an der Stelle, an der die Komponente eingebunden werden soll, ein HTML-Element wie eingetragen.

Wenn eine Internetpräsenz /App auf dem Entwicklungssystem läuft, kann es zum Produktionsserver übertragen werden. Dieses geschieht nicht durch simples Kopieren von Dateien, sondern mit Hilfe der Polymer CLI durch Zusammenstellen und Umformen der beteiligten Dateien:

1. Erstellen eines "Build" für den Webserver:

   Die Polymer CLI mit der Erstellung der Dateien für den Server beauftragen per:

       polymer build

   Es werden zwei alternative Datei-Sammlungen zusammengestellt: (1) im Verzeichnis build/unbundled für Server, die HTTP/2 mit Server Push verwenden sollen und (2) im Verzeichnis build/bundled für Server, die kein HTTP/2 Server Push verwenden sollen.

   Weiteres hierzu findet sich unter Polymer Project / Step 4. Deploy

2. Dateien zum Server übertragen:

   ... tbd ...

... tbd: Polymer CLI -Details

... tbd: Polymer CLI bei GitHub.

... tbd: Polymer Project / Serve your app