클로드 아티팩트로 만들 수 있는 것: 데이터가 저장되는 앱까지

클로드 채팅에 무언가 만들어달라고 하면 오른쪽에 작동하는 화면이 뜹니다. 이걸 아티팩트(Artifact)라고 불러요.

아티팩트가 데모라는 이야기는 클로드 채팅으로 만든 웹페이지는 왜 진짜 서비스가 못 되나요에서 다뤘습니다. 그런데 그 뒤로 기능이 꽤 늘었어요. 지금은 데이터를 저장할 수도 있고, 아티팩트 안에서 클로드를 호출할 수도 있습니다.

그래서 질문이 다시 필요해졌습니다.

아티팩트는 그럼 어디까지 되나요?
어디부터 클로드코드가 필요한가요?

아티팩트가 만들어주는 것들

먼저 무엇이 아티팩트가 되는지부터 봅니다. Anthropic 공식 안내 (새 탭에서 열림)는 대화와 분리해 수정하거나 다시 쓸 만한 자체 완결 결과물을 아티팩트로 보여준다고 설명해요.

• 문서 (마크다운, 일반 텍스트)
• 코드 조각
• 한 페이지짜리 HTML 웹사이트
• SVG 이미지
• 다이어그램과 순서도
• 상호작용하는 React 컴포넌트

마지막 항목이 우리가 "오, 작동하네" 하는 그 화면입니다. 버튼을 누르면 반응하고, 값을 입력하면 계산되는 화면이에요.

이제 되는 것 1: 링크로 공유하기

만든 아티팩트는 대화 안에만 머무르지 않습니다. 게시(Publish) 를 누르면 링크가 생기고, 링크를 받은 사람이 열어서 직접 써볼 수 있어요.

아티팩트를 만듦
→ 열어서 Publish
→ 링크 생성
→ 링크를 받은 사람이 열어서 사용

계정이 없는 사람도 게시된 아티팩트를 열어 계산기, 버튼과 같은 기본 기능을 사용할 수 있습니다. 아티팩트 안에서 클로드를 호출하는 AI 기능을 쓰거나 자기 버전으로 복사하려면 로그인이 필요해요. Team·Enterprise에서 공유한 아티팩트는 공개 링크가 아니라 조직 안에서만 열리고, 조직 계정으로 인증해야 합니다.

게시하지 않으면 사이드바의 아티팩트 목록에도 나타나지 않습니다. 대화를 다시 찾아 들어가야 해요. 계속 쓸 물건이면 게시부터 하는 편이 낫습니다.

이제 되는 것 2: 데이터 저장하기

가장 크게 달라진 부분입니다. 예전에는 새로고침하면 입력한 내용이 전부 사라졌지만, 지금은 아티팩트에 저장소를 붙일 수 있어요.

다만 조건이 촘촘합니다. 이 조건을 모르고 만들면 "저장이 안 되는데요"에서 막히니 먼저 정리합니다.

특히 네 번째가 중요합니다. 만드는 중에 테스트하면 저장이 실패해요. 고장난 게 아니라 아직 게시하지 않아서입니다.

저장 방식은 두 가지 중에 고릅니다.

개인 저장
→ 각자 자기 데이터만 봄
→ 일기, 개인 기록 앱

공유 저장
→ 모두가 같은 데이터를 봄
→ 순위표, 팀 투표, 공동 목록

이 구분이 만들 수 있는 것의 폭을 크게 넓힙니다. 특히 공유 저장은 여러 사람이 같은 화면에 값을 남기는 도구를 가능하게 해요.

이제 되는 것 3: 안에서 클로드 호출하기

아티팩트 안에서 클로드를 부를 수도 있습니다. 만들 때 "여기서 클로드를 써줘"라고 요청하면 돼요.

여기서 헷갈리기 쉬운 게 요금입니다. 정리하면 이렇습니다.

API 키
→ 필요 없음

내가 테스트할 때
→ 내 플랜의 사용량에서 차감

공유한 링크로 다른 사람이 쓸 때
→ 그 사람 플랜의 사용량에서 차감
→ 나는 부담하지 않음

즉 쓰는 사람이 자기 사용량으로 씁니다. 대신 쓰는 사람도 클로드 계정이 있어야 해요. 이 한 줄이 뒤에 나올 경계선을 그립니다.

API 키를 발급받고 관리하는 과정 없이 AI 기능을 붙일 수 있다는 건 프로토타입 단계에서 꽤 큰 장점입니다.

이제 되는 것 4: MCP로 외부 서비스 연결하기

Pro·Max·Team·Enterprise 요금제에서는 아티팩트를 MCP 서버와 연결할 수도 있습니다. Slack, Google Calendar와 Asana 같은 서비스의 데이터를 읽거나 작업을 실행하는 도구를 만들 수 있어요.

다른 사람이 게시된 아티팩트를 사용할 때는 그 사람이 자기 계정으로 MCP 서버에 인증합니다. 만든 사람의 Slack 권한이나 비밀 키가 공유되는 구조는 아니에요. 그래서 각자 자기 캘린더에서 일정을 찾는 도구에는 잘 맞지만, 운영자 권한 하나로 모든 고객의 주문을 처리하는 백엔드와는 다릅니다.

그래서 무엇을 만들 수 있나요

위 기능을 조합하면 이런 것들이 됩니다.

