shared-dg04-Won/smarketing-frontend
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

release

Browse Source
This commit is contained in:
SeoJHeasdw
2025-06-11 17:37:52 +09:00
parent df016023be
commit a9005e6dc4
7 changed files with 512 additions and 505 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/index.html
+56 -182
View File
@@ -1,185 +1,59 @@
//* public/index.html
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>₩ON - AI 마케팅 서비스</title>
<meta name="description" content="소상공인을 위한 AI 기반 마케팅 솔루션">
<meta name="keywords" content="소상공인, 마케팅, AI, 콘텐츠 생성, 매장 관리">
<meta name="author" content="₩ON Team">
<!-- Favicon -->
<link rel="icon" href="/favicon.ico">
<link rel="apple-touch-icon" href="/logo192.png">
<!-- Web App Manifest -->
<link rel="manifest" href="/manifest.json">
<!-- Meta tags for mobile -->
<meta name="theme-color" content="#1976D2">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="default">
<meta name="apple-mobile-web-app-title" content="₩ON">
<!-- PWA Meta Tags -->
<meta name="application-name" content="₩ON">
<meta name="msapplication-TileColor" content="#1976D2">
<!-- Runtime Environment Configuration -->
<script src="/runtime-env.js"></script>
<!-- Google Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap" rel="stylesheet">
<!-- Material Design Icons -->
<link href="https://cdn.jsdelivr.net/npm/@mdi/font@6.9.96/css/materialdesignicons.min.css" rel="stylesheet">
<!-- CSS Variables for Theme -->
<style>
:root {
--primary-color: #1976D2;
--primary-dark: #1565C0;
--primary-light: #BBDEFB;
--secondary-color: #FFC107;
--success-color: #4CAF50;
--warning-color: #FF9800;
--error-color: #F44336;
--info-color: #2196F3;
--background-color: #FAFAFA;
--surface-color: #FFFFFF;
--text-primary: #212121;
--text-secondary: #757575;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html, body {
height: 100%;
font-family: 'Noto Sans KR', sans-serif;
background-color: var(--background-color);
color: var(--text-primary);
overflow-x: hidden;
}
#app {
height: 100%;
display: flex;
flex-direction: column;
}
/* Loading Spinner */
.loading-container {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: var(--surface-color);
display: flex;
align-items: center;
justify-content: center;
z-index: 9999;
}
.loading-spinner {
width: 60px;
height: 60px;
border: 4px solid var(--primary-light);
border-top: 4px solid var(--primary-color);
border-radius: 50%;
animation: spin 1s linear infinite;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.loading-text {
margin-top: 16px;
color: var(--text-secondary);
font-size: 14px;
}
/* Mobile Optimizations */
@media (max-width: 768px) {
body {
font-size: 14px;
}
.v-application {
line-height: 1.5;
}
}
/* Prevent zoom on input focus in iOS */
@media screen and (max-width: 768px) {
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
textarea {
font-size: 16px !important;
}
}
/* Custom scrollbar */
::-webkit-scrollbar {
width: 6px;
}
::-webkit-scrollbar-track {
background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
background: var(--primary-color);
border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
background: var(--primary-dark);
}
</style>
</head>
<body>
<noscript>
<div style="text-align: center; padding: 50px;">
<h2>JavaScript가 필요합니다</h2>
<p>이 애플리케이션을 사용하려면 브라우저에서 JavaScript를 활성화해주세요.</p>
</div>
</noscript>
<div id="app">
<!-- Initial Loading Screen -->
<div class="loading-container" id="initial-loading">
<div style="text-align: center;">
<div class="loading-spinner"></div>
<div class="loading-text">₩ON AI 마케팅 서비스를 불러오는 중...</div>
</div>
</div>
</div>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="소상공인을 위한 AI 마케팅 솔루션" />
<meta name="keywords" content="AI, 마케팅, 소상공인, 콘텐츠, 자동화" />
<meta name="author" content="AI 마케팅 팀" />
<!-- Service Worker Registration -->
<script>
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker.register('/sw.js')
.then((registration) => {
console.log('SW registered: ', registration);
})
.catch((registrationError) => {
console.log('SW registration failed: ', registrationError);
});
});
}
</script>
</body>
</html>
<!-- PWA 설정 -->
<meta name="theme-color" content="#1976D2" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
<meta name="apple-mobile-web-app-title" content="AI 마케팅" />
<!-- 파비콘 -->
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
<link rel="apple-touch-icon" href="/images/logo192.png" />
<!-- Manifest -->
<link rel="manifest" href="/manifest.json" />
<!-- 폰트 사전 로드 -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap"
rel="stylesheet"
/>
<title>AI 마케팅 - 소상공인을 위한 스마트 마케팅 솔루션</title>
</head>
<body>
<div id="app"></div>
<!-- 런타임 환경 설정 -->
<script src="/runtime-env.js"></script>
<!-- 앱 스크립트 -->
<script type="module" src="/src/main.js"></script>
<!-- 서비스 워커 등록 -->
<script>
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker
.register('/sw.js')
.then((registration) => {
console.log('SW registered: ', registration)
})
.catch((registrationError) => {
console.log('SW registration failed: ', registrationError)
})
})
}
</script>
</body>
</html>
public/manifest.json
+24 -47
View File
@@ -1,91 +1,68 @@
//* public/manifest.json
{
"name": "₩ON - AI 마케팅 서비스",
"short_name": "₩ON",
"description": "소상공인을 위한 AI 기반 마케팅 솔루션",
"version": "1.0.0",
"lang": "ko",
"name": "AI 마케팅 - 소상공인을 위한 스마트 마케팅 솔루션",
"short_name": "AI 마케팅",
"description": "AI를 활용한 소상공인 전용 마케팅 자동화 서비스",
"start_url": "/",
"display": "standalone",
"orientation": "portrait-primary",
"background_color": "#ffffff",
"theme_color": "#1976D2",
"background_color": "#FAFAFA",
"categories": ["business", "productivity", "marketing"],
"orientation": "portrait-primary",
"scope": "/",
"lang": "ko-KR",
"icons": [
{
"src": "/images/logo-192.png",
"src": "/images/logo192.png",
"sizes": "192x192",
"type": "image/png",
"purpose": "any maskable"
},
{
"src": "/images/logo-512.png",
"src": "/images/logo512.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "any maskable"
},
{
"src": "/favicon.ico",
"sizes": "64x64",
"type": "image/x-icon"
}
],
"categories": ["business", "productivity", "marketing"],
"screenshots": [
{
"src": "/images/screenshot-1.png",
"src": "/images/screenshot1.png",
"sizes": "1280x720",
"type": "image/png",
"label": "메인 대시보드 화면"
"form_factor": "wide"
},
{
"src": "/images/screenshot-2.png",
"sizes": "1280x720",
"src": "/images/screenshot2.png",
"sizes": "750x1334",
"type": "image/png",
"label": "AI 콘텐츠 생성 화면"
"form_factor": "narrow"
}
],
"shortcuts": [
{
"name": "대시보드",
"short_name": "대시보드",
"description": "매출 현황 및 성과 확인",
"description": "메인 대시보드로 이동",
"url": "/dashboard",
"icons": [
{
"src": "/images/shortcut-dashboard.png",
"sizes": "96x96",
"type": "image/png"
"src": "/images/dashboard-icon.png",
"sizes": "96x96"
}
]
},
{
"name": "콘텐츠 생성",
"short_name": "콘텐츠",
"description": "AI 마케팅 콘텐츠 생성",
"description": "새 콘텐츠 생성",
"url": "/content/create",
"icons": [
{
"src": "/images/shortcut-content.png",
"sizes": "96x96",
"type": "image/png"
}
]
},
{
"name": "매장 관리",
"short_name": "매장",
"description": "매장 및 메뉴 정보 관리",
"url": "/store",
"icons": [
{
"src": "/images/shortcut-store.png",
"sizes": "96x96",
"type": "image/png"
"src": "/images/content-icon.png",
"sizes": "96x96"
}
]
}
],
"related_applications": [],
"prefer_related_applications": false,
"scope": "/",
"id": "won-ai-marketing"
}
]
}
public/runtime-env.js
+22 -171
View File
@@ -1,177 +1,28 @@
//* public/runtime-env.js
window.__runtime_config__ = {
// API Gateway URL (단일 진입점)
GATEWAY_URL: 'http://20.1.2.3',
// 각 마이크로서비스별 URL (Ingress 라우팅)
MEMBER_URL: 'http://20.1.2.3/api/member',
AUTH_URL: 'http://20.1.2.3/api/auth',
STORE_URL: 'http://20.1.2.3/api/store',
CONTENT_URL: 'http://20.1.2.3/api/content',
RECOMMEND_URL: 'http://20.1.2.3/api/recommendation',
// 애플리케이션 설정
APP_VERSION: '1.0.0',
APP_NAME: '₩ON',
// 환경 설정
ENVIRONMENT: 'production',
DEBUG_MODE: false,
// API 설정
API_TIMEOUT: 30000,
RETRY_ATTEMPTS: 3,
// 파일 업로드 설정
MAX_FILE_SIZE: 10485760, // 10MB
ALLOWED_IMAGE_TYPES: ['image/jpeg', 'image/png', 'image/webp'],
ALLOWED_VIDEO_TYPES: ['video/mp4', 'video/webm'],
// 인증 설정
TOKEN_REFRESH_MARGIN: 300, // 5분 전 토큰 갱신
SESSION_TIMEOUT: 1800, // 30분
// UI 설정
MOBILE_BREAKPOINT: 768,
TABLET_BREAKPOINT: 1024,
// 페이지네이션 설정
DEFAULT_PAGE_SIZE: 20,
MAX_PAGE_SIZE: 100,
// 알림 설정
NOTIFICATION_TIMEOUT: 5000,
MAX_NOTIFICATIONS: 5,
// 캐시 설정
CACHE_DURATION: 300000, // 5분
// 지도 API (필요한 경우)
// KAKAO_MAP_API_KEY: '',
// NAVER_MAP_API_KEY: '',
// 소셜 로그인 (향후 확장)
// KAKAO_APP_KEY: '',
// NAVER_CLIENT_ID: '',
// GOOGLE_CLIENT_ID: '',
// 분석 도구 (필요한 경우)
// GOOGLE_ANALYTICS_ID: '',
// HOTJAR_ID: '',
// CDN 설정
IMAGE_CDN_URL: 'http://20.1.2.3/images',
STATIC_CDN_URL: 'http://20.1.2.3/static',
// 피처 플래그
// API 서버 URL들
AUTH_URL: 'http://20.1.2.3/auth',
STORE_URL: 'http://20.1.2.3/store',
CONTENT_URL: 'http://20.1.2.3/content',
RECOMMEND_URL: 'http://20.1.2.3/recommend',
// 외부 API 설정
CLAUDE_AI_ENABLED: true,
WEATHER_API_ENABLED: true,
// 기능 플래그
FEATURES: {
AI_RECOMMENDATION: true,
VOICE_INPUT: false,
DARK_MODE: true,
OFFLINE_MODE: false,
ANALYTICS: true,
PUSH_NOTIFICATIONS: true,
REAL_TIME_UPDATES: true,
MULTI_STORE_SUPPORT: false,
ADVANCED_ANALYTICS: true
SOCIAL_LOGIN: false,
MULTI_LANGUAGE: false,
},
// 테마 설정
THEME: {
PRIMARY_COLOR: '#1976D2',
SECONDARY_COLOR: '#FFC107',
SUCCESS_COLOR: '#4CAF50',
WARNING_COLOR: '#FF9800',
ERROR_COLOR: '#F44336',
INFO_COLOR: '#2196F3'
},
// 국제화 설정
LOCALE: 'ko-KR',
TIMEZONE: 'Asia/Seoul',
CURRENCY: 'KRW',
// 콘텐츠 생성 설정
AI_CONTENT: {
MAX_REGENERATION_COUNT: 5,
CONTENT_TYPES: ['sns_post', 'poster', 'banner'],
PLATFORMS: ['instagram', 'naver_blog', 'facebook'],
TONE_OPTIONS: ['friendly', 'professional', 'humorous', 'elegant'],
EMOTION_LEVELS: ['calm', 'normal', 'passionate', 'exaggerated']
},
// 메뉴 카테고리 기본값
DEFAULT_MENU_CATEGORIES: ['면류', '밥류', '튀김', '분식', '음료', '디저트', '기타'],
// 매장 업종 기본값
BUSINESS_TYPES: [
'한식', '중식', '일식', '양식', '분식', '치킨', '피자', '카페',
'베이커리', '아이스크림', '패스트푸드', '기타'
],
// 운영시간 기본값
DEFAULT_OPERATING_HOURS: {
WEEKDAY: { open: '09:00', close: '22:00' },
WEEKEND: { open: '10:00', close: '21:00' }
},
// 에러 메시지
ERROR_MESSAGES: {
NETWORK_ERROR: '네트워크 연결을 확인해주세요.',
TIMEOUT_ERROR: '요청 시간이 초과되었습니다.',
UNAUTHORIZED: '로그인이 필요합니다.',
FORBIDDEN: '접근 권한이 없습니다.',
NOT_FOUND: '요청한 페이지를 찾을 수 없습니다.',
SERVER_ERROR: '서버 오류가 발생했습니다.',
VALIDATION_ERROR: '입력 정보를 확인해주세요.',
FILE_SIZE_ERROR: '파일 크기가 너무 큽니다.',
FILE_TYPE_ERROR: '지원하지 않는 파일 형식입니다.'
},
// 성공 메시지
SUCCESS_MESSAGES: {
LOGIN_SUCCESS: '로그인이 완료되었습니다.',
LOGOUT_SUCCESS: '로그아웃이 완료되었습니다.',
REGISTER_SUCCESS: '회원가입이 완료되었습니다.',
UPDATE_SUCCESS: '정보가 수정되었습니다.',
DELETE_SUCCESS: '삭제가 완료되었습니다.',
SAVE_SUCCESS: '저장이 완료되었습니다.',
UPLOAD_SUCCESS: '업로드가 완료되었습니다.',
CONTENT_GENERATED: 'AI 콘텐츠가 생성되었습니다.'
},
// 확인 메시지
CONFIRM_MESSAGES: {
DELETE_CONFIRM: '정말 삭제하시겠습니까?',
LOGOUT_CONFIRM: '로그아웃 하시겠습니까?',
CANCEL_CONFIRM: '작업을 취소하시겠습니까?',
OVERWRITE_CONFIRM: '기존 내용을 덮어쓰시겠습니까?'
}
};
// 환경별 설정 오버라이드
if (window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1') {
// 개발 환경 설정
window.__runtime_config__.ENVIRONMENT = 'development';
window.__runtime_config__.DEBUG_MODE = true;
window.__runtime_config__.GATEWAY_URL = 'http://localhost:8080';
window.__runtime_config__.MEMBER_URL = 'http://localhost:8080/api/member';
window.__runtime_config__.AUTH_URL = 'http://localhost:8080/api/auth';
window.__runtime_config__.STORE_URL = 'http://localhost:8080/api/store';
window.__runtime_config__.CONTENT_URL = 'http://localhost:8080/api/content';
window.__runtime_config__.RECOMMEND_URL = 'http://localhost:8080/api/recommendation';
// 환경 설정
ENV: 'production',
DEBUG: false,
// 버전 정보
VERSION: '1.0.0',
BUILD_DATE: new Date().toISOString(),
}
// 설정 유효성 검사
if (!window.__runtime_config__.GATEWAY_URL) {
console.error('GATEWAY_URL이 설정되지 않았습니다.');
}
// 전역 함수로 설정 노출
window.getConfig = function(key) {
return window.__runtime_config__[key];
};
window.getFeature = function(featureName) {
return window.__runtime_config__.FEATURES[featureName] || false;
};
console.log('₩ON Runtime Configuration loaded:', window.__runtime_config__.ENVIRONMENT);