수파자 / 개발팀, 사원•담당 업무: 웹프론트엔드 개발
클래스 허브 재구축
레거시 코드 기반 서비스 재구축
프로젝트 소개
기존에 폐쇄되었던 클래스 허브 사이트의 레거시 코드를 분석하고, 현대적인 웹 기술을 바탕으로 새롭게 재구축하는 업무를 진행했습니다.
유지보수가 어려운 오래된 코드베이스를 React 생태계로 전환하여 확장성과 안정성을 확보하는 데 중점을 두었습니다.
기술 스택
React.js
Styled-Components
React-Quill
주요 작업 내용
- 레거시 코드 분석 및 재설계:
기존 시스템의 비즈니스 로직을 분석하여 React 컴포넌트 기반의 모듈형 아키텍처로 재설계했습니다.
- 에디터 통합:
React-Quill을 도입하여 게시글 작성 및 관리 기능을 도입하고, 리치 텍스트 편집 경험을 개선했습니다.
- UI/UX 현대화:
Styled-Components를 활용하여 일관된 디자인 시스템을 적용하고, 사용성을 고려한 인터페이스를 구현했습니다.