계산기와 시뮬레이터 — 대출 상환 계산, 견적 산출, 요금제 비교. 값을 넣으면 결과가 나오는 구조라 저장도 필요 없고 링크만 공유하면 됩니다. 아티팩트에 가장 잘 맞는 형태예요.

개인 기록 도구 — 운동 일지, 독서 기록, 습관 체크. 개인 저장을 쓰면 각자 자기 기록만 봅니다. 이런 앱을 만들어 팔려던 게 아니라 그냥 내가 쓰려던 거였다면 여기서 끝내도 됩니다.

팀 내부용 집계 — 회식 메뉴 투표, 스터디 진도 체크, 사내 이벤트 순위표. 공유 저장을 쓰고 링크를 사내에 뿌리면 돼요. 팀원 모두 클로드를 쓰고 있다면 성립합니다.

분류·요약 도구 — 고객 문의를 붙여넣으면 유형을 나눠주는 화면, 회의록을 넣으면 할 일만 뽑아주는 화면. 클로드 호출 기능을 쓰는 자리입니다.

개인 업무 도구 — 내 캘린더 일정을 찾아 요약하거나 Slack에 남은 요청을 분류하는 화면. MCP 연결을 쓰며, 각 사용자가 자기 계정으로 인증합니다.

설명용 인터랙티브 자료 — 강의 자료, 개념 시뮬레이션, 제안서에 넣을 데모. 설명하려는 개념을 직접 만져보게 만드는 용도예요.

공통점이 보입니다. 쓰는 범위가 작고, 저장할 것이 텍스트 중심이며, 고객 계정과 결제를 직접 운영하지 않는 것들입니다.

여전히 안 되는 것

경계는 명확합니다.

AI 기능은 클로드 계정이 필요합니다. 기본적인 계산기와 상호작용 화면은 계정 없이 열 수 있습니다. 하지만 아티팩트 안에서 클로드를 호출하면 사용자가 로그인하고 자기 사용량을 써야 해요. 자체 회원가입과 요금제를 제공하는 고객용 AI 서비스에는 맞지 않습니다.

서버 비밀 키를 사용하는 결제·이메일 백엔드와는 다릅니다. MCP로 외부 서비스를 연결할 수 있지만 각 사용자가 자기 계정으로 인증하는 구조입니다. 운영자의 비밀 키로 결제를 승인하거나 고객 전체에게 이메일을 보내는 기능은 별도 서버에 두어야 해요.

파일과 이미지를 저장할 수 없습니다. 저장소는 텍스트 전용입니다. 사진을 올리는 기능, 서류를 보관하는 기능은 안 돼요. 파일을 어디에 둬야 하는지는 파일과 이미지는 데이터베이스에 저장하면 안 되나요에서 다뤘습니다.

아티팩트 링크를 내 도메인으로 바꿀 수 없습니다. 게시 화면에서 받은 코드를 이용해 기존 웹사이트에 아티팩트를 삽입할 수는 있습니다. 하지만 내브랜드.com 자체를 만들고 운영하려면 별도 배포가 필요해요.

게시를 취소하면 데이터가 사라집니다. 저장한 내용이 함께 영구 삭제됩니다. 사라지면 곤란한 데이터를 넣어두기에는 위험한 구조예요.

저장과 외부 연결이 가능해졌어도 고객 계정, 결제, 서버 비밀 키와 장기 보관할 운영 데이터가 필요해지는 순간에는 별도 애플리케이션이 필요합니다.

어디까지 아티팩트로 갈지 판단하는 기준

모두 왼쪽이면 아티팩트로 충분합니다. 하나라도 오른쪽이면 그 기능을 만들 때 별도 애플리케이션으로 옮길 가능성이 높아요.

아티팩트에서 확인한 뒤 프로젝트로 옮겨요

아티팩트의 진짜 쓸모는 만들기 전에 확인하는 것입니다.

이 화면 흐름이 쓸 만한가?
→ 아티팩트로 30분 만에 확인

이 계산 로직이 맞나?
→ 아티팩트에 넣고 값을 넣어봄

이 기능을 팀이 실제로 쓸까?
→ 게시해서 일주일 써보게 함

여기서 "아무도 안 쓰네"가 나오면 몇 주를 아낀 겁니다. "매일 쓰는데요"가 나오면 그때 제대로 만들 이유가 생긴 거고요.

제대로 만드는 단계는 클로드코드의 자리입니다. 내 컴퓨터에 실제 파일로 코드가 남고, 데이터베이스와 비밀값을 붙이고, 인터넷 주소에 올려 누구나 들어오게 만드는 과정이에요. 처음 클로드코드를 켰다면 자주 쓰는 슬래시 명령어부터 익히면 작업 흐름을 잡기 쉽습니다.

뚝딱의 오프라인 바이브코딩 강의에서 다루는 구간도 여기입니다. 아티팩트로 확인한 아이디어를 실제 파일 구조와 데이터베이스, 배포 주소가 있는 서비스로 옮기고, 그 과정에서 나는 오류는 강사와 함께 확인합니다.

아티팩트가 늘어난 만큼 확인할 수 있는 것도 늘었습니다. 다만 늘어난 건 확인의 범위이지 서비스의 범위가 아니에요. 그 경계를 알고 쓰면 아티팩트는 프로젝트를 시작하기 전에 가장 빨리 답을 얻는 도구가 됩니다.