> For the complete documentation index, see [llms.txt](https://docs.os.uk/os-apis/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.os.uk/os-apis/accessing-os-apis/os-vector-tile-api/getting-started/create-a-web-application-using-the-os-vector-tile-api.md).

# Create a web application using the OS Vector Tile API

This guide explains how to create a web application using the OS Vector Tile API and the Ordnance Survey GitHub Demo repository.

## What you need?

* Basic web development skills
* Access to an IDE
* Access to the [OS Data Hub API Demos](https://github.com/OrdnanceSurvey/OS-Data-Hub-API-Demos) GitHub repository
* OS Vector Tiles API Project Key; see [Getting started with an API project](/os-apis/core-concepts/getting-started-with-an-api-project.md) for more information

## Instructions

{% stepper %}
{% step %}
**Download the OS Vector Tile API repository**

* Open the [OS Data Hub API Demos](https://github.com/OrdnanceSurvey/OS-Data-Hub-API-Demos) repository on GitHub.

<figure><img src="/files/MS5m00A6gL0lgfFvW8vI" alt="OS Data Hub API Demos repository on GitHub"><figcaption></figcaption></figure>

* Click the green *Code* button and then click *Download ZIP*.

<figure><img src="/files/nUmpLD5VCTjHbTFBTZcu" alt="OS Data Hub API Demos repository Code > Download ZIP option"><figcaption></figcaption></figure>
{% endstep %}

{% step %}
**Install the OS Vector Tile API repository**

* Navigate to your downloads page, unzip the `OSVectorTileAPI` folder from the newly downloaded file and place it in your IDE project repository. When you open your IDE, the new files should appear automatically in your project window. The folders you have installed contain all the code required to call and interact with the code libraries.

<figure><img src="/files/ajytYCNE1fT7xVoSVDNf" alt="UnzippedOSVectorTileAPI folders"><figcaption></figcaption></figure>

* To launch the web application, navigate to and open the `index.html` file found in the `OpenLayers` folder, and then run the application. Methods on how to do this differ between IDEs.

<figure><img src="/files/NML9z7nkMCs5KeQdAW60" alt="OS VTS API in Aptana Studio 3"><figcaption></figcaption></figure>

Running the project launches a window in your browser that looks like this:

<figure><img src="/files/DBrQBrrm1guUqiPxZf4d" alt="OS Vector Tile API demonstrator displayed in a browser window"><figcaption></figcaption></figure>
{% endstep %}

{% step %}
**Using the OS Vector Tile API demo**

To use the demo, open up your *My projects* page on the OS Data Hub and copy your *Project API Key*. Paste the key into the Project API Key box on the local server demo.

\_This generates a fully-styled map using the OS Vector Tile API service available for you to explore.

<figure><img src="/files/8t844lryHGsDkARRp38N" alt="OS Vector Tile API demonstrator displaying an example map"><figcaption></figcaption></figure>
{% endstep %}
{% endstepper %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.os.uk/os-apis/accessing-os-apis/os-vector-tile-api/getting-started/create-a-web-application-using-the-os-vector-tile-api.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
