refactor: app.js를 ES6 모듈로 분리
## 변경사항 - app.js (1370줄) → 7개 모듈 (1427줄) - ES6 import/export 문법 사용 - Alpine.js 호환성 유지 (window 전역 노출) ## 모듈 구조 - js/config.js: 상수/설정 (WIZARD_CONFIG, PRICING_DATA, MOCK_*) - js/api.js: ApiService - js/utils.js: formatPrice, switchTab, ping 시뮬레이션 - js/wizard.js: 서버 추천 마법사 로직 - js/pricing.js: 가격표 컴포넌트 - js/dashboard.js: 대시보드 및 텔레그램 연동 - js/app.js: 메인 통합 (모든 모듈 import) ## HTML 변경 - <script type="module" src="js/app.js">로 변경 - 기존 기능 모두 정상 작동 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
kappa
136
js/config.js
Normal file
136
js/config.js
Normal file
@@ -0,0 +1,136 @@
|
||||
/**
|
||||
* Configuration and Constants
|
||||
* 상수, 설정, 목 데이터 정의
|
||||
*/
|
||||
|
||||
// 텔레그램 봇 URL
|
||||
export const TELEGRAM_BOT_URL = 'https://t.me/AnvilForgeBot';
|
||||
|
||||
// 단일 가격 데이터 소스 (VAT 포함, 월간 기준)
|
||||
export const PRICING_DATA = {
|
||||
global: [
|
||||
{ plan: 'Micro', vcpu: '1 Core', ram: '1 GB', ssd: '25 GB', transfer: '1 TB', price: 8500 },
|
||||
{ plan: 'Starter', vcpu: '1 Core', ram: '2 GB', ssd: '50 GB', transfer: '2 TB', price: 20400 },
|
||||
{ plan: 'Pro', vcpu: '2 Cores', ram: '4 GB', ssd: '80 GB', transfer: '4 TB', price: 40700, featured: true },
|
||||
{ plan: 'Business', vcpu: '4 Cores', ram: '8 GB', ssd: '160 GB', transfer: '5 TB', price: 67800 }
|
||||
],
|
||||
seoul: [
|
||||
{ plan: 'Nano', vcpu: '1 Core', ram: '512 MB', ssd: '20 GB', transfer: '1 TB', price: 6000 },
|
||||
{ plan: 'Micro', vcpu: '1 Core', ram: '1 GB', ssd: '40 GB', transfer: '2 TB', price: 8500 },
|
||||
{ plan: 'Starter', vcpu: '1 Core', ram: '2 GB', ssd: '60 GB', transfer: '3 TB', price: 17000 },
|
||||
{ plan: 'Pro', vcpu: '2 Cores', ram: '4 GB', ssd: '80 GB', transfer: '4 TB', price: 33900, featured: true },
|
||||
{ plan: 'Business', vcpu: '2 Cores', ram: '8 GB', ssd: '160 GB', transfer: '5 TB', price: 67800 }
|
||||
]
|
||||
};
|
||||
|
||||
// Mock 데이터 (API 없이 UI 테스트용)
|
||||
export const MOCK_SERVERS = [
|
||||
{
|
||||
id: 'srv-001',
|
||||
name: 'production-web',
|
||||
region: '🇯🇵 Tokyo',
|
||||
ip: '45.12.89.101',
|
||||
os: 'Debian 12',
|
||||
plan: 'Pro',
|
||||
status: 'running',
|
||||
created_at: '2026-01-15',
|
||||
vcpu: '2 Cores',
|
||||
ram: '4 GB',
|
||||
cost: 40700
|
||||
},
|
||||
{
|
||||
id: 'srv-002',
|
||||
name: 'dev-api',
|
||||
region: '🇰🇷 Seoul',
|
||||
ip: '45.12.89.102',
|
||||
os: 'Ubuntu 24.04',
|
||||
plan: 'Starter',
|
||||
status: 'stopped',
|
||||
created_at: '2026-01-20',
|
||||
vcpu: '1 Core',
|
||||
ram: '2 GB',
|
||||
cost: 17000
|
||||
}
|
||||
];
|
||||
|
||||
export const MOCK_STATS = {
|
||||
totalCost: 57700,
|
||||
totalServers: 2,
|
||||
runningServers: 1,
|
||||
costBreakdown: [
|
||||
{ plan: 'Pro', count: 1, cost: 40700 },
|
||||
{ plan: 'Starter', count: 1, cost: 17000 }
|
||||
]
|
||||
};
|
||||
|
||||
export const MOCK_NOTIFICATIONS = [
|
||||
{ id: 'n-001', type: 'info', title: '서버 생성 완료', message: 'production-web 서버가 Tokyo 리전에 생성되었습니다.', time: '10분 전', read: false },
|
||||
{ id: 'n-002', type: 'warning', title: '결제 예정', message: '이번 달 결제가 3일 후 예정되어 있습니다. (₩57,700)', time: '1시간 전', read: false },
|
||||
{ id: 'n-003', type: 'success', title: '시스템 업데이트 완료', message: 'dev-api 서버의 Ubuntu 패키지가 업데이트되었습니다.', time: '2일 전', read: true }
|
||||
];
|
||||
|
||||
// 서버 추천 마법사 설정
|
||||
export const WIZARD_CONFIG = {
|
||||
// 용도 목록 (객체 형태)
|
||||
purposes: {
|
||||
web: { icon: '🌐', name: '웹 서비스', desc: '웹사이트, API, SaaS' },
|
||||
game: { icon: '🎮', name: '게임 서버', desc: '마인크래프트, 발하임 등' },
|
||||
ai: { icon: '🤖', name: 'AI / ML', desc: '머신러닝, LLM, 데이터 분석' },
|
||||
dev: { icon: '💻', name: '개발 환경', desc: 'CI/CD, 테스트, 스테이징' },
|
||||
db: { icon: '🗄️', name: '데이터베이스', desc: 'MySQL, PostgreSQL, Redis' },
|
||||
other: { icon: '📦', name: '기타', desc: 'VPN, 프록시, 기타 용도' }
|
||||
},
|
||||
|
||||
// 기술 스택 (용도별 필터링, category 추가)
|
||||
stacks: {
|
||||
web: [
|
||||
{ id: 'wordpress', icon: '📝', name: 'WordPress', ram: 1024, cpu: 1, category: 'CMS' },
|
||||
{ id: 'nginx', icon: '🟢', name: 'Nginx / Static', ram: 512, cpu: 1, category: 'Web Server' },
|
||||
{ id: 'nodejs', icon: '🟩', name: 'Node.js', ram: 1024, cpu: 1, category: 'Runtime' },
|
||||
{ id: 'python', icon: '🐍', name: 'Python / Django', ram: 1024, cpu: 1, category: 'Framework' },
|
||||
{ id: 'php', icon: '🐘', name: 'PHP / Laravel', ram: 1024, cpu: 1, category: 'Framework' },
|
||||
{ id: 'nextjs', icon: '▲', name: 'Next.js / React', ram: 2048, cpu: 2, category: 'Framework' },
|
||||
{ id: 'docker', icon: '🐳', name: 'Docker 컨테이너', ram: 2048, cpu: 2, category: 'Container' }
|
||||
],
|
||||
game: [
|
||||
{ id: 'minecraft', icon: '⛏️', name: 'Minecraft', ram: 4096, cpu: 2, category: 'Sandbox' },
|
||||
{ id: 'valheim', icon: '⚔️', name: 'Valheim', ram: 4096, cpu: 2, category: 'Survival' },
|
||||
{ id: 'ark', icon: '🦖', name: 'ARK', ram: 8192, cpu: 4, category: 'Survival' },
|
||||
{ id: 'palworld', icon: '🐾', name: 'Palworld', ram: 16384, cpu: 4, category: 'Survival' },
|
||||
{ id: 'rust', icon: '🔫', name: 'Rust', ram: 8192, cpu: 4, category: 'Survival' },
|
||||
{ id: 'terraria', icon: '🌲', name: 'Terraria', ram: 1024, cpu: 1, category: 'Sandbox' }
|
||||
],
|
||||
ai: [
|
||||
{ id: 'jupyter', icon: '📓', name: 'Jupyter Notebook', ram: 4096, cpu: 2, category: 'IDE' },
|
||||
{ id: 'ollama', icon: '🦙', name: 'Ollama / LLM', ram: 16384, cpu: 4, category: 'LLM' },
|
||||
{ id: 'stable', icon: '🎨', name: 'Stable Diffusion', ram: 16384, cpu: 4, gpu: true, category: 'Image AI' },
|
||||
{ id: 'pytorch', icon: '🔥', name: 'PyTorch / TensorFlow', ram: 8192, cpu: 4, category: 'ML Framework' }
|
||||
],
|
||||
dev: [
|
||||
{ id: 'gitlab', icon: '🦊', name: 'GitLab', ram: 4096, cpu: 2, category: 'DevOps' },
|
||||
{ id: 'jenkins', icon: '🔧', name: 'Jenkins', ram: 2048, cpu: 2, category: 'CI/CD' },
|
||||
{ id: 'n8n', icon: '🔀', name: 'n8n 자동화', ram: 1024, cpu: 1, category: 'Automation' },
|
||||
{ id: 'vscode', icon: '💠', name: 'VS Code Server', ram: 2048, cpu: 2, category: 'IDE' }
|
||||
],
|
||||
db: [
|
||||
{ id: 'mysql', icon: '🐬', name: 'MySQL / MariaDB', ram: 2048, cpu: 2, category: 'RDBMS' },
|
||||
{ id: 'postgresql', icon: '🐘', name: 'PostgreSQL', ram: 2048, cpu: 2, category: 'RDBMS' },
|
||||
{ id: 'mongodb', icon: '🍃', name: 'MongoDB', ram: 2048, cpu: 2, category: 'NoSQL' },
|
||||
{ id: 'redis', icon: '🔴', name: 'Redis', ram: 1024, cpu: 1, category: 'Cache' }
|
||||
],
|
||||
other: [
|
||||
{ id: 'vpn', icon: '🔒', name: 'VPN / WireGuard', ram: 512, cpu: 1, category: 'Network' },
|
||||
{ id: 'proxy', icon: '🌐', name: '프록시 서버', ram: 512, cpu: 1, category: 'Network' },
|
||||
{ id: 'storage', icon: '💾', name: '파일 스토리지', ram: 1024, cpu: 1, category: 'Storage' },
|
||||
{ id: 'custom', icon: '⚙️', name: '커스텀 설정', ram: 1024, cpu: 1, category: 'Custom' }
|
||||
]
|
||||
},
|
||||
|
||||
// 규모 선택 (객체 형태)
|
||||
scales: {
|
||||
personal: { name: '개인', desc: '1-10명', users: '1-10명', multiplier: 1, icon: '👤' },
|
||||
small: { name: '소규모', desc: '10-100명', users: '10-100명', multiplier: 1.5, icon: '👥' },
|
||||
medium: { name: '중규모', desc: '100-1000명', users: '100-1,000명', multiplier: 2.5, icon: '🏢' },
|
||||
large: { name: '대규모', desc: '1000명+', users: '1,000명+', multiplier: 4, icon: '🏙️' }
|
||||
}
|
||||
};
|
||||
Reference in New Issue
Block a user