🏆 AI스터디 17기 3주차 베스트 사례 큐레이션 - 개발&자동화

📚 17기 문과생도n8n

✍️ n8n으로 게시판 데이터 자동 크롤링 & 데이터 아카이빙 자동화

hope

하려던 것 📝

• 게시판의 게시글과 첨부파일을 자동으로 수집하여 구글 드라이브에 저장하는 사례

• 수동 데이터 수집 작업의 자동화 구현

• 주기적인 게시글 크롤링 및 저장 시스템 구축

활용한 툴 ⚒️

• n8n: 워크플로우 자동화 및 크롤링 구현

• Google Drive: 첨부파일 저장소로 활용

• Google Sheets: 게시글 데이터 저장 및 관리

• Gmail: 수집 결과 알림 전송

진행 세부 내용 🔍

• Schedule Trigger 노드를 사용하여 20분 주기로 자동 실행 설정함

2️⃣ 데이터 수집 구현

• HTTP Request와 HTML Extract 노드로 게시판 리스트 페이지 크롤링함

• Split Out 노드로 개별 게시글 URL 분리하여 상세 페이지 접근함

• 게시글 내용과 첨부파일 링크 추출함

3️⃣ 저장소 연동

• 첨부파일을 HTTP Request로 다운로드하여 Google Drive에 업로드함

• 게시글 메타데이터를 Google Sheets에 저장함

• Gmail을 통해 수집 결과 알림을 전송함

시행착오 ⚠️

• 데이터 구조 변경으로 인한 Google Drive와 Sheets 연동 실패 경험함

• 중복 데이터가 계속 쌓이는 문제 발생함

📚 17기 노션n8n롱폼

✍️ 영수증 처리 자동화 완성기 - 부가세 신고 기간마다 오는 고통 탈피를 위해!

Rhim_Lee

하려던 것 📝

• 5개 매장의 온라인 결제 영수증을 자동으로 분류하고 기록하는 시스템 구축 사례

• 부가세 신고 시 세무사와의 비효율적인 소통 문제 해결

• 직원들의 영수증 관리 업무 단순화함

활용한 툴 ⚒️

• Google Vision : 영수증 이미지 텍스트 추출

• GPT-3.5 : 추출된 텍스트 분석 및 계정 분류

• n8n : 워크플로우 자동화 구축

• Google Drive : 영수증 파일 저장 및 관리

• Google Sheets : 데이터 기록 및 관리

진행 세부 내용 🔍

• 비용 효율성 분석 진행

• Google Vision + GPT-3.5 조합으로 월 1,000원 이하 구축 결정

2️⃣ 워크플로우 구축

• 매장별 독립 폴더 시스템 구축

• 이미지 업로드부터 데이터 기록까지 8단계 자동화 구현

• Base64 변환, JSON 파싱 등 데이터 처리 로직 구현

3️⃣ AI 분류 시스템 개선

• 계정 분류 규칙 상세 정의

• LLM 프롬프트 지속 개선

• 데이터 검증 로직 추가

시행착오 ⚠️

• 초기 AI 분류 결과가 대부분 "기타"로 분류되는 문제 발생

• 바이너리 데이터 처리 과정에서 파일시스템 참조 문제 해결

• 프롬프트 엔지니어링을 통한 분류 정확도 개선

📚 17기 CTO

✍️ 네이버 부동산이 너무 불편해서 (반)자동화 해봤습니다! ver2!!

황인준

하려던 것 📝

• 네이버 부동산 매물 데이터를 실사용자 관점에서 개선한 스크래핑 서비스 구축 사례

• 핵심 매물 정보를 한눈에 보기 쉽게 정리하고자 함

• 개인 사용 목적에서 공유 가능한 서비스로 확장함

활용한 툴 ⚒️

• 카카오 지도 JS SDK: 매물 위치 시각화

• Puppeteer: 웹 스크래핑 자동화

• 네이버 모바일 API: 실거래가 데이터 수집

진행 세부 내용 🔍

• cortar\_no 필드를 추가하여 행정구역 기반 필터링 구현함

• 지역 기반 자동 그룹핑 및 UI 구성함

2️⃣ 카카오 지도 연동

• 위경도 기반 마커 표시 기능 구현함

• 인근 지하철역 정보 시각화함

3️⃣ 모바일 API 활용

• 네이버 모바일 API에서 JSON 형태로 실거래가 수집함

• 스크래핑 속도 3배 이상 향상됨

4️⃣ UI/UX 개선

• 정보를 6개 탭으로 분리하여 가독성 개선함

• 평형별 체크박스 필터 추가로 비교 기능 강화함

시행착오 ⚠️

• Web 버전 스크래핑 시 속도 저하 문제 발생함

• 단일 화면 구성으로 인한 가독성 저하 경험함

• 모바일 대응 부재로 사용성 제한됨

📚 17기 카톡봇뉴스레터

✍️ Perplexity 메신저봇 개발기 — 자바스크립트와 FastAPI, 그리고 시행착오들

suri

📚 17기 프리랜서n8n

✍️ 귀찮은 일정 입력, 스크린샷 기반 캘린더 자동화

쏠

하려던 것 📝

• 스크린샷 찍으면 자동으로 캘린더에 일정이 등록되는 시스템 구축 사례

• 일정 관리의 비효율성과 누락 문제 해결함

• 다양한 협업 툴에 흩어진 일정을 한곳에서 관리하고자 함

활용한 툴 ⚒️

• FolderSync: 안드로이드 스크린샷 자동 클라우드 업로드

• Google Drive: 스크린샷 저장소로 활용

• n8n: 자동화 워크플로우 구축

