docs: 2026-03-28-ai update

Author: TreeStone94

_posts/ai/2026-03-28-ai.md

@@ -50,7 +50,7 @@ categories: [Blogging,ai]
 
 ## **과정**
 
-처음에는 n8n을 활용해 챗봇을 만들려 했습니다. 사내에서 n8n을 통한 Wiki 페이지 생성과 자동화 효율성이 입증되면서, 팀 전체가 n8n 도입에 열광했기 때문입니다. 자연스럽게 첫 번째 프로토타입도 n8n으로 시작되었습니다.
+처음에는 n8n을 활용해 챗봇을 만들려 했습니다. n8n을 통한 Wiki 페이지 생성과 자동화 효율성이 사내에서 입소문을 타면서, 팀 전체가 n8n에 큰 관심을 갖게 되었기 때문입니다. 이러한 분위기 속에서 첫 번째 프로토타입 개발도 자연스럽게 n8n으로 시작되었습니다.
 
 하지만 n8n을 셀프 호스팅으로 운영하다 보니, 비개발자 팀원들이 이를 활용하려면 각자 환경을 구축하거나 복잡한 설정 과정을 거쳐야 하는 번거로움이 있었습니다. 도구가 오히려 업무의 짐이 되는 상황이었죠.
 
@@ -62,7 +62,7 @@ categories: [Blogging,ai]
 
 첫 번째로 만든 건 순수 n8n 워크플로우 기반의 채팅봇입니다. n8n 내장 Chat Trigger UI로 대화하면 Gemini AI가 자연어를 파싱하고, Confluence REST API로 Wiki 페이지를 조회·수정합니다.
 
-**워크플로우 구조**
+**n8n 워크플로우 구조**
 
 ![스크린샷 2026-03-28 오후 8.22.23.png](/assets/img/ai/2026-03-28-ai-02.png)
 
@@ -128,7 +128,7 @@ n8n 챗봇은 잘 동작했지만 **팀원들이 n8n을 설치해야 쓸 수 
 
 로그인 시 `btoa(id:pw)`로 만든 `authHeader`만 세션에 보관하고, n8n에 전달할 때도 이 값을 그대로 사용합니다. n8n은 받은 `authHeader`로 Confluence API를 직접 호출하기 때문에 n8n 서버에 계정 정보를 따로 등록할 필요가 없습니다.
 
-**n8n이 하는 일 (Webhook 수신 후):**
+**n8n 워크플로우 구조 (Webhook 수신 후):**
 
 ![스크린샷 2026-03-28 오후 8.53.35.png](/assets/img/ai/2026-03-28-ai-04.png)
 
@@ -162,21 +162,21 @@ n8n 챗봇은 잘 동작했지만 **팀원들이 n8n을 설치해야 쓸 수 
 | 만석 감지 | 미처리 | 해당 요일 전체 슬롯 순회 후 안내 |
 | n8n 설치 | 각자 설치 필요 | 팀 공용 서버 1대만 있으면 됨 |
 
-설정 화면에서 n8n 서버 URL과 기본 회의명을 지정할 수 있어, 팀 서버로 전환할 때는 URL만 바꾸면 됩니다.
+설정 화면에서 n8n 서버 URL과 기본 회의명을 지정할 수 있어, 팀 서버로 전환할 때는 URL만 바꾸면 된다고 생각했습니다.
 
 ![스크린샷 2026-03-28 오후 8.47.01.png](/assets/img/ai/2026-03-28-ai-03.png)
 
 ### **2.2 n8n 없이 Wiki API만으로 동작하는 최종 버전**
 
-Webhook 연동 버전도 잘 동작했지만 팀 서버가 없는 환경에서는 n8n을 띄워야 한다는 의존성이 남아 있었습니다. 그래서 n8n 로직 전체를 Chrome Extension JavaScript로 이식한 **완전 독립 버전**을 만들었습니다.
+Webhook 연동 버전도 잘 동작했지만 팀 서버를 만들어야 하는 비용과 팀 서버가 없는 환경에서는 n8n을 띄워야 한다는 의존성이 남아 있었습니다. 그래서 n8n 로직 전체를 Chrome Extension JavaScript로 이식한 **완전 독립 버전**을 만들었습니다.
 
 **변경 포인트:**
 
 - **`parser.js`** — Gemini AI 대신 규칙 기반 자연어 파싱으로 교체 요일·시간·회의실·회의명·소요시간을 정규식으로 추출하며, AI 호출 없이도 대부분의 입력을 처리
 - **`booking.js`** — n8n HTTP/Code 노드를 함수로 이식 `fetchPage()` → `checkAndBook()` → Confluence PUT 흐름을 직접 구현
 - **`popup.js`** — UI만 담당, n8n fetch 로직 제거
 
-**아키텍처:**
+**동작 흐름:**
 
 ```
 사용자 입력
@@ -195,15 +195,9 @@ booking.js: checkAndBook(...)
 popup.js: appendMessage('bot', message)
 ```
 
-**설치:**
-
-1. `room-booking-extension-v2` 폴더를 받는다
-2. Chrome 주소창에 `chrome://extensions/` 입력
-3. **개발자 모드** 켜기 → **압축해제된 확장 프로그램을 로드합니다** 클릭
-4. 폴더 선택 → 완료
-
 ## **마치며**
 
-처음에는 n8n의 강력한 워크플로우 기능으로 빠르게 프로토타입을 만들었고, 그 과정에서 Confluence HTML 파싱과 rowspan 처리라는 까다로운 문제를 풀었습니다. 그 로직을 검증한 뒤 Chrome Extension으로 이식하면서 팀원 누구나 설치 없이 사용할 수 있는 형태로 발전시켰습니다.
+![문서공유메시지](/assets/img/ai/2026-03-28-ai-05.png)
+처음에는 n8n의 워크플로우 기능으로 빠르게 프로토타입을 만들었고, 그 과정에서 Confluence HTML 파싱과 rowspan 처리라는 까다로운 문제를 풀었습니다. 그 로직을 검증한 뒤 Chrome Extension으로 이식하면서 팀원 누구나 설치 없이 사용할 수 있는 형태로 발전시켰습니다.
 
-AI를 활용한 것은 **설계와 구현의 속도**였습니다. Confluence Wiki HTML 구조 분석, rowspan 알고리즘 설계, Chrome Extension 보안 설계까지 AI로 프로그래밍하면서 혼자서라면 시도도 못했던 작업을 하루 이틀 만에 완성할 수 있었습니다.
+AI를 활용한 것은 **설계와 구현의 속도**였습니다. Confluence Wiki HTML 구조 분석, rowspan 알고리즘 설계, Chrome Extension 보안 설계까지 AI로 프로그래밍하면서 혼자서라면 시도도 못했던 작업을 하루 이틀 만에 완성할 수 있었습니다.