박건민

작업 내용

• Base Component 약 30여종 이상 제작
• 하나의 Compoenent가 너무 많은 기능을 가지면 안된다 생각하여 작은 기능만을 가지게 만든 후, 사용성을 높이기 위해 Base Component를 묶어주는 Wrapper Component 또한 10여종 제작하여 사용성 증대
• 여러 작업자가 기준을 지키지 않고 작업하여 복잡하던 Node를 전부 Base Component로 리팩토링 작업하여 통일성 확보
• 하나의 파일에 너무 많은 코드가 존재한다면 가독성이 떨어진다 생각하여 각 페이지는 크게 Header와 Contents 두가지의 컴포넌트를 분류하는 기준을 잡고 제작
• 기존 사이트, PPT 설계도의 UI 규칙이 없어 통일성이 떨어져 담당자와 많은 미팅을 통해 신규 규칙을 만든 후 규칙에 기반하여 페이지 작업
• 다크모드 작업

작업 내용

• 전체 레이아웃 설계 및 디자인
• Vuetify 프레임워크를 사용하여 전체적인 UI 통일
• 전반적 커스텀 컴포넌트 제작
• Tiptap 기반 커스텀 텍스트에디터 제작
• 캔버스 라이브러리인 KonvaJs로 파워포인트와 최대한 동일한 도형을 웹 페이지에서 렌더링하기 위해 추상 팩토리 패턴을 사용한 컴포넌트 작업
• Redis의 pub/sub 기능을 이용해 Web socket으로 데이터를 받아 렌더링 된 도형의 데이터 (색상, 글씨, 차트 데이터 등) 동적으로 변경 작업
• Oauth 2.0 로그인 구현
• Toss Payment 결제 연동 테스트
• 다크모드 작업

작업 내용

• 윈도우 10, 1920 해상도 크롬 브라우저 기준으로한 웹 페이지 개발
• Vuetify 프레임워크를 사용하여 전체적인 UI 통일
• 전반적 커스텀 컴포넌트 제작
• Tabulator 기반 커스텀 테이블 컴포넌트 제작
• Jodit 기반 커스텀 텍스트에디터 컴포넌트 제작
• 레벨과 주소를 기반으로 데이터를 개인화하여 조회
• 카카오 지도 API로 메인 대시보드 페이지 작업
• 위젯 페이지 작업
• 관리자 페이지 작업
• 각각의 주소지에 존재하는 엘리베이터 부품 수명 상세 조회를 위한 트리 컴포넌트 제작
• 데이터를 통한 보고서 자동 생성, jsPDF를 통한 PDF 다운로드 기능
• 테이블 기반의 조회 페이지 엑셀 import, export 기능
• 다크모드 작업
• I18n을 통한 현지화 작업

작업 내용

• NuxtJs를 통한 SSR 웹페이지 구축
• Tailwind CSS를 기반으로 UI 개발
• NestJS의 TypeORM 사용하여 백엔드 구축
• Maria DB 구축 및 AWS EC2를 통해 배포
• Vercel을 통한 서버 배포
• SEO 작업

작업 내용

• Claude를 사용하여 바이브 코딩 개발로 생산성 향상 및 새로운 개발 방식 경험
• SEO 최적화 및 초기 로딩 성능 향상
• 민감하고 복잡한 데이터가 아니기에 서버를 사용하지 않고, localStorage에 데이터를 저장하는 방식 채택
• 최종 목표는 Shadcn/ui 기반으로 여러 프로젝트에서 사용 가능한 커스텀 컴포넌트 라이브러리화. 그 중 현재 data-table에 많은 리소스를 들이고 있음
• 추후 빌드 시뮬레이터 및 거래 시스템 구축 계획. 그 시점에 백엔드 및 DB 추가예정