• ChatGPT/Claude: 코드 작성 및 문제 해결 지원

• OpenAI GPT-4: 이미지 분석 및 일정 정보 추출

진행 세부 내용 🔍

• FolderSync 앱으로 구글 드라이브 연동 설정함

• 와이파이 제한 및 앱 권한 문제 해결함

• 자동 동기화 설정 완료함

2️⃣ n8n 워크플로우 구성

• 단계별 분리 처리 방식 구현함

• AI Agent 통합 처리 방식 구현함

• 일정 분류 및 캘린더 등록 자동화 완성함

시행착오 ⚠️

• FolderSync 자동 동기화 문제 발생함

• 구글 포토 연동 시도 실패함

• 상대적 날짜 처리의 어려움 겪음

• 한국 시간대 처리 문제 발생함

📚 17기 Cursor웹앱

✍️ 퍼스널 브랜딩 페이지 업그레이드 해보기 (문의 기능 구현하기)

상상러

하려던 것 📝

• 퍼스널 브랜딩 페이지에 실제로 작동하는 문의하기 기능을 구현한 사례

• 기존 페이지의 문의 기능 미작동 문제를 해결하고자 함

• 사용자 친화적이고 효율적인 문의 시스템을 구축하고자 함

활용한 툴 ⚒️

• Cursor AI: 코드 작성 및 구현 방법 검토

• Google Apps Script: 문의 데이터 저장 및 관리

• Google Sheets: 문의 내용 저장소로 활용

진행 세부 내용 🔍

• Cursor AI를 통해 구현 방법 검토함

• 유료/무료 옵션을 비교 분석함

• 웹 검색 기능을 활용하여 최적의 솔루션을 탐색함

2️⃣ Google Apps Script 구현

• Google Sheets를 생성하여 데이터 저장소를 설정함

• Apps Script 코드를 작성하여 폼 데이터 처리 로직을 구현함

• 이메일 알림 기능을 추가함

3️⃣ 배포 및 설정

• 웹앱으로 배포하여 외부 접근을 가능하게 함

• 실행 권한을 "나"로 설정하여 사용자 편의성을 높임

• 환경 변수 설정을 통해 보안을 강화함

시행착오 ⚠️

• 초기에 유료 서비스인 EmailJS 방식을 검토했다가 변경함

• 실행 권한 설정에서 최적의 옵션을 찾는데 시간이 소요됨

📚 17기 n8n실전예제

✍️ 매일 아침, 글로벌 뉴스와 매일경제신문 뉴스를 요약해서 이메일로 받아보기

해피매지션

하려던 것 📝

• 해외 뉴스를 매일 아침 자동으로 요약하여 이메일로 받아보는 워크플로우 구축 사례

• 정보 과잉 시대에 중요 뉴스만 효율적으로 받아보기 위함

• 언어 장벽과 정보 과잉 문제 해결하고자 함

활용한 툴 ⚒️

• n8n: 전체 워크플로우 설계 및 실행

• News API: 해외 뉴스 데이터 수집

• Google Gemini: 뉴스 요약 및 번역

• Google Sheets: 이메일 수신자 관리

• Gmail: 요약된 뉴스 발송

진행 세부 내용 🔍

• Schedule Trigger로 매일 오전 8시 자동 실행 설정함

2️⃣ 데이터 수집

• HTTP Request 노드로 News API 연동함

• country=us 파라미터로 해외 뉴스 수집함

3️⃣ AI 가공

• Gemini에 상세 프롬프트 작성하여 뉴스 요약 및 번역 수행함

• HTML 형식의 이메일 템플릿 구조화함

4️⃣ 발송 자동화

• Google Sheets에서 수신자 정보 연동함

• Gmail 노드로 개인화된 제목과 본문 발송함

시행착오 ⚠️

• 한국 뉴스(country=kr) 수집 시 과거 뉴스만 나와 제외함

• AI 결과물 품질이 낮아 프롬프트 여러 차례 수정함

📚 17기 Figma

✍️ Figma Make로 성공사례 아카이빙 페이지 만들고 호스팅 실배포까지🔥

경원_

하려던 것 📝

• 에듀플렉스 성공사례 아카이빙 페이지를 만들어 매출 향상에 기여한 사례

• 개발자 없이 Figma Make로 UI/UX를 구축하고 실서버에 배포하기

• 학부모 고객이 후기를 읽고 구매를 결정할 수 있는 웹사이트 구축

활용한 툴 ⚒️

• Figma Make: UI/UX 디자인 및 React 코드 생성

• VS Code: 코드 수정 및 빌드 작업

• ChatGPT: 코드 오류 해결 및 배포 방법 안내

• Node.js: 프로젝트 빌드 환경 구축

진행 세부 내용 🔍

• 키 컬러와 톤앤매너를 기존 홈페이지 참고하여 프롬프트 작성함

• PC/모바일 반응형 디자인 조건 추가함

• 필터링 기능(성별, 학교급, 지역)과 게시판 기능 요구사항 명시함

2️⃣ 기능 분류 및 개선

• 필요/불필요 기능을 구분하여 디벨롭함

• GPT를 활용해 오류 해결 및 코드 개선함

3️⃣ React 프로젝트 내보내기

• Figma Make에서 전체 코드 export 요청함

• Cafe24 호스팅 배포를 위한 준비 작업 진행함

시행착오 ⚠️

• VS Code에서 프로젝트 폴더명 한글 사용 시 오류 발생함

• 외부 패키지 import 경로에 버전 정보 포함되어 빌드 오류 발생함

• 정규식을 활용해 import 경로 수정 작업 진행함