Fixes #2295 Re-adding info about the usage of npm modules.

docs/GettingStartedGuide.md

@@ -1,3 +1,161 @@
 # Getting Started Guide
 
-Please see: https://developer.here.com/tutorials/harpgl/ for further information on how to get started with harp.gl.
+Most information about usig harp.gl can be found here: https://developer.here.com/tutorials/harpgl/. For further information about usig npm modules, please see the following:
+
+## Integrate `harp.gl` into your existing Webpack based project
+
+### Introduction
+
+`harp.gl` is distributed as `CommonJS` modules conatained in `npm` packages. Modules in `CommonJS`
+format require us to use some javascript code bundler - this example will facilitate `webpack`.
+
+### Installation
+
+Install them into your project:
+
+```shell
+npm install --save @here/harp-mapview @here/harp-vectortile-datasource @here/harp-map-theme
+```
+
+You have installed 3 key components needed to render basic map:
+
+-   `@here/harp-mapview` - map renderer itself
+-   `@here/harp-vectortile-datasource` - tile provider based on OMV/MVT vector tile format
+-   `@here/harp-map-theme` - default theme and font resources required to render map in OMV/tilezen
+    scheme
+
+Since Three.js is a peer dependency of harp.gl it has to be installed as well. To get the version
+that you should install you can use npm view.
+
+```shell
+THREE=`npm view @here/harp-mapview peerDependencies.three`
+npm install --save three@$THREE
+```
+
+### Decoder bundle
+
+Our example will decode OMV/MVT tiles in Web Workers, so we can achieve high performance because creating geometry from vector tiles is CPU intensive. For this, we need to create separate bundle with code that will run in Web Workers dedicated to
+decoding.
+
+Create a file named `./harp-gl-decoders.js` to initialize the decoding service:
+
+```javascript
+import { VectorTileDecoderService } from "@here/harp-vectortile-datasource/index-worker";
+
+VectorTileDecoderService.start();
+```
+
+### Create DOM container
+
+`harp.gl` renders map on `HTML` `canvas` element. Add it to your HTML document:
+
+```html
+<!-- index.html -->
+<canvas id="mapCanvas"></canvas>
+<style>
+    #mapCanvas {
+        width: 500px;
+        height: 300px;
+        padding: 0;
+        border: 0;
+    }
+</style>
+```
+
+### Webpack configuration
+
+Install the webpack utilities into your project:
+
+```shell
+npm install --save-dev @here/harp-webpack-utils
+```
+
+Add the following lines to your `webpack.config.js`:
+
+```javascript
+const { addHarpWebpackConfig } = require("@here/harp-webpack-utils/scripts/HarpWebpackConfig");
+const myConfig = {};
+module.exports = addHarpWebpackConfig(myConfig, {
+    mainEntry: "./index.js",
+    decoderEntry: "./harp-gl-decoders.js",
+    htmlTemplate: "./index.html"
+});
+```
+
+`myConfig` is your existing Webpack configuration. Configuration values in `myConfig` will override any values generated by `addHarpWebpackConfig`.
+`./index.js` is the path to your main application code. Will be used as the entry point for the main application bundle. May be omitted if Webpack `entry` configuration is included in `myConfig`.
+`./harp-gl-decoders.js` is the path to your decoder service. Will be used as the entry point for the web worker decoder bundle. If omitted no decoder bundle will be created.
+`./index.html` is the path to your HTML template index page. May be omitted if HTML configuration is included in `myConfig`.
+
+### MapView
+
+Then, you have to create [`MapView`](https://www.harp.gl/docs/master/doc/classes/_here_harp_mapview.mapview.html) that is will render map on `mapCanvas`:
+
+```javascript
+// index.js
+import { MapView } from "@here/harp-mapview";
+
+const mapCanvas = document.getElementById("mapCanvas");
+const mapView = new MapView({
+    canvas: mapCanvas,
+    theme: "node_modules/@here/harp-map-theme/resources/berlin_tilezen_base.json",
+    // note, this URL may vary depending on configuration of webpack
+    // for this example, it is assumed that app is server from project root
+    decoderUrl: "harp-gl-decoders.bundle.js"
+    // note, this URL may vary depending on configuration of webpack
+    // for this example, it is assumed that webpack emits bundles to project root
+});
+```
+
+Next, you have to initialize default view settings like camera height over ground and location of
+map center:
+
+```javascript
+// index.js
+import { GeoCoordinates } from "@here/harp-geoutils";
+
+// ...
+mapView.camera.position.set(0, 0, 800);
+mapView.geoCenter = new GeoCoordinates(40.70398928, -74.01319808, 0);
+mapView.resize(mapCanvas.clientWidth, mapCanvas.clientHeight);
+```
+
+### Attach data source
+
+Last step is adding some
+[`VectorDataSource`](https://www.harp.gl/docs/master/doc/classes/harp_vectortile_datasource.vectortiledatasource-1.html)
+to our `MapView` instance:
+
+```javascript
+import {
+    APIFormat,
+    AuthenticationTypeMapboxV4,
+    VectorDataSource
+} from "@here/harp-vectortile-datasource";
+
+const dataSource = new VectorDataSource({
+    baseUrl: "https://vector.hereapi.com/v2/vectortiles/base/mc",
+    authenticationCode: "YOUR-APIKEY"
+});
+mapView.addDataSource(dataSource);
+```
+
+You need to [obtain an apikey](#credentials) to replace `YOUR-APIKEY` and use the service to download vector tiles.
+
+### Enable user interaction with map
+
+What we've achieved so far is basic, static non-interactive. If you want to enable control of map
+like panning, rotating use
+[`MapControls`](https://www.harp.gl/docs/master/doc/classes/_here_harp_map_controls.mapcontrols.html)
+
+Note, this requires additional module: `npm install --save @here/harp-map-controls`.
+
+```javascript
+import { MapControls } from "@here/harp-map-controls";
+MapControls.create(mapView);
+```
+
+## <a name="examples"></a> Examine examples
+
+To begin with, we suggest taking a look at our most basic example, the equivalent of a `hello_world` in
+the [examples package](../@here/harp-examples/README.md)