독립한 지 얼마 되지 않은 개인 사업자나, Web 담당자가 없는 회사라도 회사 안내를 중심으로 한 홈페이지라면 AI를 사용하여 직접 제작할 수 있습니다.

단, AI가 HTML이나 CSS를 생성한 시점에서는 아직 "공개할 수 있는 회사 홈페이지"가 아닙니다. 회사 정보가 정확한지, 공개 폴더에 비밀 정보가 들어있지 않은지, 정적 파일(Static file)로서 배포할 수 있는지 확인해야 합니다.

이 기사에서는 다음 범위를 다룹니다.

• 회사 정보를 정리하기
• 1페이지 분량의 정적 사이트(Static site) 만들기
• AI와 사업자가 공개 전 체크를 분담하기
• MCP를 사용하여 임시 공개하고 실물을 확인하기

실제 기업 프로젝트를 사용한 성과 보고가 아닙니다. 2026년 7월 31일 시점의 MCP 공식 자료, Sakupa의 공개 자료와 소스를 확인하여 구성한 자료형 가이드입니다. 단말기 상에서 일련의 조작을 완수하는 검증 기사가 아니므로, 실측치나 성공 결과는 기재하지 않습니다.

상정 독자는 소규모 사업자의 Web 제작을 겸임하는 사람과, 그 작업을 지원하는 엔지니어입니다.

이번에 대상으로 하는 것은 다음 정보를 담은 1페이지에서 몇 페이지 분량의 사이트입니다.

• 회사 및 사업자 소개
• 제공하는 서비스
• 영업시간, 소재지, 대응 지역
• 전화, 메일, 외부 폼 등의 문의처

이러한 회사 안내는 HTML, CSS, JavaScript, 이미지를 미리 생성하여 배포하는 정적 사이트(Static site)와 궁합이 좋은 용도입니다. 열람자마다 서버에서 페이지를 새로 만들 필요가 없으며, 공개 대상 파일도 확인하기 쉽습니다.

반면, 다음과 같은 요건이 있는 경우에는 정적 사이트만으로는 부족합니다.

• 회원마다 다른 정보를 표시
• 독자적인 결제나 예약 처리 실행
• 고객 정보나 재고를 데이터베이스(Database)에 저장
• 관리 화면에서 빈번하게 기사 업데이트
• 엄격한 감사, 가용성, 복구 시간이 요구됨

이러에는 인증, 서버 처리, 데이터베이스, 모니터링, 백업 등의 설계가 필요합니다. 처음에 이 경계를 결정해 두면, AI가 겉모습만 작동하는 코드를 생성하여 공개 단계에서 다시 만들어야 하는 사태를 피하기 쉬워집니다.

처음부터 "회사 사이트를 만들어줘"라고 부탁하면, 부족한 실적, 요금, 자격 등을 AI가 자연스러운 문장으로 채워 넣을 수 있습니다.

먼저 필요한 것은 게재해도 좋은 사실과 부족한 자료를 구분하는 것입니다.

나는 소규모 사업자입니다. 회사 안내를 위한 정적 사이트를 만듭니다.
회사명:
업종:
...

AI의 답변을 그대로 제작 지시로 사용하는 것은 피합니다. 원본 자료와 대조할 항목은 다음과 같습니다.

• 회사명, 주소, 전화번호
• 영업시간, 대응 지역
• 요금, 자격, 실적
• 서비스의 범위와 약속
• 사진, 로고, 사례, 고객의 목소리를 공개할 수 있는 권리

불명확한 항목은 빈칸으로 두거나 "확인 필요"로 남겨두세요.

회사 정보를 확인한 후의 제작 대상은 메인 페이지(Top page)뿐입니다.

확인된 회사 정보만을 사용하여 정적인 기업 사이트를 만들어 주세요.
처음에는 메인 페이지 1페이지로 합니다.
다음 내용을 포함해 주세요.
...

