플러스프로젝트 배경
병리 이미지와 AI 분석 결과를 검토하는 의료 연구 서비스에서 연구 생성·수행·결과와 시험책임자 연구 관리 화면을 구현하는 프로젝트였습니다. 제공된 Figma의 36개 화면·상태를 바탕으로 폼·모달·도구 선택과 단계별 화면 이동을 연결했습니다. 담당 범위는 React 프론트엔드 전체입니다. 화면 상호작용은 로컬 상태로 처리했으며 백엔드·실제 API·연구 데이터 연동은 별도 범위였습니다. 구현 화면을 비공
프로젝트 성과
Figma 36개 화면·상태 구현
연구 생성·수행·결과와 시험책임자 연구 관리 등 프론트엔드 화면을 React·TypeScript로 구현했습니다.
연구 단계별 화면 상호작용 연결
라우팅, 폼 입력, 도구 선택과 모달을 연결하고 반복되는 화면·상태를 공통 컴포넌트로 구성했습니다.
디자인 검토용 데모 전달
구현 화면을 비공개 데모로 배포하고 디자인 피드백 반영과 재배포를 지원했습니다.
핵심 기능
연구 생성·수행 화면
연구 생성 폼과 수행 화면을 구현하고, 화면 이동·도구 선택·수행 상태·완료 및 종료 확인 모달을 React 로컬 상태로 연결했습니다.
진행 단계
화면 및 상태 구현
2026.07.
Figma 화면과 상태를 분석하고 공통 컴포넌트·라우팅·폼·모달·로컬 상태를 구현했습니다.
프로젝트 상세
병리 이미지와 AI 분석 결과를 검토하는 의료 연구 서비스의 프론트엔드를 개발했습니다. Figma 기준 36개 화면·상태를 React·TypeScript·Vite로 구현했습니다. 연구 생성 폼, 연구 수행 화면, 결과 유형별 검토 화면과 시험책임자 연구 관리 화면을 구현했습니다. 연구 목록에서 생성·수행·결과 화면으로 이동하도록 연결하고, 도구 선택·수행 상태·완료 및 종료 확인·결과 저장 모달 등 화면
