비개발자의 오픈소스 모델 기반 AI 에이전트 활용기: 헬피코드로 블로그 시스템 구축하기

개발자 없이 블로그 시스템을 만들 수 있을까요?
바이브코딩으로 웬만한 홈페이지는 딸깍 만들 수 있지만, 블로그의 경우 작성 시스템부터 데이터 연동 등 복잡도가 높아 아직은 CMS 툴을 도입하거나 개발팀의 도움이 필요하곤 합니다.
엘리스에서는 코딩을 한 줄도 모르는 마케터가 사내 AI 코딩 에이전트 헬피코드에 오픈소스 모델 GLM-5.2를 연동해 반나절 만에 엘리스스쿨 홈페이지에 블로그 시스템을 직접 만들었습니다. 블로그 업로드를 위한 html 구조부터 픽셀 삽입, 스키마 마크업 같은 테크니컬 SEO까지 적용한 글 8개와 10개 이상의 페이지, 비개발자가 직접 글을 등록하는 관리자 패널까지 갖추었죠. 지금부터 오픈소스 모델을 활용하여 안정적이고 안전한 블로그 시스템 구축 과정을 공유합니다.

▲ 헬피코드로 구축한 엘리스스쿨 블로그 목록 페이지

엘리스스쿨은 왜 자체 블로그가 필요했나요?

엘리스스쿨은 학교를 위한 안전한 AI 에듀테크 서비스로, 엘리스스쿨에서 제공하는 서비스를 소개하는 별도의 홈페이지를 갖고 있습니다. 다만 그동안 학교의 엘리스 제품 도입 사례나 교사의 현장 경험담 같은 콘텐츠를 올릴 수 있는 자체 블로그가 없어 엘리스그룹 공식 블로그에 올린 뒤 아웃링크로 연결하는 방식을 사용했습니다.

문제는 그룹 홈페이지 블로그와 엘리스스쿨 블로그의 성격이 맞지 않는다는 점이었습니다. 그룹 홈페이지에서는 엘리스스쿨이라는 서비스에 대해 소개하고 있지 않았고 홈페이지 내 블로그는 기업/기관 대상의 콘텐츠 중심이라 학교와 교사를 위한 글을 그대로 올리기 어려웠습니다. 엘리스스쿨에는 엘리스스쿨만의 블로그가 필요했지만 이를 위해 개발 리소스를 새로 확보하거나 CMS 툴을 연동하는 것이 쉽지 않았습니다.

헬피코드는 일반 AI 코딩 도구와 무엇이 다를까요?

코드를 작성하고 배포까지 직접 수행하는 것은 이제 헬피코드만의 특징이 아닙니다. Claude Code, Codex 같은 상용 AI 코딩 에이전트도 쉘, 파일, 도구 호출로 직접 작업이 가능합니다. 헬피코드의 차이는 그 작업을 어디서, 어떤 모델로, 얼마의 비용으로 하느냐에 있습니다.

첫째는 데이터 위치입니다. 헬피코드는 사내 데이터와 코드가 회사를 벗어나지 않는 환경(사내망, 온프레미스 등)에서 동작하도록 만들어졌습니다. 둘째는 모델과 비용입니다. 벤더 모델에 고정되지 않고 검증된 오픈소스 모델을 골라 쓰며, 구동 비용이 프론티어 모델의 약 1/5 수준입니다. 비용 부담이 작으니 부담 없이 여러 번 시도하고 고쳐 보는 실험도 자유로웠습니다.

상용 AI 코딩 에이전트와 헬피코드의 차이를 정리하면 다음과 같습니다.

이번 구축에 연동한 모델은 GLM-5.2입니다. GLM-5.2는 오픈 웨이트(MIT 라이선스) 모델 중 코딩 성능이 가장 앞선 축으로, 에이전트·장기 코딩 벤치마크에서 Claude Opus 4.8에 근접합니다. 이 사례와 직접 관련된 MCP 도구 사용(MCP-Atlas)에서 76.8점(Claude Opus 4.8은 77.8점), 장기 소프트웨어 과제(FrontierSWE)에서 74.4점(Claude Opus 4.8은 75.1점)을 기록했습니다(출처: Z.ai, 2026). 오픈 웨이트라 자체 인프라에서 직접 구동할 수 있다는 점도 이번 작업에 유리했습니다. 그 외 Nemotron 3 Ultra, Kimi-K2.6 등 검증된 오픈소스 모델도 환경에 맞춰 선택할 수 있습니다.

