Manus는 뉴스레터·로그인·AI 챗봇을 갖춘 운영형 홈페이지를 프롬프트로 구현했다.

01핵심 개요

• 오후다섯씨는 단순 전시용 프론트엔드와 달리 로그인, 데이터 저장, 구독 관리가 필요한 운영형 웹사이트 제작을 시연했다.
• Manus에 디자인 이미지와 요구사항을 입력하자 블루프린트를 먼저 제시하고, 확인 후 홈페이지 개발을 진행했다.
• 구현 사례에는 유튜브 영상 연결, 아티클 발행, 이메일 구독, 관리자 통계, 월요일 뉴스레터 예약이 포함됐다.
• 뉴스레터 발송에는 Resend 외부 서비스를 사용하며, 사용자는 계정 생성 후 API 키를 제공하는 방식으로 연결했다.
• 도메인 연결, GitHub 통합 백업, 스케줄 트리거, SEO 지원과 사용량 기반 비용 구조도 함께 소개됐다.

02핵심 주장 / 논점 구조

• 생성형 AI로 화면만 만드는 일보다, 만든 뒤 로그인·구독·데이터·운영을 관리하는 일이 더 중요하다고 설명했다.
• 많은 AI 빌더가 인터페이스 단계에 머무르는 반면, Manus는 운영 기능까지 포함해 구현한다고 평가했다.
• 시연의 핵심은 오후다섯씨 채널을 위한 실제 운영 가능한 홈페이지를 프롬프트만으로 만드는 것이었다.
• 제작자는 코딩하지 않았으며, 디자인 이미지와 사이트 기능·권한·운영 조건을 텍스트로 요청했다고 밝혔다.

03요구사항과 디자인 프롬프트 구성

• 채널 한 줄 소개로 ‘만드는 사람의 AI’를 넣고, 유튜브 AI 채널이라는 성격을 홈페이지에 반영하도록 요청했다.
• 영상은 주제별로 진열하고 클릭 시 유튜브로 이동하게 하며, 작성 글을 올려 읽을 수 있는 블로그 기능도 요구했다.
• 방문자가 이메일을 남기면 새 글 발행 시 뉴스레터를 보내고, 매주 월요일 아침 그 주의 글 3개를 자동 발송하도록 설정했다.
• 관리자만 글 작성·수정을 하고 방문자는 읽기와 구독만 하도록 권한을 나눴으며, 관리자 화면에는 구독자 명단과 방문 통계를 요청했다.
• 스위스 미니멀 디자인 이미지를 제공하고 제목 대문자화, 큰 날짜, 사진 배치 등 세부 디자인도 지정했다.

04블루프린트 확인 후 개발하는 과정

• Manus는 바로 제작하지 않고 운영·구독 관리 기능을 포함한 블루프린트를 먼저 제시해 스타일과 기능을 확인하도록 했다.
• 블루프린트에서 뉴스레터 기능과 AI 챗봇 기능을 선택할 수 있었으며, 이를 바탕으로 개발 시작 여부를 물었다.
• 영상에서는 결과 수정 전에 계획을 검토할 수 있어 토큰을 사용한 뒤 재작업하는 부담을 줄인다고 설명했다.
• 승인 이후 Manus는 공개 홈페이지와 운영 구조를 만들고, 영상 링크·아티클·통계·AI 응답·예약 경로를 연결했다고 표시했다.

05뉴스레터와 AI 챗봇의 연결 방식

• 뉴스레터 자동 발송에는 Resend를 외부 서비스로 사용하며, 사용자는 Resend 로그인·계정 생성·API 키 제공만 수행한다고 설명했다.
• API 키 같은 비밀 설정은 보안 처리가 중요하다고 언급했고, AI 기능과 데이터베이스는 Manus에서 처리된다고 소개했다.
• 방문자는 로그인 없이 이메일을 입력해 구독할 수 있으며, 시연 화면에는 ‘다음 월요일에 세 글을 보내 드립니다’라는 안내가 나타났다.
• AI 채팅창에는 AI 워크플로 시작법, AI 에이전트 업무 분배, 메모와 AI 연결법 등의 예시 질문이 표시됐다.
• 예시 질문을 입력하자 챗봇이 즉시 답변했으며, 제작자는 자신의 소개와 글을 바탕으로 답하는 기능을 요청했다고 밝혔다.

06완성된 공개 사이트와 관리자 기능

• 완성 화면은 블랙앤화이트 기반의 스위스 디자인으로 구성됐고, 영상 제목에 마우스를 올리면 반전되는 효과가 적용됐다.
• 비디오와 아티클 카테고리가 분리됐으며, 아티클 이미지도 Manus가 만들었다고 제작자는 설명했다.
• 백엔드에서는 뉴스레터, 아티클, 스케줄, 사이트 방문 정보 등이 데이터베이스에 등록되는 구조를 보여 줬다.
• 로그아웃 후 등록된 정보로 로그인하는 화면을 시연했고, 관리자 기능도 Manus가 함께 만들었다고 밝혔다.
• 관리자 화면에는 작성 글, 구독자 2명, 당일 방문자 8명과 뉴스레터 리스트가 한눈에 표시됐다.

07도메인·백업·SEO·비용 구조

• Manus가 자동 도메인을 제공하며, 기존 도메인을 연결하거나 서비스 안에서 도메인을 구매할 수 있다고 설명했다.
• GitHub 통합을 활성화하면 구축된 시스템을 GitHub와 연동해 백업하고 다른 개발자와 협업할 수 있다고 소개했다.
• 스케줄 기능은 정해진 시간에 트리거를 실행해 알림이나 특정 이벤트를 만들 수 있는 기능으로 설명됐다.
• SEO 지원을 통해 검색 엔진에 잘 노출되도록 작업할 수 있다고 밝혔다.
• 사용량 화면에서는 무료 클라우드 비용 10달러가 제공되고, AI 통합 기능은 사용량만큼 비용을 내는 구조라고 소개했다.

08용어 사전