하나의 HTML 파일로 구축된 eBay와 Aukro용 강력한 AI 콘텐츠 어시스턴트. 무료

카테고리

프로그래밍/소프트웨어 개발

서브카테고리

웹 개발

대상자

• 웹 개발자 및 e-커머스 판매자
• 단순한 인터페이스와 오프라인 기능이 필요한 사용자
• AI 기반 콘텐츠 생성 도구를 활용하고자 하는 개발자

핵심 요약

• 단일 HTML 파일로 구성
• Vanilla JavaScript (ES6+), HTML5, CSS3 사용
• localStorage로 데이터 저장 및 로컬 관리
• Google Gemini API 통합
• 브라우저에서 직접 API 호출 (서버 없이)
• 사용자 제공 Gemini API 키 저장 및 안전한 처리
• 핵심 기능
• AI 콘텐츠 생성, 이중 에디터 (eBay/CK), 실시간 미리보기, 통화 변환기, 백업/복구 기능

섹션별 세부 요약

1. 기술 스택 및 아키텍처

• Vanilla JavaScript 사용으로 복잡한 프레임워크 없이 개발
• HTML5 & CSS3로 구현된 다크 모드 UI
• localStorage를 활용한 로컬 데이터 저장 (템플릿, 채팅 기록, 설정)
• Gemini API 직접 호출로 서버 비용 및 프라이버시 문제 해결

2. 주요 기능 및 구현

• AI 콘텐츠 생성
• 하나의 클릭으로 제품 템플릿 완성
• 구조화된 JSON 반환을 위한 프롬프트 엔지니어링
• 이중 에디터
• eBay (EN) 및 Aukro (CZ) 맞춤형 편집기
• 실시간 미리보기
• iframe 기반 실시간 업데이트
• 통화 변환기
• Frankfurter.app API 활용

3. 기술적 도전 및 해결

• 단일 파일 제약
• React/Vue 없이 상태 관리 및 이벤트 리스너 설계
• CSS 아키텍처
• SASS 없이 CSS 변수 및 모듈화된 클래스 이름 사용
• 보안 및 프라이버시
• 사용자 데이터 및 API 키 로컬 저장 (서버 전송 없음)

결론

• MIT 라이선스로 오픈소스 제공 (GitHub: https://github.com/covenant666/AI-Content-Assistant-PRO)
• 단일 파일 구조로 오프라인 사용 가능
• AI 콘텐츠 생성 도구의 실무 적용 예시로, 템플릿 생성, 언어 전환, 데이터 백업 기능이 핵심