Create a Service

Creating a new custom service involves a few important steps:

1. Create the service source file
2. Register the service in your library registration file

Create the Service

Create the service source file in a new folder within the src/services folder. For example to create a new service called ExampleService, create a new file called ExampleService.ts in src/services/ExampleService with the following content:

src/services/ExampleService.ts

import { ServiceBase } from "@vertigis/web/services";

export default class ExampleService extends ServiceBase {}

If you want your service to be able to serialize and deserialize configuration specific to the service from app.json, you can extend from ConfigurableServiceBase instead:

src/services/ExampleService.ts

import { ServiceModelProperties } from "@vertigis/web/models";

import { ConfigurableServiceBase, serializable } from "@vertigis/web/services";

interface ExampleModelProperties extends ServiceModelProperties {

exampleProperty: string;

}

@serializable

export default class ExampleService extends ConfigurableServiceBase<

ExampleModelProperties

> {

exampleProperty: string;

}

Register the Service

Finally we need to register the service with the Geocortex Web service registry so that it is aware of your new service.

To simplify the module imports, we'll make a new file in the ExampleService folder called index.ts. Note that this file is for convenience, and is not required:

src/services/ExampleService/index.ts

export { default } from "./ExampleService";

Now register your service with the service registry by modifying the src/index.ts file:

src/index.ts

import { LibraryRegistry } from "@vertigis/web/config";

import ExampleService from "./services/ExampleService";

export default function (registry: LibraryRegistry) {

// ... other item registrations

registry.registerService({

id: "example",

getService: (config) => new ExampleService(config),

// Use this setting if you want your service to load on

// application startup. Defaults to `false`.

loadOnStartup: true,

});

}

Next Steps

Deploy your Service

Learn how to deploy your custom service

Get Started

Create a Service that Manages Dynamic Data

Follow along with a more in depth service example

Get Started