목표를 정하고 꾸준히 성장하는 Front-end Developer를 지향합니다.
TypeScript · React 기반으로 사용자 경험(UX)과 재사용 가능한 UI 설계에 관심이 많습니다.
안녕하세요! 🙌
책임감 있게 먼저 움직이고, 소통으로 함께 성장하는 개발자 이재건입니다. 🚀
요즘은 React / Next.js 중심으로 프론트엔드 역량을 탄탄히 쌓는 중입니다! 💪
그리고 Notion · Figma 같은 협업 툴로 정리/공유하는 것도 좋아해서,
팀이 같은 방향을 보도록 돕는 역할을 자주 맡았습니다 🧩✨
백엔드도 “몰라도 일단 부딪혀보기” 마인드로 계속 공부하고 있습니다 🔥
팀 활동에서 팀장을 맡아 일정/우선순위를 조율하고, 다 같이 재밌게(?) 끝까지 완주하는 경험을 쌓아왔습니다 🏃♂️🏁
앞으로도 협업 🤝 + 책임감 ✅ 을 무기로 더 좋은 사용자 경험을 만드는 개발자가 되겠습니다! 😎
공통의 목표를 설정하고, 구성원과 함께 꾸준히 학습할 수 있도록 돕는 목표 기반 스터디 관리 플랫폼
| 구분 | 링크 |
|---|---|
| 📌 Notion | [최종] 스터디 관리 플랫폼 - 스터디움 |
| 💻 GitHub | https://github.com/prgrms-web-devcourse-final-project/WEB4_5_9to6_FE |
| 🌐 Demo | https://studium-9to6.vercel.app/ |
| 기능 | 설명 |
|---|---|
| 👥 스터디 생성 및 참여 | 목표, 팀원 수, 일정 등을 작성하여 그룹 생성 및 참여 |
| 🎯 목표 설정 | 일간/주간 단위 목표 등록 및 그룹 내 공유 |
| 📆 출석 체크 | 매일 스터디 홈에서 간단히 출석 체크 |
| ⚔️ 서바이벌 모드 | 미션 실패 시 강제 퇴장, 생존 인원 리워드 지급 |
| 💰 리워드 시스템 | 목표 달성·출석을 통한 리워드 획득 및 사용 |
| 🏆 성과 시각화 | 주간 출석률·달성률 기반 순위/그래프 제공 |
| 💬 소통 기능 | 스터디 전용 채팅방, 공지사항 게시 |
| 🎨 사용자 표현 UI | 아바타 커스터마이징 및 유저 시각화 |
- Role: Product Owner, Front-End Developer
- Tech: React, TypeScript, Tailwind CSS, Notion
- PO(프로덕트 오너)
- 일정 및 백엔드 협업 프로세스 관리
- Notion 기반 문서화 체계(회의록, API 명세 가이드) 구축 → 커뮤니케이션 효율 향상
- 퍼블리싱 & UI 구축
- TailwindCSS 기반 디자인 시스템 구축
- 버튼/폼 등 반복 UI 컴포넌트화 → 재사용성과 유지보수성 개선
- 공통 CSS 설정으로 서비스 전반의 디자인 일관성 확보
- UX 최적화
- 무채색 기반 Skeleton UI 도입 → Layout Shift 방지 + 체감 로딩 개선
- 인증/보안
- LocalStorage 기반 AccessToken 관리 → 새로고침 시 로그인 유지
- 권한에 따른 라우팅 제어
- 마이페이지 & CRUD
- 사용자 정보 조회/수정
- 접근 권한(본인 vs 타인) 구분 로직 및 라우팅 처리
- 리워드 상점(Canvas & Optimization)
- Canvas API 기반 아바타 의상 조합 미리보기
- 조합 결과 서버 캐싱(저장) → 중복 생성 방지 & 응답 속도 최적화
- 로컬 경로 매핑을 통한 렌더링 효율 강화
- 무한 스크롤 데이터 중복 노출 해결
- 문제: 정렬 기준의 고유값 부재로 특정 데이터 중복 노출
- 해결: 아이템 고유 ID 부여 + 정렬 로직 일관화 → 데이터 정합성 확보
- API 호출 최적화
- 불필요 요청 구간 전수 조사 후 제거/병합 → 네트워크 비용 절감 & 체감 성능 개선
- 기획-설계-구현 단계가 명확할수록 개발 효율이 높아짐을 체감
- 컴포넌트 단위 개발 & 공통 스타일 관리의 중요성을 학습 (유지보수성 향상)