엘리스 홈 MCP를 연결하여 플랫폼에서 즉각 작업 실행

헬피코드가 플랫폼을 직접 다룰 수 있었던 배경에는 엘리스 개발팀이 미리 만들어 둔 엘리스 홈 MCP(기관 홈 MCP)가 있습니다. MCP(Model Context Protocol)는 AI 에이전트를 외부 플랫폼에 연결하는 표준 방식입니다. 헬피코드에 엘리스 홈 MCP를 연결하면 헬피코드가 엘리스 홈 플랫폼을 직접 다룰 수 있는 통로가 열려 원활한 작업이 가능합니다.

연결한 뒤 헬피코드가 수행할 수 있는 작업은 다음과 같습니다.

• 엘리스 홈 플랫폼에 페이지 생성·수정
• 콘텐츠 저장소(KV) 관리와 이미지 업로드
• 기존 페이지에 콘텐츠 추가·편집
• 엘리스그룹 홈페이지에서 콘텐츠 가져오기

연결 자체에는 개발 지식이 거의 필요하지 않았습니다. 헬피코드 설정에 개발팀이 안내한 엘리스 홈 MCP 주소를 등록하고 계정으로 로그인하면 됩니다. 조직이 자사 플랫폼용 MCP를 한 번 준비해 두면, 비개발자도 헬피코드로 곧바로 그 플랫폼을 다룰 수 있습니다.

6단계로 진행한 대화 기반의 블로그 시스템 개발 과정

구축은 여섯 단계로 진행했습니다. 마케터는 요구사항을 자연어로 전달했고, 기술적 판단과 실행은 헬피코드가 담당했습니다.

1단계: 플랫폼 기반 데이터 설계

헬피코드가 엘리스 홈 플랫폼의 KV(키-값 저장소)를 사용해 블로그 글 데이터를 JSON으로 저장하고, 페이지가 열리면 자동으로 불러오는 구조를 만들었습니다. 별도 데이터베이스 없이 플랫폼 자체 기능으로 해결했습니다. KV 응답이 느려도 페이지가 멈추지 않도록, 페이지 안에 대체(fallback) 데이터를 심어 두는 처리까지 포함했습니다.

2단계: 라이브 사이트 분석으로 디자인 맞추기

블로그 목록 페이지의 초기 버전은 파란색 기반이었습니다. 마케터가 다른 페이지와 폰트·구성·색감이 이질적이라고 전달하자, 헬피코드가 실제 렌더링된 사이트의 CSS를 분석했습니다. 플랫폼이 보라색 디자인 시스템을 쓴다는 점을 파악하고, 카드 반경 20px, 그림자 값, 버튼 스타일, 폰트 크기까지 맞췄습니다. 특정 페이지를 참고 대상으로 지정하자 그 페이지의 히어로 섹션 구조까지 분석해 동일하게 적용했습니다.

3단계: 개별 SEO 페이지 생성

목록에서 글을 누르면 개별 페이지로 이동하고, 각 페이지가 검색엔진에 노출되어야 했습니다. 헬피코드는 글마다 고유 URL과 함께 검색 최적화에 필요한 구조화 데이터를 넣어 줬습니다.

• Article JSON-LD: headline, datePublished, author, publisher(로고 포함), keywords, inLanguage, articleSection, mainEntityOfPage
• BreadcrumbList JSON-LD: 홈 > 블로그 > 카테고리 경로를 검색엔진에 명시
• Blog 스키마: 목록 페이지에 적용하고 publisher.logo 포함
• OG·트위터 메타 태그: 공유 시 제목·설명·이미지가 노출되도록 설정(og:locale은 ko_KR)

특히 중요한 판단이 하나 있었습니다. 이 구조화 데이터를 자바스크립트로 나중에 삽입하지 않고, 정적 HTML에 미리 넣도록 한 것입니다. 구글은 자바스크립트를 실행해 렌더링 후의 내용까지 읽지만, 네이버 등 일부 검색엔진은 자바스크립트 실행 전의 정적 HTML만 읽는 경우가 있습니다. 국내 검색 노출이 중요한 만큼, 메타 태그와 스키마를 정적 HTML에 심어 어떤 크롤러가 오든 동일하게 인식되도록 했습니다.

