본문으로 건너뛰기

© 2026 Molayo

코드팩토리요약2026. 06. 18. 13:10

클로드 라이브 아티펙트로 실시간 워크플로우 만들기!

요약

Claude의 새로운 '라이브 아티팩트(Live Artifacts)' 기능을 활용하여 외부 데이터 소스와 실시간으로 연동되는 워크플로우를 구축하는 방법을 소개합니다. MCP(Model Context Protocol)를 통해 데이터를 실시간으로 가져와 대시보드나 차트를 업데이트하는 과정을 다룹니다.

핵심 포인트

  • 라이브 아티팩트는 외부 데이터 소스와 실시간 연동 가능
  • MCP를 활용하여 API 개발 없이도 데이터 연동 구현
  • 데이터 변경 시 아티팩트 내 대시보드 및 차트 자동 업데이트
  • 프롬프트만으로 실시간 데이터 기반 소프트웨어 인터페이스 구축

Video: 클로드 라이브 아티펙트로 실시간 워크플로우 만들기!
Channel: 코드팩토리
Duration: 8m 55s
Source: subtitle (auto, ko)
Transcript:
자, 실제 데이터를 이렇게 옮기면 아티팩트에 바로 반영되고 클로드 구독제로 분석을 받을 수도 있고요. 아티팩트이기 때문에 우리가 인터랙트도 전부 다 가능해집니다. 이런 차트도 만들 수가 있고요. 자, 새로 나온 라이브 아르티팩트 기능 한번 알아보도록 할게요. 쏘as지. 자, 오늘 저희가 알아볼 내용은이 라이브 아르티팩트라는 기능인데요. 자, 원래 여기에 아티팩트라는게 있었는데 이게 이름이 라이브 아르티팩트로 바뀌었더라고요. 제가 요즘이 클로드 앱을 쓰다 보니까이 변화에 되게 민감하게 좀 반응을 하고 있는데 어, 저도 이게 뭔가 해 가지고 한번 찾아봤어요. 자, 이게 조금 아쉬운 점도 있기는 하지만 앞으로 클로드가 생각하는이 LRM 기반의 소프트웨어가 어떤 식으로 가야 될지를 어느 정도 보여 주는 거 같다고 저는 생각이 듭니다. 그리고 이게 어떤 방향으로 업그레이드가 될지 제가 조금 생각이 드는게 있는데 그것도 한번 말씀을 드리도록 할게요. 자,이 라이브 아티팩트는 뭐냐면요. 자, 예를 들어서 우리가 뭐 유튜브 컨텐츠를 어떻게 배포를 할지 정리해 놓은 로우 데이터가 있다라고 하면은 그걸 기반으로 우리가 아티팩트 만들어서 대시보드 만들어 줘라고 할 수가 있었단 말이에요.

그죠? 자, 근데 그런 아티팩트 같은 경우에는요. 한번 만들고 나면은 우리가 새로 다시 만들어야지 아티팩트가 업데이트가 되는 개념인데이 라이브 아르티팩트 같은 경우에는 이름 그대로 라이브로 데이터를 우리가 연동할 수 있도록 해 줍니다. 자, 그래서 예를 들어서 제가이 컨텐츠 브리핑 아티팩트를 만들었다고 한번 가정을 해 볼게요. 자, 그리고 오른쪽에는 제가 요즘 되게 적극적으로 유료로 쓰고 있는 클리업이라는 소프트웨어인데 여기에다가 제가 콘텐츠를 이렇게 정리를 해 놨거든요. 자, 그럼 여기서 만약에 제가 주식 AI툴 비교 있죠? 자, 이거를 우리가 여기서 보면은 주식 AI툴 비교라는이 컨텐츠가 여기에도 나와 있습니다. 지금 연동이 돼 있기 때문에. 그죠? 자, 그럼 이거를 내가 만약에 다음 프로세스로 넘긴다. 썸네일로. 자, 그러면 우리가 다시 여기를 접근을 했을 때 지금 불러오는 중이라 이렇게 나오죠. 그 이유가 실제 클릭이랑 연동이 됐으니까 그런 건데 실제 클릭에서 데이터를 가져와 가지고 여기도 라이브로 이렇게 썸네일로 변경이 되는 거를 볼 수가 있어요.

