Discourse MCP를 이용해 테마를 빠르게 만들기

,

커뮤니티를 시작하는 데 가장 큰 장벽은 흔히 "나만의 색을 입히는 것"입니다.

원하는 폰트, 브랜드와 어울리는 스타일을 원하시죠.

이 글에서는 다음 도구들을 활용하면 비교적 간단하게 무엇을 해낼 수 있는지 보여드리고자 합니다.

여기서 Codex를 선택한 이유는 최근 출시된 GPT-6 Astra가 놀라운 재능을 가진 비주얼 아티스트이기 때문입니다. Kimi K3Fable도 이 분야에서 꽤 강력하지만, 이 데모에서는 Astra를 사용했습니다.

1단계 - API 키 생성

다음 경로로 이동하세요: your.site/admin/api/keys/new

글로벌 API 키를 생성하세요.

보안 참고: 이 키를 안전하게 보관하고, 작업이 완료되면 폐기하는 것을 고려하세요. 이 키는 사이트에 대한 제한 없는 접근 권한을 부여합니다.

2단계 - Discourse MCP 추가

이 튜토리얼에서는 codex를 사용합니다:

수정: ~/.codex/config.toml

[mcp_servers.discourse]
command = "npx"
args = [
  "-y",
  "@discourse/mcp@latest",
  "--toolsets",
  "all",
  "--allow-writes",
  "--site",
  "https://figment123.discourse.group",
  "--auth_pairs",
  '[{"site":"YOUR_SITE","api_key":"YOUR_API_KEY","api_username":"system"}]',
]

(참고: Codex는 활성화/비활성화할 MCP를 선택할 수 없으며, 설정 파일에 있는 모든 항목이 활성화됩니다. MCP를 일시적으로 비활성화하려면 enabled = false를 추가할 수 있습니다)

:writing_hand: 도구 관련 참고: Discourse MCP는 140개 이상의 도구를 지원하며, 이 설정은 모두를 사용 가능하게 합니다. Claude와 Codex와 같은 현대적인 하네스는 이를 잘 처리하지만, 이 정도의 도구 수에 대해 많은 하네스는 어려움을 겪을 수 있습니다(예: Grok build는 필터링이 필요합니다)

Discourse MCP를 추가한 후, 에이전트가 이를 접근할 수 있는지 확인하세요:

3단계 - 에이전트에 작업을 수행하는 데 필요한 도구 제공

에이전트가 다음을 갖추고 있다면 훨씬 더 잘 수행됩니다:

  1. 눈: 자신의 작업을 볼 수 있는 능력 (playwright MCP, 컴퓨터 사용 등)
  2. 컨텍스트: Discourse MCP가 도움이 되지만, Discourse 소스 코드도 도움이 됩니다.
  3. 이미지 생성: 자산 등이 필요할 경우를 대비하여.

ChatGPT 앱에는 내장 브라우저가 있으므로, 이를 사용하도록 하세요. discourse/discourse 코드베이스를 클론하고 Discourse 디렉터리에서 에이전트를 시작하는 것을 잊지 마세요.

이것들은 필수는 아니지만, 갖추고 있으면 훨씬 더 나은 결과를 얻을 수 있습니다.

4단계 - 에이전트에 지능과 명확한 브리프 제공

이번에는 매우 좋은 결과를 보고 싶었으므로 GPT-6 Astra XHIGH를 선택했습니다.

다음으로, AI에게 제가 원하는 것(뉴요커 커뮤니티 테마)에 대한 짧은 브리프를 작성했습니다.

AI 작성 브리프

