caadiq
6fb441dc80
- 게임규칙: 서버에서 실시간 목록 가져오기, 툴팁 설명, 토글 시 gamerule 명령어 실행 - 난이도: 서버에서 현재 난이도 가져오기, difficulty 명령어 실행 - 시간: 실시간 동기화 (틱 기반), time set 명령어 실행 - 날씨: 실시간 동기화, weather 명령어 실행 - 백엔드: worlds 정보 주기적 브로드캐스트 추가 |
||
|---|---|---|
| .. | ||
| public | ||
| src | ||
| index.html | ||
| package.json | ||
| postcss.config.js | ||
| README.md | ||
| tailwind.config.js | ||
| vite.config.js | ||
🎨 Minecraft Dashboard - Frontend
마인크래프트 대시보드의 웹 인터페이스입니다.
🛠️ 기술 스택
| 기술 | 설명 |
|---|---|
| React 18 | UI 라이브러리 |
| Vite | 빌드 도구 |
| TailwindCSS | CSS 프레임워크 |
| Socket.IO | 실시간 통신 |
| skinview3d | 3D 스킨 렌더링 |
| Framer Motion | 애니메이션 |
| Lucide React | 아이콘 |
✨ 주요 기능
- 🎴 서버 상태 카드 - 온라인/오프라인 상태 표시
- 👤 플레이어 목록 - 접속 중인 플레이어 및 3D 스킨 뷰어
- 🗺️ 월드 정보 - 서버 월드 목록 표시
- 📱 반응형 디자인 - 모바일/데스크톱 최적화
- 🌙 다크 테마 - 세련된 UI 디자인
🚀 실행 방법
개발 모드
npm install
npm run dev
프로덕션 빌드
npm run build
📁 구조
frontend/
├── src/
│ ├── components/ # UI 컴포넌트
│ ├── pages/ # 페이지 컴포넌트
│ └── utils/ # 유틸리티 함수
└── public/ # 정적 파일