# Documenting the application

{% stepper %}
{% step %}

### Creating documentation

In the tab **Documentation** use the button **Add documentation**, and then enter the name of the documentation being created.

The entry should include a business description of the change - aimed at non-technical people and people interested in the product from a business perspective.

<figure><img src="https://2112972046-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2CssJT0zIo4SJQLbSZ6l%2Fuploads%2FBE1KNYcuff7lkVDiFhsU%2Fimage2024-4-2_8-35-18.png?alt=media&#x26;token=86f935fb-b8b7-4c78-b16e-ffba4c57469e" alt=""><figcaption><p><em><strong>Figure 1.</strong> Documentation creation window</em></p></figcaption></figure>
{% endstep %}

{% step %}

### Editing documentation

To edit existing documentation, go into the documentation and click the button **Edit documentation** ![Ilustracja 2](https://content.gitbook.com/content/2CssJT0zIo4SJQLbSZ6l/blobs/aBgzVwSynlSfpY4bmftU/dokumentacja_app_pliki/image2024-4-2_8-47-29.png).

The editing window is divided into a creation and a preview section. Between the screens there is a bar that allows you to change the width of both sections.

<figure><img src="https://2112972046-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2CssJT0zIo4SJQLbSZ6l%2Fuploads%2FF0WRrlOQFCHYfxSGo1of%2Fimage2024-4-2_9-19-32.png?alt=media&#x26;token=714852c3-55eb-448b-95d4-4fe4318aace7" alt=""><figcaption><p><em><strong>Figure 2.</strong> Documentation editing window</em></p></figcaption></figure>
{% endstep %}

{% step %}

### Creating entries — markdown syntax

Entries are created using the [markdown](https://www.markdownguide.org/basic-syntax/). The documentation window contains a markdown editor with preview.

Sample documentation using markdown (sample material showing various syntax elements):

{% code fullWidth="false" expandable="true" %}

```markdown
# Markdown syntax guide

## Headers
# This is a Heading h1
## This is a Heading h2
###### This is a Heading h6

## Emphasis
*This text will be italic*
_This will also be italic_
**This text will be bold**
__This will also be bold__
_You **can** combine them_

## Lists
### Unordered
* Item 1
* Item 2
  * Item 2a
  * Item 2b

### Ordered
1. Item 1
2. Item 2
3. Item 3
   1. Item 3a
   2. Item 3b

## Images
![This is an alt text.](https://avatars.githubusercontent.com/u/10759137 "This is a sample image.")

## Links
You may be using [Markdown Live Preview](https://markdownlivepreview.com/).

## Blockquotes
> Markdown is a lightweight markup language with plain-text-formatting syntax, created in 2004 by John Gruber with Aaron Swartz.
>>
>> Markdown is often used to format readme files, for writing messages in online discussion forums, and to create rich text using a plain text editor.

## Tables
| Left columns | Right columns |
| ------------- |:-------------:|
| left foo | right foo |
| left bar | right bar |
| left baz | right baz |

## Blocks of code
```

{% endcode %}

{% hint style="info" %}
The editor supports creating and previewing markdown in real time. Between the editor and the preview, you can adjust the width using the bar.
{% endhint %}
{% endstep %}

{% step %}

### Managing documentation artifacts

For a documentation artifact, you can:

* view version history,
* create a copy of the artifact,
* download it to disk.

It is enough in the **Documentation** window to click the context menu of a given artifact.

<figure><img src="https://2112972046-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2CssJT0zIo4SJQLbSZ6l%2Fuploads%2FXnkCMGqWx8IHaUVQGVZP%2Fimage2024-4-2_9-29-13.png?alt=media&#x26;token=861b6f31-c307-4b16-a5e8-d1dd8cbb09e1" alt=""><figcaption><p><em><strong>Figure 3.</strong> The application documentation list with the context menu of one of the artifacts.</em></p></figcaption></figure>
{% endstep %}
{% endstepper %}