4단계: 외부 콘텐츠 마이그레이션

네 번째는 기존 콘텐츠 이전 작업이었습니다. 그룹 홈페이지에 있던 기존 고객사례를 블로그로 옮겨야 했습니다. 헬피코드가 해당 페이지를 직접 불러와 원문 텍스트와 이미지 주소를 추출하고, 인터뷰를 인용 블록으로 정리하고, 본문에 이미지를 넣고 테크니컬 SEO까지 적용했습니다.

5단계: 대화로 디버깅

블로그 링크를 누르면 404 오류가 발생했습니다. 마케터가 오류 상황을 그대로 전달하자, 헬피코드가 경로를 분석했습니다. 슬러그 설정에 오류가 생겨 플랫폼 URL 구조와 충돌한 것이 원인이었습니다. 목록 페이지의 링크 함수, 개별 페이지의 내비게이션, 5개 페이지의 슬러그를 한 번에 수정했습니다.

6단계: 관리자 패널

비개발자도 글을 등록할 수 있어야 했습니다. 목록 페이지 우하단에 연필 버튼을 배치했고, 누르면 제목, 카테고리, 요약, 태그, 본문 입력 폼이 열리게 구현했습니다. 저장하면 KV에 글이 등록되고, 데이터 유실을 막기 위해 브라우저 로컬 저장소에 백업도 남깁니다.

완성된 엘리스스쿨 블로그 구성

완성한 블로그는 제목, 태그 검색 및 카테고리 필터를 지원하고, 각 글에 넣은 썸네일이 목록에 표시됩니다. 이미지는 헬피코드에 요청하면 썸네일과 본문에 넣어 줍니다. 모든 글이 SEO에 맞게 구성되어 있고, 모바일에서도 레이아웃이 유지됩니다. 관리자 버튼으로 비개발자가 직접 글을 등록하고 삭제할 수 있습니다.

▲ 연필 버튼으로 여는 관리자 패널(제목, 카테고리, 요약, 태그, 본문 입력 가능)

명확한 요구사항과 사내 AI 도구가 만났을 때

블로그 시스템을 빠르게 구축할 수 있었던 이유는 크게 두 가지로 정리할 수 있습니다. 하나는 담당 마케터가 무엇을 만들지 명확히 알고 있었다는 점입니다. 자바스크립트는 몰라도 블로그에 검색이 필요한 이유와 SEO의 중요성, 카테고리 구성 기준은 알고 있었습니다. 다른 하나는 그 요구사항을 실제로 실행할 사내 도구입니다. 사내에서 안전하고 합리적으로 AI를 쓰도록 만든 헬피코드, 그리고 그 에이전트를 자사 플랫폼에 연결한 엘리스 홈 MCP가 있었기에, 명확한 요구사항이 곧바로 코드와 배포로 이어졌습니다. 둘 중 하나만 있었다면 이 결과는 나오지 않았을 것입니다.

바이브코딩은 이미 흔한 이야기입니다. 다만 대부분은 백지에서 새 앱을 만드는 사례입니다. 이번 경우는 이미 운영 중인 자사 플랫폼 위에서, 자사가 만든 에이전트와 오픈소스 모델로 실제 서비스 블로그를 구축하고 기존 콘텐츠까지 이관했다는 점이 다릅니다. 결국 비개발자의 업무 반경을 넓히는 것은 '누가 하느냐'가 아니라 '어떤 도구와 인프라를 갖췄느냐'입니다. 조직이 안전한 사내 AI 도구를 갖추면, 난이도 높은 업무도 대화로 해결할 수 있습니다.

기존 방식과 헬피코드의 업무 흐름을 비교하면 차이를 더욱 극명하게 확인할 수 있습니다.

우리 조직에도 적용하려면

만들고 싶은 것이 분명하다면, AI 코딩 에이전트로 개발 리소스 없이도 0에서 1을 만들 수 있습니다. 헬피코드를 자사 플랫폼에 연결해 두면 비개발 직군도 사내 웹과 콘텐츠를 대화만으로 구축할 수 있습니다. 보안이 중요한 환경이라면 사내망·온프레미스 구성으로도 도입할 수 있습니다.