👤 Summary
신태일
Frontend EngineerReact 생태계 기반의 사용자 경험(UX)과 함께 일하는 팀의 개발자 경험(DX)을 함께 고민하는 프론트엔드 엔지니어입니다.
공공기관 SI 환경에서 비표준 라이브러리의 React 통합과 동적 렌더링 구조 설계를 통해 반복되는 작업의 비효율을 줄이는 데 집중해 왔습니다.
AI 도구로 구현 속도를 높이는 한편, 핵심 비즈니스 로직은 직접 설계하고 검증하며 안정성을 유지하려 합니다.
💼 Career
(주)클라모스
인프라개발팀 / 연구원
공공기관 대상의 대규모 엔터프라이즈 시스템 통합(SI) 전문 기업
한국환경공단 올바로 차세대 시스템 구축
- 프로젝트 단독 운영 및 고객 대응6개월 팀 개발 후 4개월 단독 운영으로 전환하여, 추가 기능 개발과 안정화, 배포 전반을 단독 담당했습니다. 운영 기간 동안 고객사와 직접 기술 협의를 진행하며 요구사항을 조율했습니다.
- 비표준 그리드 라이브러리(ibSheet)의 React 통합폐쇄망 환경에서 사용해야 했던 ibSheet가 React의 라이프사이클과 어긋나며, 서버 데이터 갱신 시 상태 동기화 불일치로 테이블이 재렌더링되거나 무한 스크롤 threshold 통과 시 데이터 로딩이 끊기는 문제가 있었습니다. 커스텀 훅 기반의 라이프사이클 래퍼를 설계해 발견된 이슈들을 해결하고, React 패턴과 일관되게 사용 가능한 인터페이스로 정리했습니다.
- 반복 서식 대응을 위한 동적 렌더링 구조 설계50여 종의 공공기관 서식을 매번 정적으로 구현하던 작업의 비효율을 줄이기 위해, 스키마를 주입하면 UI가 자동 구성되는 동적 렌더링 구조를 설계했습니다. 신규 서식 추가 시 컴포넌트 작성 없이 스키마 정의만으로 대응 가능하도록 개선했습니다.
- 폐쇄망 환경에서의 개발 생산성 개선외부 라이브러리 도입이 제한된 환경에서 디버깅에 필요한 최소 기능의 JSON Viewer를 직접 구현해 팀 내 디버깅 시간 단축에 기여했습니다. FSD 기반의 전역 UI 시스템과 폐쇄망 전용 기술 문서를 구축해 팀 표준을 정립했고, 평소 부족했던 영역(IP, HTTPS 등 네트워크 기초)을 학습한 뒤 팀원 7명 대상으로 사내 세미나를 진행하며 지식 공유 문화에 기여했습니다.
해양경찰 장구류 관리 시스템 고도화
FSD 아키텍처 환경에서의 공통 UI 시스템 구축 및 문서화
- 공통 UI 시스템(Modal/Overlay) 설계도메인별 독립 개발이 중심이던 FSD 구조에서 공통 모달과 오버레이 컴포넌트가 누락되어 있어, 다양한 API 응답 모델에 유연하게 대응할 수 있는 인터페이스로 설계했습니다. 실제 API 연동을 통해 동작을 검증한 뒤 팀에서 사용할 수 있도록 정리했습니다.
- 폐쇄망 환경을 고려한 기술 문서 구축외부 인터넷 사용이 제한적인 폐쇄망 환경을 고려하여, 개발 폴더 내에서 바로 접근 가능한 기술 문서(Docs)를 구축했습니다. 별도의 외부 참조 없이도 팀원이 공통 컴포넌트의 사용법을 확인하고 즉시 활용할 수 있도록 정리했습니다.
🛡️ Approach
실무에서 마주친 문제들을 풀어내며 중요하게 보게 된 네 가지 관점입니다.
반복을 줄이는 구조 설계
같은 작업이 반복된다는 신호를 만나면 구조를 다시 봅니다. 매번 정적으로 짜던 화면을 스키마 기반의 동적 렌더링 구조로 옮긴 경험이 있습니다.
라이브러리와 환경의 결을 맞추는 통합
React가 기대하는 패턴과 외부 라이브러리·환경의 동작이 어긋날 때, 그 사이를 메우는 인터페이스를 설계합니다. 비표준 라이브러리와 명령형 SDK를 React 라이프사이클에 맞춰 통합한 경험이 있습니다.
AI를 동반자로, 검증은 직접
AI 도구로 구현 속도를 높이되, 핵심 비즈니스 로직과 상태 흐름은 직접 설계하고 검증합니다. 빠른 구현과 신뢰할 수 있는 동작 사이의 균형을 찾으려 합니다.
프론트엔드 너머의 환경도 함께 본다
프론트엔드 코드만으로 해결되지 않는 환경 제약을 만났을 때, 필요한 만큼 그 너머의 영역도 들여다보려 합니다. 폐쇄망 환경에서 부족했던 영역을 학습하고 팀에 공유한 경험이 있습니다.
🛠️ SkillSet
프로젝트에서 사용해 본 기술을 네 개 계층으로 나눠 정리했습니다. 레이어를 클릭해 기술 구성을 확인해보세요.
Core: 프론트엔드 & 라우팅
React와 Next.js(App Router)를 기반으로 화면을 구성합니다. TypeScript의 타입 시스템과 TailwindCSS의 유틸리티 클래스를 조합해 일관성 있는 UI를 유지하려 합니다.
Data: 데이터 & 상태 관리
서버 상태와 클라이언트 상태의 역할을 구분해 관리하는 데 익숙합니다. 프로젝트 성격에 따라 TanStack Query 또는 Apollo Client를 사용했으며, 폼과 데이터 유효성 검증에는 React Hook Form과 Zod를 조합합니다.
Infra: 인프라 & 협업
Vercel과 EC2를 사용해 직접 배포해 본 경험이 있습니다. Git/Jira/Confluence/Notion 등 실무 협업 도구에 익숙하며, MSW와 Vitest로 테스트와 모킹 환경을 구성하는 데 친숙합니다.
Extra: 부가적으로 다뤄본 기술
주력은 아니지만 프로젝트 과정에서 함께 다뤄본 기술들입니다. Framer Motion으로 인터랙션을 구성하거나, i18next로 다국어 환경을 구성하거나, OpenAI API를 활용해본 경험이 있습니다.
🎓 Education & Awards
Education & Activity
서경대학교
2019.03 — 2025.08소프트웨어학과
자료구조, 알고리즘 등 CS 기초 역량을 다졌으며, 배움에 대한 집요함으로 꾸준한 성적 향상을 이뤄냈습니다.
구름톤 유니브 3기
2024.09 — 2025.01구름과 카카오 주관 전국 대학생 IT 연합 동아리
- • 서경대 구름톤 유니브 프론트엔드 '미르미' 참여
- • KDC 47기 AI 웹 개발 과정 수료
- • 단풍톤 프로젝트 '소확행' 팀 리드 수행
서경 SW 아카데미
2024.02 — 2024.06기업 맞춤형 클라우드 기반 AI/빅데이터 소프트웨어 교육
- • 8주간의 AI 및 빅데이터 집중 교육 수료
- • 기업 현직자 멘토링 기반 프로젝트 개발
- • 프로그래머스 코딩 교육 프로그램 수료 (PCCP)
UMC 5기
2023.09 — 2024.02실무형 앱/웹 프로젝트 IT 연합 동아리
Awards
서경 SW 헥토 파이낸셜 프로젝트 성과 발표대회
2024.06.25프로젝트의 기획적 가치와 기술 실현 가능성 부문에서 12개 팀 중 가장 높은 점수를 획득하여 1위를 기록했습니다.
✉️ CONTACT
흩어져 있는 정보를 정리하고 기록으로 남기는 과정을 즐깁니다. 혼자 아는 지식보다 서로의 경험이 맞물려 팀의 실력이 될 때 비로소 일하는 재미를 느낍니다. 기술적인 고민을 스스럼없이 나누며 함께 몰입할 수 있는 동료를 찾고 있습니다.
