> For the complete documentation index, see [llms.txt](https://unicef.gitbook.io/etools-field-monitoring/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://unicef.gitbook.io/etools-field-monitoring/master-2/technical-documentation/frontend/module-structure.md).

# Module Structure

This application is based on [Etools Frontend Template App](https://github.com/unicef-polymer/etools-frontend-template).

## Files Structure

{% tabs %}
{% tab title="application\_root/:" %}
I

* `.circleci/`  &#x20;
* `assets/`  &#x20;

  ```
    \|  
    - `i18n/`  
    - `images/`  
  ```
* `src_ts/`  &#x20;

  ```
    I  
    - `components/`   
    - `config/`   
    - `endpoints/`   
    - `redux/`   
    - `routing/`   
    - `types/`   
  ```
* `package.json`  &#x20;
* `polymer.json`  &#x20;
* ...Other configuration files
  {% endtab %}
  {% endtabs %}

In the application root directory you can find all configuration files for development and build process. Here you can find Docker config files, configs for code linting, gulp config, polymer cli configuration. You can find all source files in `src_ts/` directory.

`src_ts/` directory contains `components/` directory with all application custom components, `configs/` directory with environment configuration and permission configs, `endpoints/` directory with all application endpoints, `types/` with types .

## Elements Directory Structure

{% tabs %}
{% tab title="application\_root/src/elements/ :" %}
I

* `app-shell/`  &#x20;
* `common/`  &#x20;
* `styles/`  &#x20;
* `utils/`   &#x20;
* `pages/`  &#x20;

  ```
    I  
    - `???`   
    - `???`   
    - `???` 
  ```

{% endtab %}
{% endtabs %}

In `components/` you can find:

1. `common/` directory with elements that are used in different pages several times;
2. `app-shell/` directory with application main element and base elements common to all modules (header, sidebar);
3. `utils/`  directory with helper functions;
4. `pages/` directory with elements divided by pages, which will be lazy loaded;
5. `styles/` with common styles.
