> For the complete documentation index, see [llms.txt](https://docs.adapptio.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.adapptio.com/working-with-adapptio/how-to/ui-logic/logout.md).

# Logout

### The Goal

The task is quite simple. Make a one-button application cause Logout.

![The Logout button application](https://4190342052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MjiITn8B0C9eJvihABh%2Fuploads%2FihuDnr1PrkpKylxnMhw7%2Fimage.png?alt=media\&token=b77f7504-12b9-4cff-9b8d-be9e286234d2)

### What We Are Going to Do

{% tabs %}
{% tab title="Project Structure" %}

* [ ] View\[Logout]
  * [ ] Container\[cntLogout]
    * [ ] Button\[btnLogout]
      {% endtab %}

{% tab title="View\[Logout]" %}
![](https://4190342052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MjiITn8B0C9eJvihABh%2Fuploads%2F5ZK27s9cSHdCsknuY6Yt%2Fimage.png?alt=media\&token=c0d4df88-b6e2-4bc1-bd47-98d1b3f876bb)
{% endtab %}
{% endtabs %}

### 1. Creat and Application

Binding a **Button** component with a specifically *Named route* will force an application to Logout. Let's try to make it.

1. Create a new **View** and name it `Logout`.
2. Put into a **Container**, called it `cntLogout` and set up its *Item Flex* -> `Stretch`; *Horizontal Alignment* -> `Center`; *Vertical Alignment* -> `Middle`
3. Place in a **Button**, name its *ID* -> `btnLogout` and set up as follows:
   1. *Value* -> "`Logout`"; *Width* -> `100px`
   2. *Button Type* -> `Link`; -> *Link Type* -> `Named Route`; -> *Named Route (select)* -> `logout`

That's all and we are done! Your application will log out after clicking on the button. This functionality is available after deployment and running an application.

{% tabs %}
{% tab title="btnLogout\[Type]" %}
![](https://4190342052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MjiITn8B0C9eJvihABh%2Fuploads%2FSTdCr0qqvMDgNQPVUoSA%2Fimage.png?alt=media\&token=cbe2ef67-2800-4db8-9c1a-4d06f61ceffb)
{% endtab %}
{% endtabs %}
