diff --git a/frontend/components/project/FormUpdate.vue b/frontend/components/project/FormUpdate.vue
index 4a2475ad..69ae4386 100644
--- a/frontend/components/project/FormUpdate.vue
+++ b/frontend/components/project/FormUpdate.vue
@@ -71,7 +71,7 @@ export default Vue.extend({
   async fetch() {
     const projectId = this.$route.params.id
     this.project = await this.$services.project.findById(projectId)
-    this.tags = this.project.tags.map((item: any) => item.text)
+    this.tags = this.project.tags.map((item) => item.text)
     this.isEditing = false
   },
 
diff --git a/frontend/domain/models/project/project.ts b/frontend/domain/models/project/project.ts
index 404392e3..63d2a7a3 100644
--- a/frontend/domain/models/project/project.ts
+++ b/frontend/domain/models/project/project.ts
@@ -1,3 +1,5 @@
+import { TagItem } from '~/domain/models/tag/tag'
+
 export const DocumentClassification = 'DocumentClassification'
 export const SequenceLabeling = 'SequenceLabeling'
 export const Seq2seq = 'Seq2seq'
@@ -47,7 +49,7 @@ export class Project {
     readonly allowOverlappingSpans: boolean,
     readonly enableGraphemeMode: boolean,
     readonly useRelation: boolean,
-    readonly tags: Object[],
+    readonly tags: TagItem[],
     readonly users: number[] = [],
     readonly createdAt: string = '',
     readonly updatedAt: string = '',
@@ -83,7 +85,7 @@ export class Project {
     allowOverlappingSpans: boolean,
     enableGraphemeMode: boolean,
     useRelation: boolean,
-    tags: Object[]
+    tags: TagItem[]
   ) {
     return new Project(
       id,
diff --git a/frontend/domain/models/tag/tag.ts b/frontend/domain/models/tag/tag.ts
index 57a17d5a..61b7f0ed 100644
--- a/frontend/domain/models/tag/tag.ts
+++ b/frontend/domain/models/tag/tag.ts
@@ -1,3 +1,7 @@
 export class TagItem {
-  constructor(readonly id: number, readonly text: string, readonly project: string) {}
+  constructor(readonly id: number, readonly text: string, readonly project: string | number) {}
+
+  static create(text: string): TagItem {
+    return new TagItem(0, text, 0)
+  }
 }
diff --git a/frontend/repositories/project/apiProjectRepository.ts b/frontend/repositories/project/apiProjectRepository.ts
index c1e87c6d..ae06623e 100644
--- a/frontend/repositories/project/apiProjectRepository.ts
+++ b/frontend/repositories/project/apiProjectRepository.ts
@@ -1,6 +1,7 @@
 import { Page } from '@/domain/models/page'
 import { Project } from '@/domain/models/project/project'
 import ApiService from '@/services/api.service'
+import { TagItem } from '~/domain/models/tag/tag'
 
 const sortableFieldList = ['name', 'projectType', 'createdAt', 'author'] as const
 type SortableFields = typeof sortableFieldList[number]
@@ -36,7 +37,7 @@ function toModel(item: { [key: string]: any }): Project {
     item.allow_overlapping,
     item.grapheme_mode,
     item.use_relation,
-    item.tags,
+    item.tags.map((tag: { [key: string]: any }) => new TagItem(tag.id, tag.text, tag.project)),
     item.users,
     item.created_at,
     item.updated_at,
diff --git a/frontend/services/application/project/projectApplicationService.ts b/frontend/services/application/project/projectApplicationService.ts
index 97b13dcc..209f4f9b 100644
--- a/frontend/services/application/project/projectApplicationService.ts
+++ b/frontend/services/application/project/projectApplicationService.ts
@@ -1,5 +1,6 @@
 import { Page } from '~/domain/models/page'
 import { Project } from '~/domain/models/project/project'
+import { TagItem } from '~/domain/models/tag/tag'
 import { APIProjectRepository, SearchQuery } from '~/repositories/project/apiProjectRepository'
 
 type Options = {
@@ -65,7 +66,7 @@ export class ProjectApplicationService {
       allowOverlappingSpans,
       enableGraphemeMode,
       useRelation,
-      tags.map((tag) => ({ text: tag }))
+      tags.map((tag) => TagItem.create(tag))
     )
     try {
       return await this.repository.create(project)