From 1440f335b7fcb382a41cf396b66260256b998b21 Mon Sep 17 00:00:00 2001 From: hyeonggil <> Date: Tue, 24 Mar 2026 22:26:13 +0900 Subject: [PATCH] =?UTF-8?q?=F0=9F=93=9D=20docs:=20FE=20AI=20=ED=91=9C?= =?UTF-8?q?=EC=A4=80=ED=99=94=20HTML=20=EB=AC=B8=EC=84=9C=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- html/fe_ai_standardization.html | 721 ++++++++++++++++++++++++++++++++ 1 file changed, 721 insertions(+) create mode 100644 html/fe_ai_standardization.html diff --git a/html/fe_ai_standardization.html b/html/fe_ai_standardization.html new file mode 100644 index 0000000..a244b48 --- /dev/null +++ b/html/fe_ai_standardization.html @@ -0,0 +1,721 @@ + + + + + + +FE AI 표준화 방안 + + + + +
+ +
+
🤖 AI-Powered
+

FE AI 표준화 방안

+

브레인스토밍을 바탕으로 정리한 프론트엔드 AI 활용 표준화 단계별 가이드

+
+ + + +
+
+
STEP 01
📋 기획
+
→
+
STEP 02
🎨 디자인
+
→
+
STEP 03
⚙️ 구현
+
→
+
STEP 04
✅ 검증
+
+ + +
+
+
01
+
+
Step 01 · Planning
+
📋 기획
+
AI 기반 스펙 검토 · SEO · 번역 코드 자동화
+
+
+
+
+ +
+
+
🔍
+ ✦ AI +
+
스펙 검토 표준화
+
+ 플로우차트 기준 + 기능 요건 정의 +
+
+ +
+
+
🌐
+ ✦ AI +
+
SEO 정보 표준화 및 검증
+
+ 검증 도구 선정 + 검증 프로세스 표준화 +
+
+ +
+
+
🗣️
+ ✦ AI +
+
번역코드 생성 표준화
+
+ i18n 키 자동 생성 +
+
+ +
+
+
+ + +
+
+
+
+ + +
+
+
02
+
+
Step 02 · Design
+
🎨 디자인
+
Figma 네이밍 규칙 · EDM · 프로모션 템플릿 표준화
+
+
+
+
+ +
+
+
🖊️
+ ✦ AI +
+
피그마 네이밍 규칙
+
+ 컴포넌트 명명 규칙 +
+
+ +
+
+
📧
+ ✦ AI +
+
EDM 마크업 표준화
+
+ 이메일 템플릿 규격 정의 + 이메일 마크업 표준화 + 이메일 검증 도구 선정 + 이메일 검증 프로세스 표준화 +
+
+ +
+
+
🎯
+ ✦ AI +
+
프로모션 마크업 표준화
+
+ 필요 정보 입력 방식 + 이미지 url, 기간, 유의사항, 아이템코드 +
+
+ +
+
+
+ + +
+
+
+
+ + +
+
+
03
+
+
Step 03 · Implementation
+
⚙️ 구현 (개발)
+
AI 코딩 · 컨벤션 · 리뷰 · CI/CD · 기술문서 자동화
+
+
+
+
+ +
+
+
💻
+ ✦ AI +
+
AI 코딩
+
+ Copilot + Cursor + 코드 자동 완성 +
+
+ +
+
+
📐
+
+
개발 컨벤션 표준화
+
+ i18n + 미들웨어 + 언어정책 + 점검 + 인트로 + 에러 +
+
+ +
+
+
🔄
+ ✦ AI +
+
코드 리팩토링
+
+ AI 리팩토링 제안 + 품질 개선 +
+
+ +
+
+
👁️
+ ✦ AI +
+
코드 리뷰 자동화
+
+ AI 코드 리뷰 + MR/PR 자동 요약 + Conflict 처리 +
+
+ +
+
+
📝
+ ✦ AI +
+
파일 수정 표준화
+
+ 커밋 메시지 표준 + 단위 테스트 표준 + 테스트 코드 자동 생성 +
+
+ +
+
+
⚡
+ ✦ AI +
+
CI 파이프라인
+
+ 파이프라인 스크립트 생성 + 빌드 오류 분석 + 최적화 제안 +
+
+ +
+
+
📚
+ ✦ AI +
+
기술 문서 자동화
+
+ 기능별 ERD 작성 + README 자동 생성 + 주석 자동 생성 +
+
+ +
+
+
🔒
+ ✦ AI +
+
보안검수 표준화
+
+ 취약점 자동 탐지 + 보안 패턴 검사 +
+
+ +
+
+
+ + +
+
+
+
+ + +
+
+
04
+
+
Step 04 · Verification
+
✅ 검증
+
AI 기반 테스트 설계 · 통합 테스트 · 성능·보안 검토 · 버그 수정
+
+
+
+
+ +
+
+
🧪
+ ✦ AI +
+
테스트 케이스 설계
+
+ 케이스 자동 생성 + 엣지 케이스 도출 +
+
+ +
+
+
🔗
+ ✦ AI +
+
기능·통합 테스트
+
+ 테스트 자동화 스크립트 + 이슈 자동 탐지 +
+
+ +
+
+
⚡
+ ✦ AI +
+
성능·보안 검토
+
+ 취약점 탐지 + 병목 분석 +
+
+ +
+
+
🐛
+ ✦ AI +
+
버그 리포트·수정
+
+ 버그 원인 분석 + 수정 제안 + 자동 리포팅 +
+
+ +
+
+
+ + +
+
+
AI 적용 포인트 요약
+
+
+ +
+ +
+
📋
+
기획
+
스펙 검토 · SEO 추출
번역 코드 생성
+
+ +
+
🎨
+
디자인
+
Figma 네이밍
EDM · 프로모션
+
+ +
+
⚙️
+
구현
+
AI 코딩 · 컨벤션
리뷰 · CI · 문서화
+
+ +
+
✅
+
검증
+
테스트 자동화
성능·보안 · 버그 수정
+
+ +
+ +
+ +
+ FE AI 표준화 방안 · Smilegate FE Team · 2026 +
+
+ + +