The Salon을 구축하세요. 세련된 Discourse 테마로, 고객이 Discourse의 정체성을 얼마나 극적으로 변형할 수 있는지를 보여주는 것입니다. 창의적 참고 자료는 The New Yorker입니다: 독자们在 대화에 참여하는 편집 기관입니다. 복제가 아닌 원래의 정체성을 창조하세요—도난된 로고나 라이선스되지 않은 독점 서체는 사용하지 마세요. 따뜻한 아이보리(#F7F4ED), 거의 검은 잉크(#20201E), 절제된 편집용 빨강(#B52B32), 가는 줄, 넉넉한 여백, 표현력 있는 세리프 헤드라인, 가독성 있는 세리프 본문 텍스트, 컴팩트한 산세리프 메타데이터를 사용하세요. 모노크롬 일러스트는 유머와 개성을 더해야 합니다. 데모에 필요한 모든 자산—폰트, 일러스트, 사진, 아바타, 아이콘—을 소싱, 다운로드 또는 생성하는 데 창의적 자유가 있습니다—적절하게 라이선스된 자료를 사용하고 필요한 경우 출처를 명시하세요. 범용 SaaS 카드, 가짜 양피지, 장식적 혼란을 피하세요. 다른 색상의 스톡 포럼이 아니라, 그 안에 살아있는 커뮤니티가 있는 현대적인 문예 잡지를 목표로 하세요.

데모 인스턴스에 카테고리를 설정하고, 주제, 답변, 가상의 기여자 프로필, 그리고 경험을 매력적으로 만드는 데 필요한 지원 콘텐츠를 추가하는 것은 명시적으로 승인됩니다. 기존 실제 콘텐츠를 보존하고, 가상의 활동은 데모 데이터임을 명확히 식별 가능하게 하세요. The Commons, Arts & Letters, City Life, Science & Ideas, Table Talk라는 다섯 가지 편집 부서를 독특한 설명과 일러스트와 함께 만드세요. 강력한 THE SALON 마스트헤드, 큐레이션된 리드 토론, 부수적인 헤드라인, 최신 대화 섹션을 구축하세요. "언제 모든 취미가 사이드 hustle이 되었는가?"와 "당신의 마음을 실제로 바꿀 것은 무엇인가?"와 같이 생각 깊고 다양한 토론을 시드하고, 설득력 있는 시작 게시물, 실질적인 이견, 짧은 답변, 인용, 잘 선택된 이미지를 포함하세요. 밀도, 스크롤링, 내비게이션을 시연할 수 있는 충분한 콘텐츠를 채우세요; 반복적인 채우기 텍스트를 사용하지 말고 중요한 화면을 비워두지 마세요. 모든 헤드라인은 실제 주제를 열어야 하며, 활동, 답변 수, 읽지 않은 상태가 항상 표시되어야 합니다. 카테고리 목록, 주제 페이지, 검색, 컴포저에 걸쳐 정체성을 유지하세요: 시작 게시물은 아름답게 타이포된 에세이처럼 느껴져야 하고, 답변은 컴팩트하고 사용 가능한 대화로 남아야 합니다. 모바일은 평온한 단일 열 경험이어야 하며, 다크 모드는 동일하게 의도적으로 느껴져야 합니다.

구현 세부 사항을 선택하기 전에 대상 Discourse 버전과 지원되는 테마 API를 검사하세요. 유지보수 가능한 테마와 초점을 맞춘 테마 컴포넌트를 선호하세요; 코어 패치, 불필요한 플러그인, 취약한 DOM 조작, 발명된 기능을 피하세요. 편집 큐레이션을 명시적이고 구성 가능하게 하세요. 모든 세부 사항에 대해 승인을 요청하는 대신, 가역적인 디자인, 자산, 스테이징 결정에 대해 자율적으로 작업하세요; 대표적인 홈 페이지와 콘텐츠가 채워진 주제 페이지로 시각적 언어를 확립한 후, 지원 표면을 마무리하세요. 설치 가능한 테마, 필요한 컴포넌트, 재현 가능한 데모 콘텐츠 설정, 자산 출처, 간결한 설치 지침을 전달하세요. 데스크톱과 모바일에서 실제 Discourse 인스턴스에서 결과를 검증하세요. 키보드 내비게이션, 대비, 읽지 않은 상태, 검색, 인용, 작성을 포함하세요. 테마 적용 전후의 동일한 스테이징된 커뮤니티를 캡처하여 변형이 의심의 여지가 없도록 하세요. 기준은 고객 준비가 된 데모입니다—모크업이 아니요, 아름다운 홈 페이지만이 아니요, 완전히 다른 장소감을 가진 일관되고 작동하는 커뮤니티입니다.

  • 필요 시 Discourse 소스 참조
  • https://figment123.discourse.group/는 데모 사이트이며, 원하는 대로 사용할 수 있고, 진행하면서 결과를 보고, 테마를 활성화할 수 있습니다.
  • 필요 시 주제 생성

5단계 - 훌륭해 보입니다!

1시간 10분 후, Astra Xhigh가 완료되었습니다.

아름다운 New Yorker에서 영감을 받은 테마입니다.

이 테마는 완벽하지 않고 엣지 케이스가 있습니다. 디자인이 어긋난 영역을 붙여넣고 에이전트가 수정하도록 하는 6단계 정제를 권장합니다. 하지만 시작점으로서, 오늘 우리가 이 일을 할 수 있다는 것은 정말 놀랍습니다. 1년 전에는 불가능했습니다.

실시간 정제 예시:

3개의 좋아요