프로젝트 배경
✅ 문제점
•많은 클라이언트가 사이트를 운영하면서도 회원, 주문, 컨텐츠, 통계 등 데이터를 효율적으로 관리할 수 있는 시스템이 부재
•관리 기능이 각각 나뉘어 있어 한눈에 확인하기 어렵고, 반복되는 단순 업무가 많아 운영 부담이 가중됨
•웹사이트 개별 맞춤형 개발에 집중하다 보니, 관리자 영역에 대한 UX/UI 개선은 상대적으로 소홀함
✅ 목표
•웹사이트 제작 시 통합형 어드민(CRM) 시스템을 기본 패키지로 제공하여, 비전문가도 손쉽게 웹사이트를 운영하도록 지원
•반복적인 운영 업무를 자동화하고, 필요한 데이터를 실시간으로 확인할 수 있는 대시보드 기반 구조 설계
✅ 주안점
•직관적인 UI/UX: 관리자의 컴퓨터 활용 능력이 낮아도 사용할 수 있는 설계
•다양한 웹사이트 유형(쇼핑몰, 학원, 예약 등)에 확장 가능한 구조
•권한 기반 접근 제어 및 데이터 보안에 중점
•많은 클라이언트가 사이트를 운영하면서도 회원, 주문, 컨텐츠, 통계 등 데이터를 효율적으로 관리할 수 있는 시스템이 부재
•관리 기능이 각각 나뉘어 있어 한눈에 확인하기 어렵고, 반복되는 단순 업무가 많아 운영 부담이 가중됨
•웹사이트 개별 맞춤형 개발에 집중하다 보니, 관리자 영역에 대한 UX/UI 개선은 상대적으로 소홀함
✅ 목표
•웹사이트 제작 시 통합형 어드민(CRM) 시스템을 기본 패키지로 제공하여, 비전문가도 손쉽게 웹사이트를 운영하도록 지원
•반복적인 운영 업무를 자동화하고, 필요한 데이터를 실시간으로 확인할 수 있는 대시보드 기반 구조 설계
✅ 주안점
•직관적인 UI/UX: 관리자의 컴퓨터 활용 능력이 낮아도 사용할 수 있는 설계
•다양한 웹사이트 유형(쇼핑몰, 학원, 예약 등)에 확장 가능한 구조
•권한 기반 접근 제어 및 데이터 보안에 중점
프로젝트 성과
운영 효율성 80% 향상
콘텐츠 수정, 회원 관리, 주문 처리 등 주요 작업이 어드민에서 즉시 가능해짐
안전한 데이터 접근
관리자 역할 기반 권한 설정으로, 부서별 접근 제어 가능
클라이언트 만족도 상승
웹사이트 운영에 필요한 모든 요소를 직접 관리할 수 있어 외주 의존도 감소
핵심 기능
콘텐츠 관리
페이지 내 텍스트, 이미지, 배너 등을 직접 수정 및 게시 가능 (미리보기 포함)
회원 관리
가입자 정보, 권한 설정, 가입일, 활동 로그 등 확인 및 수정 가능
게시판/댓글 관리
문의글, 후기글, 댓글 등 커뮤니티 기능에 대한 모니터링 및 삭제 처리
진행 단계
기획
2023.11.
주요 고객사와 인터뷰를 통해 다양한 업종의 공통 기능 정의 (회원/콘텐츠/결제 등)
디자인
2023.12.
PC 환경에 최적화된 관리자 UI/UX 설계, 다크모드/반응형 대응 고려
개발
2024.01.
React + NestJS 기반 어드민 패널 개발, 컴포넌트 재사용 구조로 모듈화
테스트
2024.02.
실제 운영 중인 사이트 3개에 통합 적용하여 기능 안정성 검증
런칭
2024.03.
기본 패키지로 모든 웹사이트에 적용 시작, 피드백 기반 지속 고도화 중
프로젝트 상세
프로젝트 목적
•웹사이트 제작 시 함께 제공되는 어드민(CRM) 시스템을 통해 고객이 회원, 콘텐츠, 예약, 문의, 통계 등 주요 데이터를 직접 관리할 수 있도록 지원하여 운영 효율성과 유지 관리 자율성을 높임
주요 대상
•웹사이트 운영 관리자, 내부 스태프
사용 기술 스택
•인프라: AWS (EC2, S3, Cloud Front, Route 53, ECR), Docker
•데이터베이스: AWS RDS (PostgreSql)
•백엔드: Nest 11 (Prisma)
•프론트엔드: React 19 또는 Next 15 (React Query, React Hook Form + Yup, Zustand, Tailwind)
•기타: JWT 인증, 파일 업로드(S3 Presigned URL)
•웹사이트 제작 시 함께 제공되는 어드민(CRM) 시스템을 통해 고객이 회원, 콘텐츠, 예약, 문의, 통계 등 주요 데이터를 직접 관리할 수 있도록 지원하여 운영 효율성과 유지 관리 자율성을 높임
주요 대상
•웹사이트 운영 관리자, 내부 스태프
사용 기술 스택
•인프라: AWS (EC2, S3, Cloud Front, Route 53, ECR), Docker
•데이터베이스: AWS RDS (PostgreSql)
•백엔드: Nest 11 (Prisma)
•프론트엔드: React 19 또는 Next 15 (React Query, React Hook Form + Yup, Zustand, Tailwind)
•기타: JWT 인증, 파일 업로드(S3 Presigned URL)