자, 그래서이 아티팩트가 지금 우리가 연결을 해 놓은이 데이터 소스랑 완전히 연동이 돼 있는 겁니다. 자, 근데 이게 흥미로운게 뭐냐면요. 어, 이거 그냥 코드로 우리가 짜 가지고 작업을 해도 되잖아 얘기를 할 수가 있는데 그런 관점이 아니라 제가 이거 어떻게 만들었냐면은 제가 이런 식으로 프롬프트를 넣었거든요. 클릭을 우리가 라이브 아르티팩트랑 연동을 시킬 건데 어 영업 파이프라인이라는 페이지가 있으니까 그거를 우리가 연동을 했으면 좋겠어라고 했습니다. 자, 근데 우리가 만약에 원래 진짜 소프트웨어를 만들어서 이걸 연동을 시키려면은 당연히 API를 통해서 우리가 뭐 데이터를 뭐 연동하고 막 확 확인하고 막 그런 식으로 해야겠죠. 그죠? 자, 근데 이건 아티팩트이기 때문에 그냥 클로드의 MCP 기능을 그대로 가져와 가지고 사용을 할 수가 있어요. 클로드 자체적으로 지금 구현이 돼 있는 거니까요. 자, 저는 당연히 그래서 클릭 MCP를 연동을 해 놨고요.이 MCP를 기반으로 데이터를 가져오도록 우리가 일단은 먼저 요청을 해 놨고 자, 그렇기 때문에 실제 우리가이 프롬프트창을 벗어나서 아티팩트로 직접 가더라도 여기서도 MCP로 그냥 데이터를 가져와서 이렇게 그림을 그려 줄 수가 있다라는 겁니다.

그리고이 커넥터로 연결이 됐었던 데이터가 라이브로 다 연동이 되고요. 그리고이 재밌는게 지금 여기에 위에 클로드가 이번 주 온보딩 현황을 분석하고 있습니다라고 나오잖아요. 그죠? 자,이 분석은 실제로 클로드한테 요청한 어, 분석이에요. 자, 원래 우리가 만약에 소프트웨어를 만들어서 배보를 했다라고 하면은 이거 무조건 API 우리가 쏴 가지고 응답을 받아야 되죠. 그죠? 자, 근데이 자체가 지금 클로드 안에 살아 있는 형태이기 때문에 그냥 클로드가 매번 이걸 생성해 가지고 우리한테 브리핑을 해 줍니다. 자, 그래서 여러분이 어떤 대시보드를 만들고 그리고 AI가 분석을 해 줘야 되는 형태의 화면을 만들고 있다라고 하면은 그냥 우리가 라이브 아티팩트 안에다가 우리가 클로드를 집어 넣어 가지고 우리 구독자 안에서 그냥 브리핑을 받아볼 수가 있다라는 거예요. 자, 그래서 이게 언제 유용할 수가 있겠느냐라고 생각을 해 보면은 어 사실 저희가 어 각종 브리핑이랑 크롤링을 하기 위해서 다양한 AR을 조금 많이 쓰고 있잖아요.

