👉 Github Link !!! 👈

💥👊 Jao's Portfolio

기술스택

파일구조

├── component		# 렌더링할 컴포넌트를 모아놓은 폴더
├── data		# json 형태의 데이터를 관리하는 폴더
├── markdown		# markdown (.md) 파일을 모아놓은 폴더
├── pages		# route 파일을 관리하는 폴더 (required)
├── public		# 리소스 파일을 관리하는 폴더
├── types		# 타입스크립트에서 인식하지 못하는 타입을 정의하는 폴더
├── tsconfig.json	# 타입스크립트 설정
├── next.config.js	# next의 플러그인 및 웹팩 설정
└── .babelrc		# next 바벨 설정  

기능소개

• Mouse Over를 인식할 수 있도록 에니메이션 + 색전환 적용
• Email / Tellephone / Facebook 기능 제공

• card-flip 을 통해 UX를 적용하며 양면에 이미지 및 텍스트 적용

• Hover시에 Scale을 확대하며 동적인 UI 제공
• 이미지를 클릭하면 그에 대한 정보를 Modal 시각화

• 각 프로젝트를 선택적으로 볼 수 있도록 Subheader Layout 적용
• Hover시에 색전환

• Markdown파일을 컴포넌트의 일부로 사용