# Edit Code

Now that you are able to use our JavaScript SDK, it's time to build a web app.

## SDK Code Example

You can find a robust open-source code example on our [GitHub page](https://github.com/echo3Dco/echo3D-JavaScriptSDK-Example-Project).

This example project utilizes the echo3D JavaScript SDK to allow users to interact with the echo3D API via JavaScript code.

### Setup and Run

1. [Register ](https://www.echo3d.com/signup)for an account.
2. [Add ](/quickstart/add-a-3d-model.md)3D models, videos, and images to the platform.
3. Open a new terminal.
4. Run the following in the terminal:

* `git clone https://github.com/echo3Dco/echo3D-JavaScriptSDK-Example-Project.git`
* `cd echo3D-JavaScriptSDK-Example-Project`
* `start echo3D-JavaScriptSDK-Example.html`

5. Copy your API key from the top of the platform and paste it into the application.
6. Optionally do the same for the secret key on the [Security](https://docs.echo3d.com/web-console/account-pages/security-page) page of the platform, if your project has it enabled.
7. Click `Load Key`. This will allow you to keep making API calls from the same API key.
8. Copy an entry ID by clicking the icon next to the name of any model you have uploaded to the platform and paste it into the application.
9. Outputs of API calls will display as JSON in the center textbox.

<figure><img src="/files/kKGNWtEC1rd0xHhoCjJH" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/Ut74EUxIVlf7C1yIMYDG" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/VD5Ht5F6EiEnoXcoFylR" alt=""><figcaption></figcaption></figure>

## Video Tutorial

{% embed url="<https://www.youtube.com/watch?v=Oeo5ZDN81Ls>" %}

## Simple Code Example

Now that you are able to successfully fetch data into JavaScript, it's time to parse the data in your code.

You can iterate over all entries in the fetched database and parse them based on the [data structures](/api/objects.md) detailed in our API. For example:

{% tabs %}
{% tab title="app.js" %}

```javascript
...

/* Parse echo3D database */
var entries = []
for (let entry of db) { // Iterage over all database entries
  // Parse entry
  var srcFile = "https://api.echo3D.com/query?key=" + apiKey + "&file=";
  var typeFile = entry['hologram'].filename.toLowerCase().split('.').pop();
  switch (entry['hologram'].type) {
    case 'VIDEO_HOLOGRAM':
    case 'IMAGE_HOLOGRAM':
      srcFile += entry['hologram'].storageID;
      break;
    case 'MODEL_HOLOGRAM':
      switch (typeFile) {
        case 'glb':
          srcFile += entry['hologram'].storageID;
          break;
        case 'gltf':
        case 'obj':
        case 'fbx':
          srcFile += entry['additionalData'].glbHologramStorageID;
          break;
      }
      break;
    }
    
    // Parse additional data
    var x = (entry['additionalData'].x) ? 
              parseFloat(entry['additionalData'].x) : 0;
    
    // Do something with the entry
    ...
    
  }
  
  ...
```

{% endtab %}
{% endtabs %}


---

# Agent Instructions: 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.echo3d.com/javascript/edit-code.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.
