본문으로 건너뛰기

B1 Admin

B1Admin은 Vite 및 Material-UI로 빌드한 React 단일 페이지 애플리케이션인 교회 관리 대시보드입니다. 교회 직원은 이를 사용하여 사람, 그룹, 참석, 헌금, 컨텐츠 등을 관리합니다.

시작하기 전에

설정

1. 저장소 복제

git clone https://github.com/ChurchApps/B1Admin.git

2. 의존성 설치

cd B1Admin
npm install

3. 환경 변수 구성

cp dotenv.sample.txt .env

.env를 열고 API 엔드포인트를 구성하세요. 스테이징 API 또는 로컬 API 인스턴스를 가리킬 수 있습니다.

4. 개발 서버 시작

npm start

이는 Vite 개발 서버를 시작합니다. 앱은 핫 모듈 교체가 활성화된 브라우저에서 사용 가능해집니다.

주요 환경 변수

변수설명
REACT_APP_STAGE환경 이름 (예: local, staging, prod)
PORT개발 서버 포트 (기본값: 3101)
REACT_APP_*_API각 모듈의 API 엔드포인트 URL
정보

postinstall 스크립트는 @churchapps/apphelper에서 locale 및 CSS 파일을 복사합니다. 컴포넌트가 스타일 없이 보이면 npm run postinstall을 수동으로 실행하세요.

주요 명령

명령설명
npm startVite 개발 서버 시작
npm run buildVite를 통한 프로덕션 빌드
npm run testPlaywright를 사용한 끝에서 끝까지 테스트 실행
npm run lint자동 수정과 함께 ESLint 실행

기술 스택

  • React 19 with TypeScript
  • Vite 빌드 도구 및 개발 서버용
  • Material-UI 7 UI 컴포넌트용
  • React Query 5 서버 상태용
  • @churchapps/apphelper* 공유 컴포넌트용 패키지

배포

프로덕션 빌드는 S3 + CloudFront에 배포됩니다:

  1. npm run build는 static 자산 생성
  2. 자산이 S3 버킷에 동기화됨
  3. CloudFront 무효화가 트리거되어 새 버전 제공

자세한 배포 지침은 웹 앱 배포 가이드를 참조하세요.