> For the complete documentation index, see [llms.txt](https://api.lampix.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://api.lampix.co/application-development/lampixjs/examples/counter-app.md).

# Counter App

The code below is available in the [minimal sample](https://github.com/lampix-org/minimal-sample) on our GitHub, that is based on our [boilerplate](https://github.com/lampix-org/lampixjs-core/tree/639edea90f491f5037788d0e41d191d094f22c94/docs/app-dev/lampixjs/boilerplate.md).

```javascript
import lampix from '@lampix/core';
import lampixDOM from '@lampix/dom';

import './styles.css';

let counter = 0;

const counterElement = document.getElementsByClassName('counter')[0];
counterElement.textContent = 'Loading...';

const increaseCount = () => {
  counter++;
};

const updateCounterElement = () => {
  counterElement.textContent = counter;
};

const initialize = async () => {
  const counterButtonOptions = {
    label: 'Increase count',
    labelPosition: 'top',
    scaleFactor: 1.2,
    animationDuration: 250
  };

  const closeButtonOptions = {
    label: 'Close App',
    labelPosition: 'top',
    scaleFactor: 1.2,
    animationDuration: 500
  };

  const callback = () => {
    increaseCount();
    updateCounterElement();
  };

  const counterButtonPromise = lampixDOM.buttons.generate(
    window.innerWidth / 2,
    window.innerHeight - 120,
    callback,
    counterButtonOptions
  );

  const closeAppButtonPromise = lampixDOM.buttons.generate(
    100,
    100,
    lampix.exit,
    closeButtonOptions
  );

  await counterButtonPromise;
  await closeAppButtonPromise;

  updateCounterElement();
};

initialize();
```