# Get started with Data Inspector Library This topic outlines how to get started quickly using the Data Inspector Library on the [HERE platform](https://account.here.com/sign-in). ## Get a HERE account Obtain access to the HERE platform through your organization administrator's invitation or [contact us](https://www.here.com/contact?intref=dev_docum) to get started. * If your company **has already established** a HERE platform organization, contact your organization admin who can invite you to join the organization. * If your company **hasn’t established** a HERE platform organization yet, [contact us](https://www.here.com/contact?intref=dev_docum). ## Get your credentials After you have created your HERE account, you must get your credentials. See [Authentication and Authorization](/identity-and-access-management/docs/here-identity-and-access-management-readme) for more information. ## Install Node.js Install [Node.js](https://nodejs.org/en/) version 12.x and above. You must install at least version 10.14.0. ## Configure the npm package manager Configure the [npm](https://www.npmjs.com/) package manager bundled with Node.js. This is necessary to run the commands in this guide. ## Install a WebGL enabled browser to see visualizations Google Chrome, Mozilla Firefox, and Apple Safari support WebGL. You can test your browser at [https://get.webgl.org/](https://get.webgl.org/). ## Install the Data Inspector Library The Data Inspector Library consists of packages that you can obtain from the [HERE Artifactory Repository](https://repo.platform.here.com/artifactory/webapp/#/artifacts/browse/tree/General/here-node). For a complete list of Data Inspector Library modules, see [Library Modules Overview](https://docs.here.com/workspace/docs/library-modules-overview). ## Create a simple web app Create a simple web app that visualizes static [GeoJSON](https://geojson.org/) data with tooltips. You can complete this example in three steps as follows: 1. [Generate base code](https://docs.here.com/workspace/docs/scaffolding) 2. [Update GeoJSON data source](https://docs.here.com/workspace/docs/update) 3. [Add tooltips and styles](https://docs.here.com/workspace/docs/tooltips) An integrated development environment (IDE) with TypeScript support is required to create this sample app, such as [Visual Studio Code](https://code.visualstudio.com/). ## Authentication and authorization Before you can use the Data INspector Library, as well as [run the embedded example applications](https://docs.here.com/workspace/docs/examples-explained), you need to obtain *platform* and *repository* credentials from the [HERE platform](\{\{portalUrlBase}}). ### HERE platform credentials The local Data Inspector application requires HERE platform credentials to authenticate and access data in catalogs and layers. Platform credentials are the `here.access.key.id` and `here.access.key.secret` from the `credentials.properties` file downloaded from the platform. For more information, see [Manage API and OAuth access](/identity-and-access-management/docs/manage-api-oauth). ### Repository credentials You need credentials to access the HERE Artifactory Repository that serves Data Inspector Library projects from a private `npm` registry. Repository credentials are stored in a Maven `settings.xml` file. You can generate and download this file from the [HERE platform](https://www.here.com/platform). Then, place the file into the `.m2` folder in your home repository. The `username` and `token` tags in `settings.xml` contain your credentials to the HERE Artifactory Repository. For more information, see the [Repository credentials](/identity-and-access-management/docs/get-platform-repository-credentials) chapter of the *Identity and Access Management Guide*. ### Basic authentication flow A basic HERE platform authentication flow is as follows: 1. The client app creates a signed request with `here.access.key.id` and `here.access.key.secret`. 2. The client app sends a request to the HERE account. 3. The HERE account responds with a JWT token for valid credentials. 4. All client app requests are signed by the JWT token. 5. The data service authorizes access with the JWT token. You can use an alternative flow to avoid entering credentials at each app launch. For protected servers with other means of authentication, such as an intranet login, [a token can be returned to a client app](https://docs.here.com/workspace/docs/example-token-provider). ### Enter your HERE platform credentials Enter your HERE platform credentials into the **Authentication** form in the local Data Inspector window, which can be found when when running [Data Inspector Library example applications](https://docs.here.com/workspace/docs/examples-explained). ![Data Inspector Authentication Form](https://files.readme.io/065c023836c89b12a49ccbad19d1277d5edf130c9fda2009852b360668c9cc6d-auth-form.png) First, you must enter the values of the `here.access.key.id` and `here.access.key.secret` properties into the **Authentication** form. You can get these details from your personal `credentials.properties` file.The web app automatically generates an access token for you, and once the token expires, the web app automatically requests a new one. Second, if you want your app to access catalog data from within a specific [project](/identity-and-access-management/docs/manage-projects), you'll need the HERE Resource Name (HRN) of that project. Projects are used to track the usage of catalogs that are on the [credit-usage report](https://platform.here.com/profile/credit-usage). You can get the project HRN you need by going to the [Project Manager](https://platform.here.com/projects/?ViewOption=projects_as_a_memeber\&SearchText=) on the HERE platform. Note To work with catalogs and layers, your application needs access permissions that are granted by catalog owners. For more information, see [Manage apps](/identity-and-access-management/docs/manage-apps). #### Auto connect This feature is available for both authentication modes. It allows you to persist the connection to the HERE platform. Once you establish a connection and toggle this switch on, the web app automatically reconnects whenever you refresh your browser window. The web app reuses the credentials of the first successful connection. Note Auto connect is disabled after you end your session by closing the tab in your browser. #### Use a local authentication file This method uses an access key ID and access key secret, but you store them in a `config.json` file. Using this method, you do not have to enter the details into the **Authentication** form. You will find an example of this file called `config.json.example` in the root directory of the web app. Save a copy of this file as `config.json`, remove the commented header, and replace the placeholder values with your credentials. To use this option, select the **Use local file** option. Fields for entering your access key and secret hide, and the application switches to the local `config.json` file. Note Do not share your local authentication file. This method of authentication should be used for local development only. If you plan to host the application, or share access to your web app with other users, remove the `config.json` file from the web application folder. Otherwise, your access credentials will be visible to anyone who has access to the web app. ## Configuration After obtaining your repository credentials, you must change the default `npm` registry to the one from which Data Inspector Library projects are served. To change the registry, run the following command: ``` npm config set @here:registry https://repo.platform.here.com/artifactory/api/npm/here-node/ ``` Then log in to the HERE Artifactory Repository with the following command: ``` npm login --registry=https://repo.platform.here.com/artifactory/api/npm/here-node/ --scope=@here ``` Enter your repository username and password from the `settings.xml`, as well as your email address. Note The command-line interface might not provide any visual feedback while you are entering your password. For example, you cannot see placeholder characters while typing your password, and > the cursor might stay in the same position. ### Set up npm to work through a proxy To set up npm to work through a proxy, you need to set the `proxy` and `https-proxy` settings with the following commands: ``` npm config set proxy http://proxy.company.com:8080 ``` and ``` npm config set https-proxy http://proxy.company.com:8080 ``` Replace the URL `http://proxy.company.com:8080` with the URL of your proxy server. Note If you have an authenticated proxy, then the URL must contain a `Username:Password` pair. If you have special characters in your password, enclose the `Username:Password` pair in double quotes as follows: ``` npm config set proxy http://"Username:Password"@proxy.company.com:8080 ``` and ``` npm config set https-proxy http://"Username:Password"@proxy.company.com:8080 ``` Once you have access to the HERE Artifactory Repository, you can find the projects for the Data Inspector Library under the `@here` namespace.