AI 고민 상담 서비스 (고민지우개 마이그레이션) - OpenAI API 를 활용한 맞춤형 답변 제공 및 고민 커뮤니티 기능 구현 - 커스텀 훅으로 코드 가독성과 재사용성 향상 - Atomic 디자인 패턴 적용으로 UI 컴포넌트 최적화, 재사용성 강조 - 외부 데이터를 Zustand로 전역 상태로 관리하여 prop 드릴링을 최소화 - 빠른 개발 서버와 효율적인 빌드를 위해 HMR을 지원하는 Vite 사용

사용자의 고민을 ai인 gpt를 통하여 답장을 받는 서비스 -스텍 형식 단계별 고민 기능 및 구현사항 - firebase db 사용하여 전체,나의 게시물 리스트화 - firebase 로그인, 회원가입, 정보 수정 - GPT API를 활용한 답변 제공 - 원스토어 출시 최적화 및 개선사항 - 이미지 파일 개선(svg) 및 번들 최적화로 버벅임 해결 - atomic 디자인 패턴 적용으로 재사용성 극대화 및 빠른 개발 - router를 stack 과 tab로 조합하여 상황에 맞는 페이지 전환

전력 입찰 및 관리 전력 중개 통합 서비스 - 대시보드, 입찰제도, 예측제도, 분석, 로그인 페이지 - 기능 개발 Vite 전환으로 빌드 속도 및 개발 환경 최적화 - Github Action CI/CD 를 활용해 S3에서 CloudFront(HTTP HTTPS)로 리다이렉션 연결 및 배포 자동화 - 사용자 권한 레벨에 따른 메뉴 구성 및 기능 차별화 - Axios instance 를 통해 리프레시 토큰 재발급 및 유효기간 초과 시 자동 로그아웃 처리 - Echarts 기반 실시간 전력량 시각화

블로그 특성 상 검색 노출을 위하여 검색엔진최적화, ssr를 위해 next를 사용하고, React, Next.js, React-Query, Axios, TypeScript, 그리고 Recoil을 사용하여 개발자 블로그를 제작했습니다. 리액트 마크다운과 DnD(Drag and Drop) 기능을 추가하여 사용자의 편의성과 창의성을 극대화했습니다. 프론트엔드는 2명, 백엔드는 2명으로 구성되었으며, Jira, Notion, Discord, Slack 등을 이용하여 효율적인 협업을 진행했습니다. 배포는 EC2와 Vercel을 이용했습니다

- 주요 고객층을 분석 후 고객에게 맞게 전체 페이지 리뉴얼(디자인 창작) - full-page, carousel, AOS, bootstrab 등 스타일 관련 라이브러리 사용 - 메인페이지에 full-page를 통하여 포인트를 살려 회사의 정보 전달 효율 증가 - 개인, 기업, 관리자 로그인, 회원가입 구현 및 권한 별 글쓰기 등급 차별화 - 회원가입 시 네이버 sens를 이용한 문자 인증 체계 구현 사용 언어 및 툴 : typescript , react , styled-component , Bootstrap