diff --git a/docker-run.sh b/docker-run.sh
index 0ef8a1e..decf9a6 100755
--- a/docker-run.sh
+++ b/docker-run.sh
@@ -8,7 +8,7 @@ docker rm -f nextcloud
 docker run -d --name=nextcloud -p 8080:80 -v "${PWD}:/var/www/html/custom_apps/upschooling" docker.io/nextcloud
 docker exec nextcloud chown -R 33 /var/www/html/custom_apps
 docker exec nextcloud chmod -R ug+rw /var/www/html/custom_apps
-docker exec --user 33 nextcloud bash -c 'cd /var/www/html/custom_apps/upschooling && make'
+docker exec --user 33 nextcloud bash -c 'cd /var/www/html/custom_apps/upschooling && make composer'
 docker exec --user 33 nextcloud php occ maintenance:install --database "sqlite" --admin-user "admin" --admin-pass "admin"
 docker exec --user 33 nextcloud php occ config:system:set --value=true --type=boolean debug
 docker exec --user 33 nextcloud php occ app:enable --force upschooling
diff --git a/lib/Controller/NoteApiController.php b/lib/Controller/TicketApiController.php
similarity index 91%
rename from lib/Controller/NoteApiController.php
rename to lib/Controller/TicketApiController.php
index 1667bba..d2a9d6f 100644
--- a/lib/Controller/NoteApiController.php
+++ b/lib/Controller/TicketApiController.php
@@ -3,13 +3,13 @@
 namespace OCA\UPschooling\Controller;
 
 use OCA\UPschooling\AppInfo\Application;
-use OCA\UPschooling\Service\NoteService;
+use OCA\UPschooling\Service\TicketService;
 use OCP\AppFramework\ApiController;
 use OCP\AppFramework\Http\DataResponse;
 use OCP\IRequest;
 
