diff --git a/backend/db/cards.go b/backend/db/cards.go
index fa90d8f..8f4bc76 100644
--- a/backend/db/cards.go
+++ b/backend/db/cards.go
@@ -16,19 +16,26 @@ func CreateCard(c types.Card) (int, error) {
 	return int(id), nil
 }
 
-func GetAllCardsOf(projectID int) ([]types.Card, error) {
+func GetAllCardsOf(projectID int) ([]types.FullCard, error) {
 	rows, err := db.Query("SELECT * FROM cards WHERE project_id = ?", projectID)
 	if err != nil {
 		return nil, err
 	}
 	defer rows.Close()
 
-	var cards []types.Card
+	var cards []types.FullCard
 	for rows.Next() {
-		var c types.Card
+		var c types.FullCard
 		if err := rows.Scan(&c.ID, &c.ProjectID, &c.Title, &c.Content); err != nil {
 			return nil, err
 		}
+
+		tags, err := GetAllTagsOfCard(c.ID)
+		if err != nil {
+			return nil, err
+		}
+		c.Tags = tags
+
 		cards = append(cards, c)
 	}
 
@@ -39,14 +46,20 @@ func GetAllCardsOf(projectID int) ([]types.Card, error) {
 	return cards, nil
 }
 
-func GetCard(id int) (*types.Card, error) {
-	var c types.Card
+func GetCard(id int) (*types.FullCard, error) {
+	var c types.FullCard
 
 	err := db.QueryRow("SELECT * FROM cards WHERE id = ?", id).Scan(&c.ID, &c.ProjectID, &c.Title, &c.Content)
 	if err != nil {
 		return nil, err
 	}
 
+	tags, err := GetAllTagsOfCard(id)
+	if err != nil {
+		return nil, err
+	}
+	c.Tags = tags
+
 	return &c, nil
 }
 
diff --git a/backend/types/card.go b/backend/types/card.go
index 3fd5294..cdfbe60 100644
--- a/backend/types/card.go
+++ b/backend/types/card.go
@@ -6,3 +6,11 @@ type Card struct {
 	Title     string `json:"title"`
 	Content   string `json:"content"`
 }
+
+type FullCard struct {
+	ID        int           `json:"id"`
+	ProjectID int           `json:"project_id"`
+	Title     string        `json:"title"`
+	Content   string        `json:"content"`
+	Tags      []FullCardTag `json:"tags"`
+}
diff --git a/frontend/src/components/card.svelte b/frontend/src/components/card.svelte
index 899b926..62f8fc0 100644
--- a/frontend/src/components/card.svelte
+++ b/frontend/src/components/card.svelte
@@ -8,31 +8,21 @@
 		id: number;
 		title: string;
 		content: string;
+		tags: Tag[];
 	}
 
-	export let card: Card = {
-		id: 0,
-		title: 'No title',
-		content: 'Nocontent'
-	};
-
-	interface FullTag {
+	interface Tag {
 		tag_id: number;
 		tag_title: string;
 		value: string;
 	}
 
-	let tags: FullTag[];
-
-	onMount(async () => {
-		const response = await axios.get(`${backend}/api/cardtags/${card.id}`);
-
-		if (response.data.status === 'ok') {
-			tags = response.data.data;
-		} else {
-			console.error(response.data);
-		}
-	});
+	export let card: Card = {
+		id: 0,
+		title: 'No title',
+		content: 'Nocontent',
+		tags: []
+	};
 </script>
 
 <svelte:head>
@@ -41,11 +31,9 @@
 
 <div class="card" draggable={true}>
 	<div class="title">{card.title}</div>
-	{#if tags}
+	{#if card.tags}
 		<div class="tags">
-			<!-- <span class="tag" style="background-color: #874d45;">HIGH</span>
-			<span class="tag" style="background-color: #4a8645;">PERSONAL</span> -->
-			{#each tags as tag}
+			{#each card.tags as tag}
 				<span class="tag" style="border: 1px solid #333">{tag.value}</span>
 			{/each}
 		</div>
diff --git a/frontend/src/components/project.svelte b/frontend/src/components/project.svelte
index bca328c..ef73bfa 100644
--- a/frontend/src/components/project.svelte
+++ b/frontend/src/components/project.svelte
@@ -1,56 +1,62 @@
 <script lang="ts">
-	import axios from "axios";
-	import { onMount } from "svelte";
-	import Card from "./card.svelte";
+	import axios from 'axios';
+	import { onMount } from 'svelte';
+	import Card from './card.svelte';
 
-    export let projectId: number = 0;
+	export let projectId: number = 0;
 
-    const backend = 'http://127.0.0.1:3000';
+	const backend = 'http://127.0.0.1:3000';
 
-    interface Project {
-        id: number | undefined,
-        title: string,
-    }
+	interface Project {
+		id: number | undefined;
+		title: string;
+	}
 
-    
-    interface Card {
-        id: number,
-        title: string,
-        content: string,
-    }
-    
-    let project: Project;
-    let cards: Card[];
+	interface Tag {
+		tag_id: number;
+		tag_title: string;
+		value: string;
+	}
 
-    onMount(async () => {
-        let response = await axios.get(`${backend}/api/project/${projectId}`);
+	interface Card {
+		id: number;
+		title: string;
+		content: string;
+		tags: Tag[];
+	}
 
-        project = response.data; 
+	let project: Project;
+	let cards: Card[];
 
-        response = await axios.get(`${backend}/api/cards/${projectId}`)
+	onMount(async () => {
+		let response = await axios.get(`${backend}/api/project/${projectId}`);
 
-        if(response.data.status === "ok") {
-            cards = response.data.data;
-        } else {
-            console.error(response.data)
-        }
-    })
+		project = response.data;
+
+		response = await axios.get(`${backend}/api/cards/${projectId}`);
+
+		if (response.data.status === 'ok') {
+			cards = response.data.data;
+		} else {
+			console.error(response.data);
+		}
+	});
 </script>
 
 <svelte:head>
-    <link rel="stylesheet" type="text/css" href="/css/project.css" />
+	<link rel="stylesheet" type="text/css" href="/css/project.css" />
 </svelte:head>
 
 {#if project}
-<div id="project">
-    <h2>{project.title}</h2>
+	<div id="project">
+		<h2>{project.title}</h2>
 
-    <ul>
-        {#if cards}
-        {#each cards as card}
-            <Card {card} />
-        {/each}
-        {/if}
-    </ul>
-</div>
-{/if}
\ No newline at end of file
+		<ul>
+			{#if cards}
+				{#each cards as card}
+					<Card {card} />
+				{/each}
+			{/if}
+		</ul>
+	</div>
+{/if}