Plus Ultra라는 말을 좋아합니다.
러시아 문학을 통해서 인문학을 접하고 실용적인 해결책들을 고민하다 보니 자연스럽게 프로그래밍을 배웠습니다.
한계를 넘어 더욱 먼 곳으로 간다는 의미인 “Plus Ultra”라는 말을 좋아하며 몸소 실천하고 있는 타입스크립트를 주로 사용합니다.
끊임없이 흘러가겠다는 의미로 runningwater라는 닉네임을 사용합니다.
Work Experience
(주)옵타움플랫폼 | 프론트엔드 개발(2020년 7월 ~ 현재)
푸드앤페이(POS 애플리케이션, KDS 애플리케이션) 개발
- Expo를 통해 React Native 기반 모바일 애플리케이션을 초기 구조 설계부터 기능 구현 및 배포까지 전반적인 개발 과정 담당
- FCM 푸시 알림과 expo-notifications를 연동하여 주문 수신 시 실시간으로 앱이 반응하도록 기능 구현
React-Native, Expo, Zustand, Zod
허브 솔루션 프론트엔드 개발
- 반복되는 UI 로직을 Flat 패턴과 Compound 패턴 기반 컴포넌트로 리팩토링하여 재사용성 개선
- 전역 상태(recoil)로만 관리 되던 모달 구조를 개선해서 페이지 전용 모달은 로컬 상태로 분리 후 컴포넌트 응집도 개선
- react 빌드 후 수동으로 진행하던 파일 업로드 및 권한 설정 작업을 npm script 기반으로 자동화하여 배포 과정 효율적으로 개선
React, Typescript, Tanstack-query, react-table, Recoil, React-hook-form, MSW
AML 솔루션 프론트엔드 개발
- 공통 에러처리를 위해 React Query의 Provider를 커스텀
- 최적화를 위해 파일들의 캐시 설정을 다르게 적용하도록 Nginx 설정 작업
- React Query를 활용해 서버 데이터 상태를 관리하고, 클라이언트 상태는 Zustand로 분리하여 상태 관리 구조 구성
- 백엔드 없이 작업 진행이 필요해 MSW 구성을 통해 api 모킹 작업
React, Typescript, MUI, Tanstack-query, Zustand, React-hook-form, Docker, Nginx, MSW
국내 PG 솔루션 프론트엔드 개발
- 사용자 친화적인 UI / UX를 위해 react MUI를 이용한 솔루션 페이지 작업
- Recoil로 상태 관리
- React Query를 도입하여 데이터 fetching 및 caching을 처리하고 공통 hook 기반 데이터 관리 구조 구축
- Docker Swarm을 활용해 서비스를 컨테이너 기반으로 배포하여 안정적인 서비스 운영 환경 구축
React, Typescript, MUI, React-query, Recoil, React-hook-form, Docker, Nginx
개발 서버 이전으로 인한 새 개발 서버 구축 보조 및 개발 환경 구축
- docker / docker swarm 설치 및 설정과 yml, conf 파일 작성과 SSL 인증서 적용
- 사내 구성원들의 편의성을 위해 도메인을 추가하고 Nginx를 이용해 proxy 서버 구축
- 개발 생산성 향상을 위해 CI/CD 환경을 구축하고 Jenkins, Teamcity, Gitea, Registry, Portainer, Redmine을 Docker Swarm 및 Compose 기반으로 구성
Docker, Docker Swarm, Nginx, Let’s Encrypt, Portainer, Jenkins, Teamcity, Registry, Gitea, Redmine
자사 홈페이지 개발
- 검색엔진 최적화를 위해 Next.js를 활용해서 홈페이지 개발
- React의 Context를 통해서 상태 관리
- 글로벌 고객을 위해서 i18n 적용으로 다국어 서비스 제공
- Docker Swarm을 활용해 서비스를 컨테이너 기반으로 배포하여 안정적인 서비스 운영 환경 구축
Next.js, next-i18next, Docker, Nginx
(주) 건강한친구 | 웹 개발(2019년 3월 ~ 2020년 7월)
자사 홈페이지 개발
- Express와 Pug로 페이지 개발
- Passport.js와 Mongodb를 통해서 인증 및 게시판 구현
- gulp를 통해서 빌드에 필요한 작업 실행 및 구축
Express, Pug, Passport.js, Mongodb, mongoose, gulp, Sass
Project
Next.js 기반 개인 기술 블로그 서비스 개발
학습한 내용과 업무 중 얻은 기술적 인사이트를 체계적으로 기록하기 위해 개인 기술 블로그를 직접 개발했습니다. Postgres SQL과 Prisma ORM을 활용해 게시글 및 태그 중심의 데이터 모델을 설계했으며, Next.js를 기반으로 관리자 페이지 와 블로그 페이지를 구현했습니다. shadcn/ui와 TailwindCSS를 활용해 재사용 가능한 UI 컴포넌트를 구성하고 Markdown 기반 컨텐츠 렌더링 기능을 구현했습니다. 또한 Next.js의 Cache Component를 활용한 캐싱 전략을 적용하여 페이지 렌더링 성능을 최적화 했습니다.
Next.js, Postgres SQL, Prisma ORM, shadcn/ui
책 글귀 제공 애플리케이션
저의 독서 습관을 형성하고 인상 깊은 책 속 문장을 공유하기 위해, 등록된 책 글귀를 모바일 앱에서 제공하는 콘텐츠 서비스를 개발했습니다. Postgres SQL과 Prisma ORM을 활용해 책과 글귀 데이터를 관리하기 위한 데이터 모델을 설계했으며, Next.js를 활용해 컨텐츠 등록 및 관리를 위한 관리자 페이지를 구현했습니다. 또한 Expo 기반 React Native로 모바일 애플리케이션을 개발하여 등록된 책 글귀를 조회할 수 있고, 좋은 글귀에 대해선 북마크할 수 있도록 구현했습니다.
Next.js, Expo, React Native