제품 개요
무엇을 만들었는가
한국수자원공사에 납품된 GIS 기반 시설물 조회 시스템으로, 지도 기반 시설물 탐색과 상세 정보 확인을 위한 프론트엔드 화면을 담당했습니다.위치 데이터, 마커, 목록과 상세 패널이 연결되는 탐색 흐름을 구성해 지도와 시설물 정보를 한 화면에서 확인할 수 있도록 했습니다.
기술
React
Next.js
TypeScript
Tailwind CSS
PostgreSQL
HTML5
CSS3
Git
작업 범위
주요 기여
- 01React·Next.js·TypeScript 기반 GIS 웹 애플리케이션의 시설물 조회와 상세 정보 화면을 담당했습니다.
- 02위치 데이터와 지도 마커·팝업·목록·상세 패널을 연결해 지도에서 시설물을 탐색하는 흐름을 구현했습니다.
- 03API 응답 데이터를 지도와 화면 구조에 맞게 변환하고 시설물 선택 상태가 각 화면에 일관되게 반영되도록 구성했습니다.
- 04Tailwind CSS 기반 반응형 UI와 관리 화면을 개발하고 기능 단위 이슈 대응에 참여했습니다.
- 05한국수자원공사에 납품되어 실제 업무 환경에서 사용되는 시스템의 개발과 운영 환경 적용에 참여했습니다.
제약과 판단
과제
- 01시설물 위치와 상세 정보를 지도·목록·상세 패널 사이에서 확인할 때 선택 상태와 현재 맥락이 끊기지 않도록 해야 했습니다.
- 02위치 데이터와 시설물 상세 API 응답을 지도와 화면 구조에 맞게 변환하면서 다양한 화면의 표시 상태를 일관되게 유지해야 했습니다.
검증 가능한 결과
결과
01지도 마커·팝업·목록·상세 패널을 연결한 GIS 업무 UI를 구현했습니다.
02한국수자원공사에 납품되어 실제 업무 환경에서 사용되는 시스템의 개발과 운영 환경 적용에 참여했습니다.