-class NoteApiController extends ApiController {
-	/** @var NoteService */
+class TicketApiController extends ApiController {
+	/** @var TicketService */
 	private $service;
 
 	/** @var string */
@@ -18,7 +18,7 @@ class NoteApiController extends ApiController {
 	use Errors;
 
 	public function __construct(IRequest $request,
-								NoteService $service,
+								TicketService $service,
 								$userId) {
 		parent::__construct(Application::APP_ID, $request);
 		$this->service = $service;
diff --git a/lib/Controller/NoteController.php b/lib/Controller/TicketController.php
similarity index 90%
rename from lib/Controller/NoteController.php
rename to lib/Controller/TicketController.php
index 4c37699..2b3b55f 100644
--- a/lib/Controller/NoteController.php
+++ b/lib/Controller/TicketController.php
@@ -3,13 +3,13 @@
 namespace OCA\UPschooling\Controller;
 
 use OCA\UPschooling\AppInfo\Application;
-use OCA\UPschooling\Service\NoteService;
+use OCA\UPschooling\Service\TicketService;
 use OCP\AppFramework\Controller;
 use OCP\AppFramework\Http\DataResponse;
 use OCP\IRequest;
 
-class NoteController extends Controller {
-	/** @var NoteService */
+class TicketController extends Controller {
+	/** @var TicketService */
 	private $service;
 
 	/** @var string */
@@ -18,7 +18,7 @@ class NoteController extends Controller {
 	use Errors;
 
 	public function __construct(IRequest $request,
-								NoteService $service,
+								TicketService $service,
 								$userId) {
 		parent::__construct(Application::APP_ID, $request);
 		$this->service = $service;
diff --git a/lib/Db/Note.php b/lib/Db/Note.php
deleted file mode 100644
index 36e81a9..0000000
--- a/lib/Db/Note.php
+++ /dev/null
@@ -1,21 +0,0 @@
-<?php
-
-namespace OCA\UPschooling\Db;
-
-use JsonSerializable;
-
-use OCP\AppFramework\Db\Entity;
-
-class Note extends Entity implements JsonSerializable {
-	protected $title;
-	protected $content;
-	protected $userId;
-
-	public function jsonSerialize(): array {
-		return [
-			'id' => $this->id,
-			'title' => $this->title,
-			'content' => $this->content
-		];
-	}
-}
diff --git a/lib/Db/Ticket.php b/lib/Db/Ticket.php
new file mode 100644
index 0000000..04c0943
--- /dev/null
+++ b/lib/Db/Ticket.php
@@ -0,0 +1,27 @@
+<?php
+
+namespace OCA\UPschooling\Db;
+
+use JsonSerializable;
+
+use OCP\AppFramework\Db\Entity;
+
+class Ticket extends Entity implements JsonSerializable {
+	protected $title;
+	protected $description;
+	protected $helperId;
+	protected $creatorId; // The ID of the person who created the Ticked. Usually the person who needs help.
+	protected $dueDate;
+	protected $status;
+
+	public function jsonSerialize(): array {
+		return [
+			'id' => $this->id,
+			'title' => $this->title,
+			'description' => $this->description,
+            'helperId' => $this->helperId,
+            'dueDate' => $this->dueDate,
+            'status' => $this->status,
+		];
+	}
+}
diff --git a/lib/Db/NoteMapper.php b/lib/Db/TicketMapper.php
similarity index 85%
rename from lib/Db/NoteMapper.php
rename to lib/Db/TicketMapper.php
index bd3ae2a..1f985b2 100644
--- a/lib/Db/NoteMapper.php
+++ b/lib/Db/TicketMapper.php
@@ -8,19 +8,19 @@ use OCP\AppFramework\Db\QBMapper;
 use OCP\DB\QueryBuilder\IQueryBuilder;
 use OCP\IDBConnection;
 
-class NoteMapper extends QBMapper {
+class TicketMapper extends QBMapper {
 	public function __construct(IDBConnection $db) {
-		parent::__construct($db, 'upschooling', Note::class);
+		parent::__construct($db, 'upschooling', Ticket::class);
 	}
 
 	/**
 	 * @param int $id
 	 * @param string $userId
-	 * @return Entity|Note
+	 * @return Entity|Ticket
 	 * @throws \OCP\AppFramework\Db\MultipleObjectsReturnedException
 	 * @throws DoesNotExistException
 	 */
-	public function find(int $id, string $userId): Note {
+	public function find(int $id, string $userId): Ticket {
 		/* @var $qb IQueryBuilder */
 		$qb = $this->db->getQueryBuilder();
 		$qb->select('*')
diff --git a/lib/Service/NoteService.php b/lib/Service/TicketService.php
similarity index 89%
rename from lib/Service/NoteService.php
rename to lib/Service/TicketService.php
index 8f6e167..b2966f3 100644
--- a/lib/Service/NoteService.php
+++ b/lib/Service/TicketService.php
@@ -7,15 +7,15 @@ use Exception;
 use OCP\AppFramework\Db\DoesNotExistException;
 use OCP\AppFramework\Db\MultipleObjectsReturnedException;
 
-use OCA\UPschooling\Db\Note;
-use OCA\UPschooling\Db\NoteMapper;
+use OCA\UPschooling\Db\Ticket;
+use OCA\UPschooling\Db\TicketMapper;
 
-class NoteService {
+class TicketService {
 
-	/** @var NoteMapper */
+	/** @var TicketMapper */
 	private $mapper;
 
-	public function __construct(NoteMapper $mapper) {
+	public function __construct(TicketMapper $mapper) {
 		$this->mapper = $mapper;
 	}
 
@@ -46,7 +46,7 @@ class NoteService {
 	}
 
 	public function create($title, $content, $userId) {
-		$note = new Note();
+		$note = new Ticket();
 		$note->setTitle($title);
 		$note->setContent($content);
 		$note->setUserId($userId);
diff --git a/src/App.vue b/src/App.vue
index dab9b22..b0b223d 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,215 +1,25 @@
 <template>
 	<div id="content" class="app-upschooling">
-		<AppNavigation>
-			<AppNavigationNew v-if="!loading"
-				:text="t('upschooling', 'New note')"
-				:disabled="false"
-				button-id="new-upschooling-button"
-				button-class="icon-add"
-				@click="newNote" />
-			<ul>
-				<AppNavigationItem v-for="note in notes"
-					:key="note.id"
-					:title="note.title ? note.title : t('upschooling', 'New note')"
-					:class="{active: currentNoteId === note.id}"
-					@click="openNote(note)">
-					<template slot="actions">
-						<ActionButton v-if="note.id === -1"
-							icon="icon-close"
-							@click="cancelNewNote(note)">
-							{{ t('upschooling', 'Cancel note creation') }}
-						</ActionButton>
-						<ActionButton v-else
-							icon="icon-delete"
-							@click="deleteNote(note)">
-							{{ t('upschooling', 'Delete note') }}
-						</ActionButton>
-					</template>
-				</AppNavigationItem>
-			</ul>
-		</AppNavigation>
+		<AppNavigation />
 		<AppContent>
-			<div v-if="currentNote">
-				<input ref="title"
-					v-model="currentNote.title"
-					type="text"
-					:disabled="updating">
-				<textarea ref="content" v-model="currentNote.content" :disabled="updating" />
-				<input type="button"
-					class="primary"
-					:value="t('upschooling', 'Save')"
-					:disabled="updating || !savePossible"
-					@click="saveNote">
-			</div>
-			<div v-else id="emptycontent">
-				<div class="icon-file" />
-				<h2>{{ t('upschooling', 'Create a note to get started') }}</h2>
-			</div>
+			<Ticket />
 		</AppContent>
 	</div>
 </template>
 
 <script>
-import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
 import AppContent from '@nextcloud/vue/dist/Components/AppContent'
 import AppNavigation from '@nextcloud/vue/dist/Components/AppNavigation'
-import AppNavigationItem from '@nextcloud/vue/dist/Components/AppNavigationItem'
-import AppNavigationNew from '@nextcloud/vue/dist/Components/AppNavigationNew'
 
 import '@nextcloud/dialogs/styles/toast.scss'
-import { generateUrl } from '@nextcloud/router'
-import { showError, showSuccess } from '@nextcloud/dialogs'
-import axios from '@nextcloud/axios'
+import Ticket from './Ticket'
 
 export default {
 	name: 'App',
 	components: {
-		ActionButton,
+		Ticket,
 		AppContent,
 		AppNavigation,
-		AppNavigationItem,
-		AppNavigationNew,
-	},
-	data() {
-		return {
-			notes: [],
-			currentNoteId: null,
-			updating: false,
-			loading: true,
-		}
-	},
-	computed: {
-		/**
-		 * Return the currently selected note object
-		 * @returns {Object|null}
-		 */
-		currentNote() {
-			if (this.currentNoteId === null) {
-				return null
-			}
-			return this.notes.find((note) => note.id === this.currentNoteId)
-		},
-
-		/**
-		 * Returns true if a note is selected and its title is not empty
-		 * @returns {Boolean}
-		 */
-		savePossible() {
-			return this.currentNote && this.currentNote.title !== ''
-		},
-	},
-	/**
-	 * Fetch list of notes when the component is loaded
-	 */
-	async mounted() {
-		try {
-			const response = await axios.get(generateUrl('/apps/upschooling/notes'))
-			this.notes = response.data
-		} catch (e) {
-			console.error(e)
-			showError(t('upschooling', 'Could not fetch notes'))
-		}
-		this.loading = false
-	},
-
-	methods: {
-		/**
-		 * Create a new note and focus the note content field automatically
-		 * @param {Object} note Note object
-		 */
-		openNote(note) {
-			if (this.updating) {
-				return
-			}
-			this.currentNoteId = note.id
-			this.$nextTick(() => {
-				this.$refs.content.focus()
-			})
-		},
-		/**
-		 * Action tiggered when clicking the save button
-		 * create a new note or save
-		 */
-		saveNote() {
-			if (this.currentNoteId === -1) {
-				this.createNote(this.currentNote)
-			} else {
-				this.updateNote(this.currentNote)
-			}
-		},
-		/**
-		 * Create a new note and focus the note content field automatically
-		 * The note is not yet saved, therefore an id of -1 is used until it
-		 * has been persisted in the backend
-		 */
-		newNote() {
-			if (this.currentNoteId !== -1) {
-				this.currentNoteId = -1
-				this.notes.push({
-					id: -1,
-					title: '',
-					content: '',
-				})
-				this.$nextTick(() => {
-					this.$refs.title.focus()
-				})
-			}
-		},
-		/**
-		 * Abort creating a new note
-		 */
-		cancelNewNote() {
-			this.notes.splice(this.notes.findIndex((note) => note.id === -1), 1)
-			this.currentNoteId = null
-		},
-		/**
-		 * Create a new note by sending the information to the server
-		 * @param {Object} note Note object
-		 */
-		async createNote(note) {
-			this.updating = true
-			try {
-				const response = await axios.post(generateUrl('/apps/upschooling/notes'), note)
-				const index = this.notes.findIndex((match) => match.id === this.currentNoteId)
-				this.$set(this.notes, index, response.data)
-				this.currentNoteId = response.data.id
-			} catch (e) {
-				console.error(e)
-				showError(t('upschooling', 'Could not create the note'))
-			}
-			this.updating = false
-		},
-		/**
-		 * Update an existing note on the server
-		 * @param {Object} note Note object
-		 */
-		async updateNote(note) {
-			this.updating = true
-			try {
-				await axios.put(generateUrl(`/apps/upschooling/notes/${note.id}`), note)
-			} catch (e) {
-				console.error(e)
-				showError(t('upschooling', 'Could not update the note'))
-			}
-			this.updating = false
-		},
-		/**
-		 * Delete a note, remove it from the frontend and show a hint
-		 * @param {Object} note Note object
-		 */
-		async deleteNote(note) {
-			try {
-				await axios.delete(generateUrl(`/apps/upschooling/notes/${note.id}`))
-				this.notes.splice(this.notes.indexOf(note), 1)
-				if (this.currentNoteId === note.id) {
-					this.currentNoteId = null
-				}
-				showSuccess(t('upschooling', 'Note deleted'))
-			} catch (e) {
-				console.error(e)
-				showError(t('upschooling', 'Could not delete the note'))
-			}
-		},
 	},
 }
 </script>
diff --git a/src/Ticket.vue b/src/Ticket.vue
new file mode 100644
index 0000000..9afe299
--- /dev/null
+++ b/src/Ticket.vue
@@ -0,0 +1,59 @@
+<template>
+	<div class="single-ticket">
+		<div class="header-bar">
+			<button>
+				{{ t('upschooling', 'Ticket Schließen') }}
+			</button>
+			<button>
+				{{ t('upschooling', 'Speichern') }}
+			</button>
+		</div>
+		<h2>Ticket "ding"</h2>
+		<KeyValueTable :data-rows="{Name: 'Bernd', Status: 'Offen', Ablaufdatum: 'gestern'}" />
+		<br>
+		<label for="description">{{ t('upschooling', 'Beschreibung') }}</label>
+		<textarea id="description" v-model.trim.lazy="description" rows="15" />
+		<br>
+		<button @click="save">
+			Speichern
+		</button>
+		<hr>
+		<div class="placeholder" />
+	</div>
+</template>
+
+<script>
+import KeyValueTable from './components/KeyValueTable'
+export default {
+	name: 'Ticket',
+	components: { KeyValueTable },
+	data() {
+		return {
+			description: '',
+		}
+	},
+	methods: {
+		save() {},
+	},
+}
+</script>
+
+<style scoped>
+textarea {
+	width: 100%;
+	margin: 0;
+	resize: vertical;
+}
+
+.placeholder {
+	height: 400px;
+	width: 100%;
+	background: #f0f0f0;
+}
+
+.header-bar {
+	display: flex;
+	width: 100%;
+	flex-direction: row-reverse;
+}
+</style>
diff --git a/src/components/KeyValueTable.vue b/src/components/KeyValueTable.vue
new file mode 100644
index 0000000..8b90399
--- /dev/null
+++ b/src/components/KeyValueTable.vue
@@ -0,0 +1,63 @@
+<template>
+	<table>
+		<thead>
+			<tr v-for="(value, key, i) in getHeaders" :key="i">
+				<th>{{ key }}</th>
+				<th>{{ value }}</th>
+			</tr>
+		</thead>
+		<tbody>
+			<tr v-for="(value, key, i) in dataRows" :key="i+1">
+				<td>{{ key }}</td>
+				<td>{{ value }}</td>
+			</tr>
+		</tbody>
+	</table>
+</template>
+
+<script>
+export default {
+	name: 'KeyValueTable',
+	props: {
+		dataRows: {
+			type: Object,
+			default: () => ({}),
+		},
+		header: {
+			type: Object,
+			default: () => ({}),
+		},
+	},
+	computed: {
+		getHeaders() {
+			const key = Object.keys(this.header)[0]
+			const value = this.header[key]
+			if (key && value) return { [key]: value }
+
+			return {}
+		},
+	},
+}
+</script>
+
+<style scoped>
+	table {
+		width: 100%;
+	}
+
+	td, th {
+		border-bottom: solid #000 1px;
+	}
+
+	th {
+		font-weight: bold;
+	}
+
+	thead {
+		background: #f0f0f0;
+	}
+
+	tbody tr:nth-child(2n) {
+		background: #f0f0f0;
+	}
+</style>
diff --git a/tests/Integration/NoteIntegrationTest.php b/tests/Integration/NoteIntegrationTest.php
index 6c71c42..1a73d07 100644
--- a/tests/Integration/NoteIntegrationTest.php
+++ b/tests/Integration/NoteIntegrationTest.php
@@ -7,9 +7,9 @@ use OCP\IRequest;
 use PHPUnit\Framework\TestCase;
 
 
-use OCA\UPschooling\Db\Note;
-use OCA\UPschooling\Db\NoteMapper;
-use OCA\UPschooling\Controller\NoteController;
+use OCA\UPschooling\Db\Ticket;
+use OCA\UPschooling\Db\TicketMapper;
+use OCA\UPschooling\Controller\TicketController;
 
 class NoteIntegrationTest extends TestCase {
 	private $controller;
@@ -30,13 +30,13 @@ class NoteIntegrationTest extends TestCase {
 			return $this->createMock(IRequest::class);
 		});
 
-		$this->controller = $container->query(NoteController::class);
-		$this->mapper = $container->query(NoteMapper::class);
+		$this->controller = $container->query(TicketController::class);
+		$this->mapper = $container->query(TicketMapper::class);
 	}
 
 	public function testUpdate() {
 		// create a new note that should be updated
-		$note = new Note();
+		$note = new Ticket();
 		$note->setTitle('old_title');
 		$note->setContent('old_content');
 		$note->setUserId($this->userId);
@@ -44,7 +44,7 @@ class NoteIntegrationTest extends TestCase {
 		$id = $this->mapper->insert($note)->getId();
 
 		// fromRow does not set the fields as updated
-		$updatedNote = Note::fromRow([
+		$updatedNote = Ticket::fromRow([
 			'id' => $id,
 			'user_id' => $this->userId
 		]);
diff --git a/tests/Unit/Controller/NoteApiControllerTest.php b/tests/Unit/Controller/NoteApiControllerTest.php
index 4c13eb6..83318ce 100644
--- a/tests/Unit/Controller/NoteApiControllerTest.php
+++ b/tests/Unit/Controller/NoteApiControllerTest.php
@@ -2,11 +2,11 @@
 
 namespace OCA\UPschooling\Tests\Unit\Controller;
 
-use OCA\UPschooling\Controller\NoteApiController;
+use OCA\UPschooling\Controller\TicketApiController;
 
 class NoteApiControllerTest extends NoteControllerTest {
 	public function setUp(): void {
 		parent::setUp();
-		$this->controller = new NoteApiController($this->request, $this->service, $this->userId);
+		$this->controller = new TicketApiController($this->request, $this->service, $this->userId);
 	}
 }
diff --git a/tests/Unit/Controller/NoteControllerTest.php b/tests/Unit/Controller/NoteControllerTest.php
index e96d660..bf4950a 100644
--- a/tests/Unit/Controller/NoteControllerTest.php
+++ b/tests/Unit/Controller/NoteControllerTest.php
@@ -8,8 +8,8 @@ use OCP\AppFramework\Http;
 use OCP\IRequest;
 
 use OCA\UPschooling\Service\NoteNotFound;
-use OCA\UPschooling\Service\NoteService;
-use OCA\UPschooling\Controller\NoteController;
+use OCA\UPschooling\Service\TicketService;
+use OCA\UPschooling\Controller\TicketController;
 
 class NoteControllerTest extends TestCase {
 	protected $controller;
@@ -19,10 +19,10 @@ class NoteControllerTest extends TestCase {
 
 	public function setUp(): void {
 		$this->request = $this->getMockBuilder(IRequest::class)->getMock();
-		$this->service = $this->getMockBuilder(NoteService::class)
+		$this->service = $this->getMockBuilder(TicketService::class)
 			->disableOriginalConstructor()
 			->getMock();
-		$this->controller = new NoteController($this->request, $this->service, $this->userId);
+		$this->controller = new TicketController($this->request, $this->service, $this->userId);
 	}
 
 	public function testUpdate() {
diff --git a/tests/Unit/Service/NoteServiceTest.php b/tests/Unit/Service/NoteServiceTest.php
index 416a079..51af8c5 100644
--- a/tests/Unit/Service/NoteServiceTest.php
+++ b/tests/Unit/Service/NoteServiceTest.php
@@ -7,9 +7,9 @@ use PHPUnit\Framework\TestCase;
 
 use OCP\AppFramework\Db\DoesNotExistException;
 
-use OCA\UPschooling\Db\Note;
-use OCA\UPschooling\Service\NoteService;
-use OCA\UPschooling\Db\NoteMapper;
+use OCA\UPschooling\Db\Ticket;
+use OCA\UPschooling\Service\TicketService;
+use OCA\UPschooling\Db\TicketMapper;
 
 class NoteServiceTest extends TestCase {
 	private $service;
@@ -17,15 +17,15 @@ class NoteServiceTest extends TestCase {
 	private $userId = 'john';
 
 	public function setUp(): void {
-		$this->mapper = $this->getMockBuilder(NoteMapper::class)
+		$this->mapper = $this->getMockBuilder(TicketMapper::class)
 			->disableOriginalConstructor()
 			->getMock();
-		$this->service = new NoteService($this->mapper);
+		$this->service = new TicketService($this->mapper);
 	}
 
 	public function testUpdate() {
 		// the existing note
-		$note = Note::fromRow([
+		$note = Ticket::fromRow([
 			'id' => 3,
 			'title' => 'yo',
 			'content' => 'nope'
@@ -36,7 +36,7 @@ class NoteServiceTest extends TestCase {
 			->will($this->returnValue($note));
 
 		// the note when updated
-		$updatedNote = Note::fromRow(['id' => 3]);
+		$updatedNote = Ticket::fromRow(['id' => 3]);
 		$updatedNote->setTitle('title');
 		$updatedNote->setContent('content');
 		$this->mapper->expects($this->once())