첫 번째 목표는 화려한 디자인이 아닙니다. 처음 회사를 알게 된 사람이 다음 세 가지를 판단할 수 있는 상태입니다.

• 어떤 것을 제공하는 회사인가
• 내가 대상이 되는가
• 어떻게 연락하면 되는가

히어로(Hero), 정보, 도입 이점, 행동 버튼(CTA), 푸터(Footer)를 한 줄로 나열한 구성 예시. 필자가 제작하였으며 게재 권리를 가진 웹사이트 제작 가이드의 소재입니다.

페이지를 늘리는 것은 이 1페이지를 스마트폰과 PC로 읽어보고, 부족한 정보가 무엇인지 파악한 후에도 늦지 않습니다.

공개 전 확인에는 AI가 기계적으로 조사하기 쉬운 항목과, 사업자만이 판단할 수 있는 항목이 있습니다.

AI에는 확인 결과를 두 가지로 나누어 출력하도록 합니다.

현재의 기업 사이트를 공개 전에 확인해 주세요.
결과를 "AI가 확인한 기술 항목"과
"사업자 본인이 확인해야 할 항목"으로 나누어 주세요.
...

"AI가 문제없다고 답했다"는 것만으로는 공개 전 체크 기록이 되지 않습니다. 정적 빌드(Static build) 명령, 출력 위치, 검출된 파일, 미확인 항목까지 표시하게 합니다.

공개 폴더에는 통상적으로 index.html

과 그것이 참조하는 CSS, JavaScript, 이미지 등이 포함됩니다. Next.js의 정적 출력이라면 out

, Vite라면 dist

가 후보이지만, 프로젝트 설정에 따라 달라지므로 폴더 이름만으로 결정하지는 않습니다.

로컬에서 완성된 파일을 외부 URL로 만들려면 호스팅 서비스로 전송해야 합니다. 이번에는 그 작업을 AI 도구로부터 실행하는 예시로 Sakupa MCP를 사용합니다.

MCP (Model Context Protocol)는 AI 애플리케이션을 외부 데이터나 도구에 연결하기 위한 오픈 표준입니다. Sakupa는 필자가 개발에 참여하고 있는 서비스입니다.

Sakupa MCP는 로컬의 stdio 서버로 동작합니다. 공개 대상을 로컬에서 분석하고, 빌드된 정적 파일을 업로드하기 때문에, 로컬 MCP 서버에 대응하는 AI 도구와 npx를 실행할 수 있는 환경이 필요합니다.

MCP 클라이언트에 등록하기 위한 기본 설정은 다음과 같습니다.