뭐 오픈 클로우도 쓰고 있고 요즘 해미스 같은 것도 이제 많이 사용을 하고 있죠. 그렇죠? 아, 근데 그런 친구들 우리가 또 다른 환경을 구축을 해야 되거나 아니면은 구독을 또 해야 되거나 그런 환경이 되게 많단 말이에요. 자, 근데 이제 사실상 우리가 브리핑을 받는 것들, 크롤링 해 가지고 분석하는 것들 이런 것들은 전부 다 라이브 아티팩트로 이렇게 생성을 해 놓고요. 뭐라면 되냐면요. 제가 스케줄로 이렇게 만들어 놨는데이 각각의 요소들을 그냥 우리이 프롬프트 자체가 특정 시간에 돌아가도록 우리가 설정을 이렇게 해 놓으면 돼요. 자, 이것도 제가 어, 지금 만들고 있는 영상 하나 있거든요. 루틴 영상 만들고 있는데 그냥 우리 컴퓨터뿐만 아니라 클라우드에서도 우리가 하루에 15번까지는 무료로 돌릴 수가 있거든요. 맥스 립션을 하면은. 그래서 여러분이 뭐 이슈를 분석한다거나 아니면은 저처럼 이렇게 컨텐츠를 관리한다거나 아니면은 뭐 구독제를 우리가 관리를 해 가지고 프로그램 트래킹한다거나 아니면 심지어 여러분의이 성과를 차트로 이렇게 만들어 가지고 평가를 받는다거나 이거 당연히 다 가능하죠.

아티팩트 사실상 HTML 기반으로 하는 거기 때문에. 자, 이런 것들이 필요하다면 여러분이 그냥 굉장한 지식 없이 원래 클로드한테 우리가 응답받던 것들을 그대로 우리가 아티팩트로 만들어서 이걸 스케줄로 그냥 매번 돌리면은 그냥이 특정 시간에 우리가 브리핑을 받아볼 수가 있게 됐다라는 거예요. 그리고 여기 라이브 아티팩트 사이드바에 가면 우리가 눌러 가지고 이렇게 이동을 할 수도 있고요. 자, 물론 여기에서 이제 조금 아쉬운 건 뭐냐면요. 지금 여기서 보이는 것처럼 약간 데이터가 많게 되면은 속도가 조금 느리기는 합니다. 어, 이거는 제가 봤을 때 서비스 형태로 우리가 제공하기에는 조금 어려울 거 같고 우리가 개인적으로 하루에 뭐 몇 번씩 크롤링해서 응답을 받고 브리핑을 받는 형태로가 가장 유용한 형태가 될 거 같아요. 저 같은 경우도 개인적으로 가장 많이 쓰게 될 형태는 유튜브 컨텐츠 파이프라인을 분석하고 확인하는데 제가 많이 쓸 것 같고요. 그리고 계약 관련도 어, 쓸 거 같은 생각이 많이 듭니다.

자, 그리고 좀 굉장히 아쉬운 점이 또 하나 있는데 뭐냐면요. 우리가 자, 이렇게로 데이터를 변경을 하고 나면요. 그 변경된 사항을 반영을 받기 위해서 우리가 무조건 새로 고침을 해야 된다는 거예요. 그래서 웹수켓으로 뭐 연결이 돼 있다거나 아니면은 특정 부분만 업데이트 되도록 돼 있지는 않고요. 그냥 완전크로 데이터를 가져오는 형태로 구현이 돼 있기 때문에 조금 로딩이 느리긴 하다. 그래서 여러분이 굉장히 역동적인 거에 쓰기는 조금 어렵지만 우리가 그냥 이렇게 브리핑 받든 형태로는 여러분이 지금 쓰고 있는 다른 툴들을 클로드 सब 서스크립션 안에서 해결할 수 있다라는게 가장 큰 강점이 될 거 같습니다. 자, 그리고 이걸 보면서 이제 제가 생각이든게 뭐냐면요. 우리가 소프트웨어를 사실 굉장히 복잡하게 만들어서 우리가 배포를 하고 있잖아요. 그죠? 자, 근데 생각을 해 보면은 클로드에서 이제 이거를 실제 배포를 할 수 있도록 해 주면은 그러면 이제 뭐 당연히 우리가 뭐 토큰 내에서든 아니면은 실제 비용에서든 어떻게든 이제 인프라 비용을 우리가 내기는 해야 되겠죠.

