← 작업 목록

Purple AI Homepage

퍼플AI 홈페이지 리뉴얼 프로젝트

회사프론트엔드 개발 · 배포 파이프라인 구성2025.03

Next.jsShadcnTailwind CSSReact SlickNodemailerDockerJenkins

프로젝트 소개

의료 영상 솔루션 퍼플AI의 공식 홈페이지 리뉴얼 프로젝트. 엘핀 입사 후 처음 맡은 프로젝트로, Figma 시안을 퍼블리싱하는 것부터 배포 환경을 세팅하는 것까지 프론트엔드 전반을 담당했다.

내가 한 역할

시안을 그대로 옮기기보다 UI 개선안을 함께 제안하며 인터랙션을 구현했다. Shadcn과 Tailwind CSS로 모바일·태블릿·데스크탑 반응형을 대응했고, React Slick으로 메인 슬라이더를 붙였다. 문의 폼은 Nodemailer로 Gmail SMTP 발송을 구현해, 방문자가 남긴 문의가 담당자 메일로 바로 전달되게 했다.

배포는 Docker 컨테이너(볼륨 마운트, 로깅 전략)와 Jenkins CI로 구성했다. 짧은 일정 안에 퍼블리싱과 배포 환경을 함께 잡아야 했던 프로젝트라, 이후 다른 사내 프로젝트의 배포 구조를 잡을 때도 이때 정리한 방식을 기준으로 삼았다.