{
"mcpServers": {
"sakupa": {
...

설정 파일의 위치는 AI 도구마다 다르기 때문에 일률적으로 제시할 수는 없습니다. 설정을 변경하도록 AI에게 요청할 때도, 변경할 대상과 차이점(diff)을 표시하게 한 뒤에 허가하십시오.

현재 사용 중인 AI 도구에 제시한 설정으로 Sakupa MCP를 추가해 주세요.
설정을 변경하기 전에, 변경할 파일과 차이점을 설명해 주세요.
연결 후에는 이용 가능한 도구 이름을 표시해 주세요.
...

연결 후에는 먼저 analyze_site로 공개 가능 여부를 조사합니다. 로컬에서 프레임워크와 출력 위치를 감지하고, 서버 측에서 페이지를 생성하는 SSR, 데이터를 받는 API 루트, 비밀 정보 등 정적 공개에 적합하지 않은 요소를 확인하는 처리입니다.

Sakupa의 analyze_site를 사용하여 이 프로젝트를 분석해 주세요.
정적 빌드가 필요하다면, 실행할 명령어를 먼저 설명해 주세요.
공개 대상 폴더, 감지된 문제, 경고, 미확인 항목을 표시하고,
...

분석 결과와 사업자 본인의 확인이 모두 완료된 단계에서 deploy_site로 진행합니다. 그전에 공개 대상을 다시 한번 확인하십시오.

분석된 정적 출력을 임시 공개할 준비를 해주세요.
deploy_site를 실행하기 전에, 대상 폴더,
공개될 파일의 종류, 제외될 항목을 설명하고,
...

Sakupa의 무료 링크는 단기 확인용이며, 보통 24시간 동안 유효합니다. 동일한 공개원 네트워크에서 동시에 이용할 수 있는 유효한 무료 사이트는 3개까지입니다. 상한에 도달했을 때는 기존의 무료 URL을 명시적으로 선택하여 사이트를 인계해야 하므로, 다른 프로젝트의 URL을 선택하지 않도록 주의가 필요합니다.

무료 링크는 운영 사이트로 방치하지 말고, 실물을 확인하기 위한 임시 프리뷰로 취급합니다.

URL이 발행되면 AI의 완료 보고만으로 끝내지 말고, 스마트폰과 PC로 직접 열어보십시오.

• 회사명, 주소, 영업시간이 정확한가
• 전화, 이메일, 외부 폼의 링크가 작동하는가
• 이미지가 누락되지 않았는가
• 작은 화면에서도 글자와 버튼을 읽을 수 있는가
• "확인 필요"와 같은 임시 문구가 남아있지 않은가
• 공개해서는 안 되는 파일에 접근할 수 없는가

제삼자에게 URL을 보내기 전, 회사 정보와 공개 권한에 대한 최종 확인은 사업자 본인의 몫입니다.

최초 공개 후, Sakupa MCP는 프로젝트 내의 .sakupa/site.json에 사이트 관리 인증 정보를 저장합니다. 동일한 프로젝트에서 다시 공개하면 기존 사이트를 업데이트할 수 있습니다.

이 파일은 사이트를 관리하기 위한 열쇠입니다.

• 내용을 AI와의 대화창에 붙여넣지 말 것
• 공개 리포지토리(Repository)에 커밋하지 말 것
• 공개 폴더로 복사하지 말 것
• 프로젝트 내의 경로를 유지한 채, 접근이 제한된 장소에 백업할 것

Git을 사용하는 경우, 최소한 다음 항목을 제외(exclude)해야 합니다.

.sakupa/

Sakupa는 소스 코드의 보관 장소나 복구 보증이 포함된 백업 서비스가 아닙니다. 원본 프로젝트, 이미지, 정적 출력, 도메인 설정, .sakupa/site.json은 이용자 측에서도 별도로 보관해야 합니다.

AI를 이용한 자작(自作)이 적합한 경우는, 게재 내용을 사업자 스스로 확인할 수 있고, 정적 사이트 범위 내에서 충분하며, 공개 후의 원본 파일과 인증 정보를 관리할 수 있는 경우입니다.

반대로 로그인, 결제, 고객 데이터, 복잡한 예약, 법률적 판단, 높은 가용성이 필요하다면 처음부터 전문가를 포함하여 설계하는 것이 안전합니다. AI는 제작과 기계적인 확인을 도와줄 수는 있지만, 회사 정보의 정확성, 공개할 권리, 개인정보 취급, 업무상의 약속까지 결정해 줄 수는 없습니다.

우선 확인된 회사 정보만으로 1페이지를 만들고, 임시 URL로 실물을 확인합니다. 거기서 부족한 점을 파악한 뒤 페이지나 기능을 늘려가는 것이 이 절차의 최소 단위입니다.

• Model Context Protocol 공식 문서 (2026년 7월 31일 확인)
• Sakupa 웹사이트 제작 가이드 (2026년 7월 31일 확인)
• Sakupa 공개 가이드 (2026년 7월 31일 확인)
• Qiita 커뮤니티 가이드라인 (2026년 7월 31일 확인)

본문의 구성과 퇴고에는 생성 AI (Generative AI)를 사용했습니다. 제품 사양, 설정, 제한 사항은 공개 자료와 현행 소스에서 확인했습니다. 실행하지 않은 조작을 실측 결과로 기재하지 않았습니다.