근데 이거를 최적화하고 실제 우리 소프트웨어가 돌아가는 형태처럼 그리고 이거를 실제로 배포할 수 있도록 해 주게 한다라고 하면은 굉장히 다른 형태로 우리가 어 세스를 접근하는 방식이 되지 않을까라는 생각이 들어요. 자 쉽게 말해서 지금 현대에 우리가 소프트웨어를 만들고 있는 방식은 사실 AI가 없던 시절에 최적화 돼 있거든요. 우리가 한 땀 한 땀 코드를 작성하고 함수를 정의하고 그거를 실행하고 그 과정이 들어가 있는 건데 그렇게 만들어진 이유가 우리는 1일0을 할 수가 없잖아요. 그죠? 컴퓨터는 101으로 뭐 스위치 켜고 꺼고 하면서 이걸 조합을 해 가지고 결과물을 만들어 내지만 우리는 그렇게 할 수가 없단 말이에요. 그죠? 자, 그래서 그거를 쉽게 하기 위해서 우리가 프로그래밍 언어라는 걸 만들었고 그걸 기반으로 우리가 소프트웨어들을 제작을 했었던 건데. 자, 근데 사실 LM의 관점에서는 우리한테 최적화된이 프로그래밍 언어를 타고 그걸 기반으로 소프트웨어를 만들어 간다는게 어떻게 보면 비효율적일 수도 있거든요.

만약에 엔트로픽에서 어 우리가 일반적으로 알고 있는 언어가 아니라이 LRM이 파악할 수 있는 프레임워크를 만들어서 그거를 라이브 아르티팩트에다가 뭐 입힌 다음에 그걸 만약에 배포를 할 수 있도록 만들면은 우리가 훨씬 더 역동적인 소프트웨어를 만들 수 있지 않을까라는 생각이 듭니다. 특히나 요즘 미서스가 굉장히 논란이잖아요. 그죠? 음. 미터스 때문에 금융 회사들이 이거 어떻게 대처를 해야 될지 굉장히 고민이 많다고 얘기를 하는데 사실 미토스의 출연으로 인해서 많은 사람들이 이제 주장을 하는 기존의 소프트웨어를 만드는 방식은 이제 투시하는 순간부터 코드는 디플리케이트 되고티가 생긴다. 이런 개념을 어떻게 보면은 가장 직접적으로 타게팅할 수 있는 방향이지 않을까라는 생각도 좀 듭니다. 자, 그래서 오늘 라이브 아티팩트에 대해서 한번 이야기를 해 봤고요. 여러분도 한 번쯤 써 보면 좋을 것 같아요. 여러분이 평상시에 업데이트를 봤던 요소들을 라이브 이펙트로 가져와서 스케줄에다 돌리고 계속 업데이트를 시켜서 분석을 하도록 한 다음에 나한테 피드백을 받으면은 내가 개인적으로 쓴다는 가정 하에는 어디에서든 볼 수 있으니까 뭐 모바일에서도 볼 수 있고 우리 컴퓨터에서도 볼 수 있고 뭐 아이패드에서 볼 수 있으니까 적극적으로 한번 생각을 해 보시면 좋을 거 같고요.

어 저는 진짜 기대됩니다. 이게 배프까지 이어지는 상황까지 만들어졌으면 좋겠어요. 그러면은 특히나 인터널 툴이라든가 작업 표요율를 높이는 방식으로는 굉장히 효율적으로 사용되지 않을까라는 생각이 듭니다. 자, 오늘 제가 준비한 영상 여기까지고요. 오늘 영상이 좋았다면 구독과 좋아요, 알림 설정 그리고 댓글에 어, 하이보이까지 꼭 해 주시면 제가 다음에 더 좋은 영상으로 찾아해보도록 하겠습니다. 쏘as지.

AI 자동 생성 콘텐츠

본 콘텐츠는 코드팩토리의 원문을 AI가 자동으로 요약·번역·분석한 것입니다. 원 저작권은 원저작자에게 있으며, 정확한 내용은 반드시 원문을 확인해 주세요.

원문 바로가기
0

댓글

0