update: add project dialog

jaemin-s · Dec 1, 2024 · 186c662 · 186c662
1 parent 333874d
commit 186c662
Show file tree

Hide file tree

Showing 10 changed files with 474 additions and 93 deletions.
diff --git a/app/data/repositories/ProjectRepositoryImpl.ts b/app/data/repositories/ProjectRepositoryImpl.ts
@@ -0,0 +1,264 @@
+import { ProjectItem } from '@/app/domain/entities/project.entity'
+import { ProjectType } from '@/app/domain/enums/project.enum'
+import { ProjectRepository } from '@/app/domain/repositories/project.repo'
+
+export class ProjectRepositoryImpl implements ProjectRepository {
+  private readonly mockData: ProjectItem[] = [
+    {
+      title: '오초이스',
+      description: '오초이스 설명 입니다',
+      period: '2024.01 ~ 2024.12',
+      image: 'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/netflix.webp',
+      type: ProjectType.WORK,
+      features: [
+        {
+          title: '주요 기능 이름',
+          description: '기술 설명입니다.',
+        },
+      ],
+      company: '(주)홈초이스',
+      links: { demo: 'https://www.netflix.com/kr/', github: '' },
+      stackBadges: ['React', 'TypeScript'],
+      previewUrls: [
+        'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/netflix.webp',
+        'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/tving.webp',
+      ],
+      stackCategories: [
+        {
+          title: '상태 관리',
+          stacks: ['Redux', 'React Query'],
+        },
+        { title: '스타일링', stacks: ['Tailwind CSS'] },
+        { title: '테스팅', stacks: ['Jest'] },
+        { title: '개발 도구', stacks: ['ESLint', 'Prettier'] },
+        { title: '빌드 도구', stacks: ['Next.js'] },
+      ],
+      functions: [
+        {
+          title: '주요 기술 1',
+          description: ['기술 설명입니다', '도입 이유입니다'],
+          comment: '추가적인 코멘트 자리입니다',
+        },
+        {
+          title: '주요 기술 2',
+          description: ['기술 설명입니다', '도입 이유입니다'],
+          comment: '추가적인 코멘트 자리입니다',
+        },
+      ],
+    },
+    {
+      title: '오초이스',
+      description: '오초이스 설명 입니다',
+      period: '2024.01 ~ 2024.12',
+      image: 'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/tving.webp',
+      type: ProjectType.PERSONAL,
+      features: [
+        {
+          title: '주요 기능 이름',
+          description: '기술 설명입니다.',
+        },
+      ],
+      company: '(주)홈초이스',
+      links: { demo: 'https://www.netflix.com/kr/', github: '' },
+      stackBadges: ['React', 'TypeScript'],
+      previewUrls: [
+        'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/netflix.webp',
+        'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/tving.webp',
+      ],
+      stackCategories: [
+        {
+          title: '상태 관리',
+          stacks: ['Redux', 'React Query'],
+        },
+        { title: '스타일링', stacks: ['Tailwind CSS'] },
+        { title: '테스팅', stacks: ['Jest'] },
+        { title: '개발 도구', stacks: ['ESLint', 'Prettier'] },
+        { title: '빌드 도구', stacks: ['Next.js'] },
+      ],
+      functions: [
+        {
+          title: '주요 기술 1',
+          description: ['기술 설명입니다', '도입 이유입니다'],
+          comment: '추가적인 코멘트 자리입니다',
+        },
+        {
+          title: '주요 기술 2',
+          description: ['기술 설명입니다', '도입 이유입니다'],
+          comment: '추가적인 코멘트 자리입니다',
+        },
+      ],
+    },
+    {
+      title: '오초이스',
+      description: '오초이스 설명 입니다',
+      period: '2024.01 ~ 2024.12',
+      image: 'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/netflix.webp',
+      type: ProjectType.PERSONAL,
+      features: [
+        {
+          title: '주요 기능 이름',
+          description: '기술 설명입니다.',
+        },
+      ],
+      company: '(주)홈초이스',
+      links: { demo: 'https://www.netflix.com/kr/', github: '' },
+      stackBadges: ['React', 'TypeScript'],
+      previewUrls: [
+        'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/netflix.webp',
+        'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/tving.webp',
+      ],
+      stackCategories: [
+        {
+          title: '상태 관리',
+          stacks: ['Redux', 'React Query'],
+        },
+        { title: '스타일링', stacks: ['Tailwind CSS'] },
+        { title: '테스팅', stacks: ['Jest'] },
+        { title: '개발 도구', stacks: ['ESLint', 'Prettier'] },
+        { title: '빌드 도구', stacks: ['Next.js'] },
+      ],
+      functions: [
+        {
+          title: '주요 기술 1',
+          description: ['기술 설명입니다', '도입 이유입니다'],
+          comment: '추가적인 코멘트 자리입니다',
+        },
+        {
+          title: '주요 기술 2',
+          description: ['기술 설명입니다', '도입 이유입니다'],
+          comment: '추가적인 코멘트 자리입니다',
+        },
+      ],
+    },
+    {
+      title: '오초이스',
+      description: '오초이스 설명 입니다',
+      period: '2024.01 ~ 2024.12',
+      image: 'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/tving.webp',
+      type: ProjectType.WORK,
+      features: [
+        {
+          title: '주요 기능 이름',
+          description: '기술 설명입니다.',
+        },
+      ],
+      company: '(주)홈초이스',
+      links: { demo: 'https://www.netflix.com/kr/', github: '' },
+      stackBadges: ['React', 'TypeScript'],
+      previewUrls: [
+        'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/netflix.webp',
+        'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/tving.webp',
+      ],
+      stackCategories: [
+        {
+          title: '상태 관리',
+          stacks: ['Redux', 'React Query'],
+        },
+        { title: '스타일링', stacks: ['Tailwind CSS'] },
+        { title: '테스팅', stacks: ['Jest'] },
+        { title: '개발 도구', stacks: ['ESLint', 'Prettier'] },
+        { title: '빌드 도구', stacks: ['Next.js'] },
+      ],
+      functions: [
+        {
+          title: '주요 기술 1',
+          description: ['기술 설명입니다', '도입 이유입니다'],
+          comment: '추가적인 코멘트 자리입니다',
+        },
+        {
+          title: '주요 기술 2',
+          description: ['기술 설명입니다', '도입 이유입니다'],
+          comment: '추가적인 코멘트 자리입니다',
+        },
+      ],
+    },
+    {
+      title: '오초이스',
+      description: '오초이스 설명 입니다',
+      period: '2024.01 ~ 2024.12',
+      image: 'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/netflix.webp',
+      type: ProjectType.WORK,
+      features: [
+        {
+          title: '주요 기능 이름',
+          description: '기술 설명입니다.',
+        },
+      ],
+      company: '(주)홈초이스',
+      links: { demo: 'https://www.netflix.com/kr/', github: '' },
+      stackBadges: ['React', 'TypeScript'],
+      previewUrls: [
+        'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/netflix.webp',
+        'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/tving.webp',
+      ],
+      stackCategories: [
+        {
+          title: '상태 관리',
+          stacks: ['Redux', 'React Query'],
+        },
+        { title: '스타일링', stacks: ['Tailwind CSS'] },
+        { title: '테스팅', stacks: ['Jest'] },
+        { title: '개발 도구', stacks: ['ESLint', 'Prettier'] },
+        { title: '빌드 도구', stacks: ['Next.js'] },
+      ],
+      functions: [
+        {
+          title: '주요 기술 1',
+          description: ['기술 설명입니다', '도입 이유입니다'],
+          comment: '추가적인 코멘트 자리입니다',
+        },
+        {
+          title: '주요 기술 2',
+          description: ['기술 설명입니다', '도입 이유입니다'],
+          comment: '추가적인 코멘트 자리입니다',
+        },
+      ],
+    },
+    {
+      title: '오초이스',
+      description: '오초이스 설명 입니다',
+      period: '2024.01 ~ 2024.12',
+      image: 'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/netflix.webp',
+      type: ProjectType.WORK,
+      features: [
+        {
+          title: '주요 기능 이름',
+          description: '기술 설명입니다.',
+        },
+      ],
+      company: '(주)홈초이스',
+      links: { demo: '', github: '' },
+      stackBadges: ['React', 'TypeScript'],
+      previewUrls: [
+        'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/netflix.webp',
+        'https://github.com/jaemin-s/jaemin-s/raw/refs/heads/main/image/portfolio/tving.webp',
+      ],
+      stackCategories: [
+        {
+          title: '상태 관리',
+          stacks: ['Redux', 'React Query'],
+        },
+        { title: '스타일링', stacks: ['Tailwind CSS'] },
+        { title: '테스팅', stacks: ['Jest'] },
+        { title: '개발 도구', stacks: ['ESLint', 'Prettier'] },
+        { title: '빌드 도구', stacks: ['Next.js'] },
+      ],
+      functions: [
+        {
+          title: '주요 기술 1',
+          description: ['기술 설명입니다', '도입 이유입니다'],
+          comment: '추가적인 코멘트 자리입니다',
+        },
+        {
+          title: '주요 기술 2',
+          description: ['기술 설명입니다', '도입 이유입니다'],
+          comment: '추가적인 코멘트 자리입니다',
+        },
+      ],
+    },
+  ]
+
+  getProjectList(): ProjectItem[] {
+    return this.mockData
+  }
+}
diff --git a/app/data/repositories/index.ts b/app/data/repositories/index.ts
@@ -1,5 +1,7 @@
 import { CareerRepositoryImpl } from './CareerRepositoryImpl'
