Bolivia Frontend Dev

Bolivia App 프론트엔드 개발 스킬

기술 스택

• React 18 (Create React App)
• Axios (HTTP 클라이언트)
• React Router v6 (라우팅)
• i18next (다국어 — 한국어/스페인어)
• Nginx (프로덕션 서빙)
• Docker (Multi-stage build)

디렉터리 구조

frontend/src/
├── components/
│   ├── common/       공통 UI (Modal, Toast, Loader, ProtectedRoute 등)
│   ├── layout/       레이아웃 (Header, Sidebar, BottomNavBar, Footer)
│   └── reports/      리포트 컴포넌트
├── contexts/
│   ├── AuthContext.js      인증 상태 (user, token, login/logout)
│   └── AppContext.js       앱 설정 (theme, locale)
├── i18n/
│   ├── config.js           i18n 초기화
│   └── index.js            번역 리소스 (ko, es)
├── pages/                  라우트 페이지
│   ├── Login.js
│   ├── Dashboard.js
│   ├── Bills.js / BillDetail.js
│   ├── Settings.js
│   └── admin/              관리자 전용 페이지
├── screens/                모바일 최적화 화면
│   ├── admin/              관리자 화면 (8개)
│   └── resident/           주민 화면 (6개)
├── services/               API 서비스 모듈
│   ├── http.js             Axios 인스턴스 + 인터셉터
│   ├── authService.js      인증 API
│   ├── billService.js      관리비 API
│   ├── financeReportsService.js
│   ├── userAdminService.js
│   └── geminiApi.js        AI 분석 API
├── App.js                  라우터 설정
├── constants.js            상수
└── index.js                진입점