+import { ProjectRepositoryImpl } from './ProjectRepositoryImpl'
 import { SkillRepositoryImpl } from './SkillRepositoryImpl'
 
 export const skillRepository = new SkillRepositoryImpl()
 export const CareerRepository = new CareerRepositoryImpl()
+export const ProjectRepository = new ProjectRepositoryImpl()
diff --git a/app/domain/entities/common.entity.ts b/app/domain/entities/common.entity.ts
@@ -4,3 +4,10 @@ export interface ChildrenProps {
   children: ReactNode
   className?: ''
 }
+
+export interface DialogProps {
+  isOpen: boolean
+  children: ReactNode
+  maxWidth?: string
+  onClose: () => void
+}
diff --git a/app/domain/entities/project.entity.ts b/app/domain/entities/project.entity.ts
@@ -3,22 +3,41 @@ import { ProjectType } from '../enums/project.enum'
 export interface ProjectItem {
   title: string
   description: string
-  simpleStack: string
-  detailStacks: StackDescriptions[]
   period: string
   image: string
+  links: ProjectLinks
+  stackBadges: string[]
+  previewUrls: string[]
   type: ProjectType
-  features: string[]
+  stackCategories: StackCategory[]
+  features: Feature[]
+  functions: FunctionDecription[]
   company: string
-  links: ProjectLinks
 }
 
 export interface ProjectLinks {
   github: string
   demo: string
 }
 
-export interface StackDescriptions {
+export interface ProjectItemProps {
+  item: ProjectItem
+  onClickDetailButton: (arg0: ProjectItem) => void
+}
+
+export interface Feature {
   title: string
   description: string
+  comment?: string
+}
+
+export interface FunctionDecription {
+  title: string
+  description: string[]
+  comment?: string
+}
+
+export interface StackCategory {
+  title: string
+  stacks: string[]
 }
diff --git a/app/domain/repositories/project.repo.ts b/app/domain/repositories/project.repo.ts
@@ -0,0 +1,5 @@
+import { ProjectItem } from '../entities/project.entity'
+
+export interface ProjectRepository {
+  getProjectList(): ProjectItem[]
+}