<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:media="http://search.yahoo.com/mrss/"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>program &#8211; 투데이즈.kr</title>
	<atom:link href="https://2days.kr/category/it/program/feed/" rel="self" type="application/rss+xml" />
	<link>https://2days.kr</link>
	<description>투데이즈</description>
	<lastBuildDate>Fri, 23 Oct 2026 23:04:59 +0000</lastBuildDate>
	<language>ko-KR</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.8</generator>

<image>
	<url>https://2days.kr/wp-content/uploads/2025/10/cropped-simbol-1-32x32.png</url>
	<title>program &#8211; 투데이즈.kr</title>
	<link>https://2days.kr</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>HyperFrames 사용법 클로드 코드로 꽃집 홍보 영상 제작</title>
		<link>https://2days.kr/24/10/08/109250/it/program/</link>
		
		<dc:creator><![CDATA[Lisa]]></dc:creator>
		<pubDate>Fri, 23 Oct 2026 23:04:59 +0000</pubDate>
				<category><![CDATA[program]]></category>
		<guid isPermaLink="false">https://2days.kr/24/10/08/109250/%eb%af%b8-%eb%b6%84%eb%a5%98/</guid>

					<description><![CDATA[꽃집 홍보 영상을 만들어야 하는데 촬영과 편집까지 생각하면 시작하기도 부담스럽죠. HyperFrames 사용법의 핵심은 복잡한 영상 편집 화면을 먼저 배우는 대신, 만들고 싶은 장면을 말로 설명하고 AI 코딩 도구가 영상 프로젝트를 구성하게 하는 것입니다. 다만 문장 한 줄만 적으면 언제나 광고 영상이 완벽하게 완성되는 방식은 아니에요. 설치부터 시안 확인, MP4 출력까지 실제 작업 순서를 알아두면 훨씬 [&#8230;]]]></description>
										<content:encoded><![CDATA[<p>꽃집 홍보 영상을 만들어야 하는데 촬영과 편집까지 생각하면 시작하기도 부담스럽죠. HyperFrames 사용법의 핵심은 복잡한 영상 편집 화면을 먼저 배우는 대신, 만들고 싶은 장면을 말로 설명하고 AI 코딩 도구가 영상 프로젝트를 구성하게 하는 것입니다. 다만 문장 한 줄만 적으면 언제나 광고 영상이 완벽하게 완성되는 방식은 아니에요. 설치부터 시안 확인, MP4 출력까지 실제 작업 순서를 알아두면 훨씬 덜 헤맵니다.</p>
<p>아래에서는 Claude Code로 처음 시작하는 흐름과 꽃집 홍보 영상을 예로 든 프롬프트, 영상 제작 도구들의 차이까지 함께 짚어보겠습니다.</p>
<figure style="text-align:center;margin:0 auto 28px;"><img decoding="async" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" fifu-lazy="1" fifu-data-sizes="auto" fifu-data-srcset="https://i0.wp.com/pub-e310bf4303744c7295d9b556111ff394.r2.dev/inline/1792792148857_6mwno2.png?ssl=1&w=75&resize=75&ssl=1 75w, https://i0.wp.com/pub-e310bf4303744c7295d9b556111ff394.r2.dev/inline/1792792148857_6mwno2.png?ssl=1&w=100&resize=100&ssl=1 100w, https://i0.wp.com/pub-e310bf4303744c7295d9b556111ff394.r2.dev/inline/1792792148857_6mwno2.png?ssl=1&w=150&resize=150&ssl=1 150w, https://i0.wp.com/pub-e310bf4303744c7295d9b556111ff394.r2.dev/inline/1792792148857_6mwno2.png?ssl=1&w=240&resize=240&ssl=1 240w, https://i0.wp.com/pub-e310bf4303744c7295d9b556111ff394.r2.dev/inline/1792792148857_6mwno2.png?ssl=1&w=320&resize=320&ssl=1 320w, https://i0.wp.com/pub-e310bf4303744c7295d9b556111ff394.r2.dev/inline/1792792148857_6mwno2.png?ssl=1&w=500&resize=500&ssl=1 500w, https://i0.wp.com/pub-e310bf4303744c7295d9b556111ff394.r2.dev/inline/1792792148857_6mwno2.png?ssl=1&w=640&resize=640&ssl=1 640w, https://i0.wp.com/pub-e310bf4303744c7295d9b556111ff394.r2.dev/inline/1792792148857_6mwno2.png?ssl=1&w=800&resize=800&ssl=1 800w, https://i0.wp.com/pub-e310bf4303744c7295d9b556111ff394.r2.dev/inline/1792792148857_6mwno2.png?ssl=1&w=1024&resize=1024&ssl=1 1024w, https://i0.wp.com/pub-e310bf4303744c7295d9b556111ff394.r2.dev/inline/1792792148857_6mwno2.png?ssl=1&w=1280&resize=1280&ssl=1 1280w, https://i0.wp.com/pub-e310bf4303744c7295d9b556111ff394.r2.dev/inline/1792792148857_6mwno2.png?ssl=1&w=1600&resize=1600&ssl=1 1600w" fifu-data-src="https://i0.wp.com/pub-e310bf4303744c7295d9b556111ff394.r2.dev/inline/1792792148857_6mwno2.png?ssl=1" alt="HyperFrames 사용법 클로드 코드로 꽃집 홍보 영상 제작" title="HyperFrames 사용법 클로드 코드로 꽃집 홍보 영상 제작" style="width:100%;max-width:100%;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,0.15);" loading="lazy"/></figure><div class='code-block code-block-2' style='margin: 8px auto; text-align: center; display: block; clear: both;'>
<!-- 중간 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8940400388075870"
     data-ad-slot="8794586137"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script></div>

<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">HyperFrames는 어떤 AI 영상 제작 도구일까</h2>
<p>HyperFrames는 HTML, CSS, 자바스크립트와 이미지·오디오 등의 미디어를 이용해 동영상으로 렌더링하는 오픈소스 프레임워크입니다. AI 코딩 에이전트에 영상을 요청하면 에이전트가 편집 가능한 프로젝트를 만들고, HyperFrames가 화면을 미리 보여주거나 MP4로 출력하는 구조죠. 일상적인 장면을 카메라로 새로 찍는 생성형 동영상 모델과는 작동 방식이 다릅니다.</p>
<p>이 방식이 매력적인 이유는 결과가 하나의 영상 파일로만 남지 않는다는 점입니다. 문구 색상이나 등장 순서, 움직임을 수정하고 다시 출력할 수 있는 프로젝트 파일이 남거든요. 특히 행사 소개, 제품 특징, 가격표가 움직이는 모션 그래픽처럼 글자와 화면 구성을 정확하게 다뤄야 할 때 눈여겨볼 만합니다.</p>
<p>다만 꽃이나 매장 내부를 실물처럼 보여주려면 사용할 사진이나 영상 소스가 필요할 수 있습니다. AI에게 없는 매장 사진을 상상으로 만들어 달라고 하면 실제 매장과 다른 결과가 나올 수 있으니, 저는 매장 홍보라면 사진 자료부터 준비하는 편을 권하겠습니다. <a href="https://hyperframes.heygen.com/introduction" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">HyperFrames 공식 소개</a>에서도 편집 가능한 프로젝트와 프레임별 렌더링 구조를 설명하고 있습니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">Claude Code 설치 전에 준비할 프로그램과 비용</h2>
<p>Claude Code와 함께 로컬에서 영상을 만들 계획이라면 먼저 Node.js 22 이상, npm, FFmpeg를 준비해야 합니다. 공식 플러그인 안내에서는 이 환경을 로컬 CLI의 준비 사항으로 명시합니다. FFmpeg는 완성한 화면을 영상으로 인코딩하는 과정에서 사용되므로, 설치가 빠져 있으면 마지막 출력 단계에서 막힐 수 있어요.</p>
<p>HyperFrames 자체는 Apache-2.0 라이선스의 무료 오픈소스이고 로컬 렌더링에는 HeyGen 크레딧이 소모되지 않습니다. 그렇다고 제작에 드는 모든 비용이 사라지는 건 아닙니다. Claude Code 같은 코딩 에이전트나 별도로 연결한 음성·아바타·이미지 생성 서비스는 사용 조건과 요금이 다르기 때문이죠. 무료라는 말만 보고 시작했다가 다른 서비스 요금에서 당황하지 않도록 구분해 두는 게 좋겠습니다.</p>
<p>제일 먼저 확인할 것은 멋진 템플릿보다 컴퓨터 환경입니다. 터미널에서 <code>node -v</code>와 <code>ffmpeg -version</code>으로 설치 여부를 살피고, 필요한 프로그램을 설정한 뒤 다음 단계로 넘어가세요. <a href="https://hyperframes.heygen.com/guides/plugins" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">공식 플러그인 설치 안내</a>에 운영 환경과 에이전트별 설치 경로가 자세히 나옵니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">Claude Code에 HyperFrames 플러그인 설치하는 순서</h2>
<p>HyperFrames 사용법이 처음이라면 Claude Code 공식 저장소에서 권장하는 버전 관리형 플러그인 방식부터 시작하면 됩니다. 터미널에서 다음 순서로 진행합니다. 플러그인이 설치됐더라도 현재 열린 세션에는 바로 보이지 않을 수 있으므로 다시 불러오거나 새 세션을 열어 주세요.</p>
<ol>
<li>
<p>Claude Code가 실행되는 환경에서 <code>claude plugin marketplace add heygen-com/hyperframes</code>를 입력합니다.</p>
</li>
<li>
<p>이어 <code>claude plugin install hyperframes@hyperframes</code>를 실행합니다.</p>
</li>
<li>
<p><code>claude plugin details hyperframes</code>로 설치된 플러그인 정보를 살핍니다.</p>
</li>
<li>
<p>Claude Code에서 <code>/hyperframes:hyperframes</code>를 이용해 영상 제작을 요청합니다.</p>
</li>
</ol>
<p>플러그인 대신 스킬만 설치하려면 작업 폴더에서 <code>npx skills add heygen-com/hyperframes</code>를 실행해 Core Skills를 선택하는 방식도 있습니다. 플러그인과 독립 스킬을 반드시 둘 다 설치해야 하는 것은 아니에요. 설정이 복잡하게 느껴진다면 한 방식으로 먼저 짧은 테스트 영상을 만드는 쪽이 낫습니다.</p>
<p></p>
<p>첨부 화면에는 hyperframes 외에도 remotion-skills, motion-graphics, manim-mcp, mcp-for-blender라는 항목이 함께 보입니다. 여기서 조심할 점 하나. 영상에서 나란히 소개됐다고 해서 이 다섯 개가 HyperFrames 설치에 필요한 공식 필수 구성요소인 것은 아닙니다. 기본 영상 하나를 만드는 데 모든 도구를 설치할 필요는 없어요.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">꽃집 홍보 영상 프롬프트는 이렇게 작성하기</h2>
<p>예를 들어 봄맞이 꽃다발을 알리는 15초짜리 세로 영상을 만든다고 가정해 보겠습니다. 막연히 &#8216;꽃집 홍보 영상 만들어줘&#8217;라고 하면 어떤 꽃을 보여줄지, 누구에게 말을 거는지, 화면이 어떻게 끝날지 AI가 추측해야 합니다. 저는 처음부터 길이와 화면 비율, 장면 순서, 브랜드 문구를 함께 알려주는 쪽이 좋다고 봅니다.</p>
<p><strong>요청 예시:</strong> &#8216;HyperFrames로 15초 길이의 세로형 꽃집 홍보 영상을 만들어줘. 첫 장면은 따뜻한 자연광의 꽃다발 사진, 다음 장면은 꽃을 포장하는 손, 마지막에는 매장 이름과 예약 문의 문구가 등장하게 해줘. 밝고 차분한 분위기, 읽기 쉬운 큰 자막, 부드러운 전환을 사용해줘. 실제 매장 사진은 내가 제공할 파일만 사용하고, 먼저 미리보기를 보여줘.&#8217;</p>
<p>이 요청에는 전달할 메시지와 장면 구조가 함께 들어 있습니다. 자막은 화면을 넘길 정도로 길지 않게 하고, 상호·주소·가격 등 실제 운영 정보는 제공한 자료에서만 가져오게 부탁하는 것이 좋아요. 특히 AI가 알아서 할인율이나 영업시간을 만들어 넣지 않도록 제한해 두면 수정할 일이 줄어듭니다.</p>
<p>스토리는 세 장면만으로도 충분합니다. 처음에는 꽃의 분위기를 보여주고, 중간에는 정성껏 포장하는 과정으로 관심을 붙잡고, 마지막에는 예약 행동을 안내하는 식입니다. 화면 전환을 무조건 화려하게 만들기보다 모바일에서 읽히는 문구를 우선한다는 게 제 판단입니다.</p>
<p></p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">미리보기부터 MP4 저장까지 실수 줄이는 과정</h2>
<p>AI가 첫 영상을 만들었다면 곧바로 올리기보다 우선 미리보기를 처음부터 끝까지 보는 것을 추천합니다. 공식 빠른 시작 안내에서는 에이전트가 편집 가능한 작업 폴더를 남기고 미리보기를 열어주며, 필요하면 프로젝트 폴더 안에서 <code>npx hyperframes preview</code>를 실행할 수 있다고 설명합니다. 첫 결과는 완성본이라기보다 수정 가능한 시안으로 보는 편이 맞습니다.</p>
<p>내보내기 직전에는 <code>npx hyperframes lint</code>와 <code>npx hyperframes check</code>로 프로젝트 검사를 진행할 수 있습니다. 그다음 터미널에서 <code>npx hyperframes render --output renders/final.mp4</code>를 실행하면 MP4 출력 경로를 지정할 수 있어요. Studio를 쓴다면 내보내기 화면에서 형식과 크기를 선택하는 방식도 지원합니다.</p>
<p>중요한 건 미리보기가 잘 보인다고 해서 내보낸 영상까지 완벽하다고 생각하지 않는 것입니다. 완성 MP4를 다시 열어 첫 화면, 끝 화면, 자막이 잘리는 부분, 음량과 전환 타이밍을 점검하세요. 공식 문서도 미리보기와 출력 파일을 각각 확인하도록 권합니다. <a href="https://hyperframes.heygen.com/guides/export-and-share" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">공식 MP4 출력 안내</a>에서 렌더링 명령과 최종 확인 항목을 볼 수 있습니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">사진 속 영상 제작 도구 5종 차이와 선택 기준</h2>
<p>한 화면에 도구가 다섯 개나 있으면 전부 설치해야 영상을 만들 수 있다고 느끼기 쉽습니다. 하지만 이름을 보면 다루는 작업의 무게중심이 다릅니다. 로고 애니메이션과 제품 홍보 화면을 만들고 싶은지, 수학 개념을 설명할지, 3차원 장면이 필요한지를 먼저 구분하는 편이 훨씬 실용적이에요.</p>
<div style="overflow-x:auto;">
<table style="width:100%;border-collapse:collapse;margin:18px 0;font-size:15px;">
<thead style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">
<tr>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">영상 도구</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">주로 적합한 작업</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">초보자의 판단</th>
</tr>
</thead>
<tbody>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">HyperFrames</td>
<td style="border:1px solid #d0d7de;padding:10px;">HTML 기반 홍보 영상, 자막, 모션 그래픽과 MP4 렌더링</td>
<td style="border:1px solid #d0d7de;padding:10px;">꽃집 홍보 영상부터 시작</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">remotion-skills</td>
<td style="border:1px solid #d0d7de;padding:10px;">React와 Remotion을 이용한 코드 기반 영상 제작</td>
<td style="border:1px solid #d0d7de;padding:10px;">React 작업이 익숙할 때 검토</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">motion-graphics</td>
<td style="border:1px solid #d0d7de;padding:10px;">타이틀, 도형 애니메이션, 화면 전환 등</td>
<td style="border:1px solid #d0d7de;padding:10px;">그래픽 효과가 중심일 때 검토</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">manim-mcp</td>
<td style="border:1px solid #d0d7de;padding:10px;">수식, 그래프, 교육용 애니메이션 계열 작업</td>
<td style="border:1px solid #d0d7de;padding:10px;">설명형 강의 영상에서 검토</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">mcp-for-blender</td>
<td style="border:1px solid #d0d7de;padding:10px;">Blender와 연결하는 3차원 모델·장면 작업</td>
<td style="border:1px solid #d0d7de;padding:10px;">3D 작업에 익숙할 때 검토</td>
</tr>
</tbody>
</table>
</div>
<p>이 표는 영상에 등장한 도구 이름과 일반적인 활용 분야를 구분한 비교입니다. 각 항목의 정확한 배포자와 설치 명령은 해당 프로젝트에서 따로 확인해야 해요. 특히 화면에 나온 이름만으로 동일 개발사가 만든 공식 묶음이라고 판단하는 것은 피하는 편이 좋습니다.</p>
<p>꽃집이나 카페의 짧은 공지 영상을 처음 제작한다면 저는 HyperFrames 하나로 먼저 끝까지 출력해 보겠습니다. 영상이 완성되는 전체 흐름을 경험한 뒤 필요한 그래픽이나 3D 도구를 더하는 편이 시간도 덜 들고 문제 원인도 쉽게 찾을 수 있거든요.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">자주 묻는 질문</h2>
<p><b>Q. HyperFrames는 완전히 무료인가요?</b></p>
<p>오픈소스 프레임워크와 로컬 렌더링은 무료로 사용할 수 있습니다. 다만 Claude Code 및 연동하는 외부 생성형 서비스의 비용은 별도입니다.</p>
<p><b>Q. 코딩을 전혀 몰라도 사용 가능한가요?</b></p>
<p>AI 코딩 에이전트가 코드를 만드는 경로를 지원하므로 직접 HTML을 작성하지 않고 시작할 수 있습니다. 그래도 프로그램 설치나 실행 오류를 해결할 때 기본적인 터미널 사용은 도움이 됩니다.</p>
<p><b>Q. 설치한 뒤 FFmpeg 오류가 나타나면 어떻게 하나요?</b></p>
<p><code>npx hyperframes doctor</code>로 환경을 점검하고, FFmpeg 설치 여부와 경로를 살펴보세요. <a href="https://hyperframes.heygen.com/guides/troubleshooting" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">공식 오류 해결 페이지</a>에서 운영체제별 설치 안내를 제공합니다.</p>
<p><b>Q. 제가 찍은 꽃집 사진으로 영상을 만들 수 있나요?</b></p>
<p>프로젝트의 미디어 자료로 사진과 영상을 활용할 수 있습니다. 홍보용이라면 실제 매장 사진과 정확한 상호 정보, 연락처를 제공하는 편이 좋겠어요.</p>
<p>결국 HyperFrames 사용법을 익히는 데는 처음부터 다섯 도구를 모으는 것보다 짧은 영상 하나를 제대로 완성하는 경험이 더 값집니다. 꽃다발 사진 몇 장, 정확한 문구, 15초 분량의 장면 순서만 정해도 첫 프로젝트의 방향은 충분히 구체적이니까요.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">출처와 참고한 곳</h2>
<ul>
<li><a href="https://hyperframes.heygen.com/quickstart" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">HyperFrames 공식 빠른 시작</a> — 설치, 첫 요청, 미리보기 흐름</li>
<li><a href="https://hyperframes.heygen.com/guides/plugins" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">HyperFrames 플러그인 공식 문서</a> — Claude Code 설치 명령과 준비 환경</li>
<li><a href="https://hyperframes.heygen.com/guides/export-and-share" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">HyperFrames 출력 안내</a> — 검사 명령과 MP4 렌더링</li>
<li><a href="https://github.com/heygen-com/hyperframes" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">HyperFrames GitHub 저장소</a> — 프로젝트 개요, 오픈소스 라이선스와 스킬 배포</li>
</ul>
<style>@keyframes loovShine{0%{background-position:200% 0}100%{background-position:-200% 0}}@keyframes loovGlow{0%,100%{box-shadow:0 2px 8px rgba(26,115,232,.35)}50%{box-shadow:0 2px 16px rgba(109,179,255,.9)}}a.loov-link{animation:loovShine 2.8s linear infinite,loovGlow 2s ease-in-out infinite}a.loov-link:hover{filter:brightness(1.1);transform:translateY(-1px)}@media(prefers-reduced-motion:reduce){a.loov-link{animation:none}}</style>
<h2>함께 읽으면 좋은 글</h2>
<ul>
<li><a href="https://2days.kr/22/10/15/109080/it/program/">FreeLLMAPI 무료 설치와 클로드 코드 연동, 보안 주의점</a></li>
<li><a href="https://2days.kr/22/10/07/109016/it/program/">PHP 보안 취약점 비상, AI 발견 PHP2Shell 워드프레스 서버 패치</a></li>
<li><a href="https://2days.kr/20/10/08/108756/it/program/">Inspo MCP 무료 설치와 코딩 에이전트 디자인 레퍼런스 설정</a></li>
</ul>
<!-- CONTENT END 2 -->
]]></content:encoded>
					
		
		
		<media:content url="https://i0.wp.com/pub-e310bf4303744c7295d9b556111ff394.r2.dev/inline/1792792148857_6mwno2.png?ssl=1" medium="image"></media:content>
            	</item>
		<item>
		<title>FreeLLMAPI 무료 설치와 클로드 코드 연동, 보안 주의점</title>
		<link>https://2days.kr/22/10/15/109080/it/program/</link>
		
		<dc:creator><![CDATA[Lisa]]></dc:creator>
		<pubDate>Thu, 22 Oct 2026 06:55:58 +0000</pubDate>
				<category><![CDATA[program]]></category>
		<guid isPermaLink="false">https://2days.kr/22/10/15/109080/%eb%af%b8-%eb%b6%84%eb%a5%98/</guid>

					<description><![CDATA[클로드 코드로 작업하다 사용량 제한에 막히면 흐름이 뚝 끊깁니다. FreeLLMAPI는 여러 AI 회사의 무료 API 할당량을 한곳에서 연결하고, 제한에 걸렸을 때 다른 모델로 요청을 돌리도록 만든 오픈소스 도구입니다. 라우터 자체는 무료지만 각 회사에서 발급받는 키와 이용 약관은 따로 챙겨야 해요. 설치보다 먼저 이 차이를 알아야 예상하지 못한 비용이나 정보 유출을 줄일 수 있습니다. FreeLLMAPI는 정말 [&#8230;]]]></description>
										<content:encoded><![CDATA[<p>클로드 코드로 작업하다 사용량 제한에 막히면 흐름이 뚝 끊깁니다. FreeLLMAPI는 여러 AI 회사의 무료 API 할당량을 한곳에서 연결하고, 제한에 걸렸을 때 다른 모델로 요청을 돌리도록 만든 오픈소스 도구입니다. 라우터 자체는 무료지만 각 회사에서 발급받는 키와 이용 약관은 따로 챙겨야 해요. 설치보다 먼저 이 차이를 알아야 예상하지 못한 비용이나 정보 유출을 줄일 수 있습니다.</p>
<figure style="text-align:center;margin:0 auto 28px;"><img decoding="async" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" fifu-lazy="1" fifu-data-sizes="auto" fifu-data-srcset="https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/freellmapi-1.png?ssl=1&w=75&resize=75&ssl=1 75w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/freellmapi-1.png?ssl=1&w=100&resize=100&ssl=1 100w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/freellmapi-1.png?ssl=1&w=150&resize=150&ssl=1 150w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/freellmapi-1.png?ssl=1&w=240&resize=240&ssl=1 240w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/freellmapi-1.png?ssl=1&w=320&resize=320&ssl=1 320w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/freellmapi-1.png?ssl=1&w=500&resize=500&ssl=1 500w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/freellmapi-1.png?ssl=1&w=640&resize=640&ssl=1 640w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/freellmapi-1.png?ssl=1&w=800&resize=800&ssl=1 800w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/freellmapi-1.png?ssl=1&w=1024&resize=1024&ssl=1 1024w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/freellmapi-1.png?ssl=1&w=1280&resize=1280&ssl=1 1280w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/freellmapi-1.png?ssl=1&w=1600&resize=1600&ssl=1 1600w" fifu-data-src="https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/freellmapi-1.png?ssl=1" alt="FreeLLMAPI 무료 설치와 클로드 코드 연동, 보안 주의점" title="FreeLLMAPI 무료 설치와 클로드 코드 연동, 보안 주의점" style="width:100%;max-width:100%;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,0.15);" loading="lazy"/></figure><div class='code-block code-block-2' style='margin: 8px auto; text-align: center; display: block; clear: both;'>
<!-- 중간 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8940400388075870"
     data-ad-slot="8794586137"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script></div>

<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">FreeLLMAPI는 정말 무료일까? 비용 구조부터 살펴보기</h2>

<p>이 도구가 해 주는 일은 무료 AI를 새로 만들어 주는 게 아니라 이미 제공되는 무료 사용량을 묶어 주는 것입니다. 구글이나 그록, 미스트랄, 오픈라우터 같은 제공업체에서 각자 API 키를 받아 등록하면 로컬 라우터가 요청을 분배합니다. 어느 업체의 한도가 끝나면 설정된 다른 모델로 넘어가는 방식이죠.</p>
<p>2026년 10월 공식 GitHub에는 다양한 모델 계열과 엔드포인트가 소개돼 있습니다. 다만 저장소 소개 숫자와 <a href="https://freellmapi.co/models" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">실시간 모델 목록</a>의 집계는 서로 다르게 표시되기도 합니다. 목록에 이름이 있다는 사실과 내 계정의 키로 지금 쓸 수 있다는 사실은 별개입니다. 저는 화려한 모델 개수보다 실제로 연결한 무료 키가 정상 작동하는지를 먼저 보겠습니다.</p>
<p>공식 <a href="https://freellmapi.co/ko/pricing" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">한국어 요금제</a>에는 무료판 0달러, 프리미엄 연 19달러 또는 일회성 49달러가 안내돼 있습니다. 프리미엄은 새 무료 모델과 할당량 변경을 더 빨리 받는 모델 목록 서비스예요. 무료판은 카탈로그 갱신이 약 30일 늦을 수 있지만 핵심 라우팅과 장애 전환 기능은 계속 제공됩니다.</p>
<div style="overflow-x:auto;">
<table style="width:100%;border-collapse:collapse;margin:18px 0;font-size:15px;">
<thead style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">
<tr>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">구분</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">무료 설치판</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">프리미엄</th>
</tr>
</thead>
<tbody>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">라우터 사용료</td>
<td style="border:1px solid #d0d7de;padding:10px;">0달러</td>
<td style="border:1px solid #d0d7de;padding:10px;">라우터 자체는 무료</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">모델 목록 반영</td>
<td style="border:1px solid #d0d7de;padding:10px;">약 30일 지연</td>
<td style="border:1px solid #d0d7de;padding:10px;">배포 당일 반영</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">자동 대체 모델 선택</td>
<td style="border:1px solid #d0d7de;padding:10px;">지원</td>
<td style="border:1px solid #d0d7de;padding:10px;">지원</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">추가로 필요한 것</td>
<td style="border:1px solid #d0d7de;padding:10px;">업체별 무료 API 키와 약관 동의</td>
<td style="border:1px solid #d0d7de;padding:10px;">업체별 키와 프리미엄 결제</td>
</tr>
</tbody>
</table>
</div>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">윈도우와 맥에서 무료 라우터 설치하는 순서</h2>
<p>처음 만지는 분이라면 명령어보다 데스크톱 설치 파일이 편합니다. <a href="https://github.com/tashfeenahmed/freellmapi/releases/latest" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">개발자 GitHub 최신 배포 페이지</a>로 가서 윈도우는 설치용 실행 파일, 맥은 자신의 칩에 맞는 디스크 이미지 파일을 고르면 돼요. 맥은 애플 실리콘용과 인텔용이 나뉘며 공식 문서에는 macOS 12 이상이 안내됩니다.</p>
<ol>
<li>GitHub 저장소의 Releases에서 내 운영체제용 파일을 내려받습니다.</li>
<li>설치 후 작업 표시줄이나 메뉴 막대의 FreeLLMAPI 아이콘에서 대시보드를 엽니다.</li>
<li>Keys 화면에서 사용할 제공업체를 정하고, 해당 업체에서 직접 발급받은 무료 API 키를 등록합니다.</li>
<li>키 상태를 검사하고 모델 선택 또는 대체 순서를 설정합니다.</li>
<li>작은 테스트 요청으로 실제 응답과 사용량을 확인합니다.</li>
</ol>
<p>프로그램을 켰다고 무료 모델이 전부 즉시 작동하는 건 아닙니다. 제공업체 계정 생성이 필요할 수 있고, 일부 서비스에는 카드 등록이나 별도 사용 조건이 있을 수 있어요. 특히 카드가 연결된 계정이라면 무료 한도 이후의 과금 설정을 그 제공업체 화면에서 살펴보는 편이 안전하겠습니다.</p>
<p></p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">도커로 설치할 때 기억할 로컬 주소와 설정</h2>
<p>개발자라면 Docker를 통한 셀프 호스팅도 가능합니다. 공식 <a href="https://github.com/tashfeenahmed/freellmapi/blob/main/docs/en/install/01-install.md" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">설치 문서</a>는 Docker 설치 후 <code>curl -fsSL https://freellmapi.co/install.sh | bash</code>로 설치하고, 웹 브라우저에서 <code>http://localhost:3001</code>을 여는 흐름을 소개합니다. 인터넷에서 받은 스크립트를 바로 실행하기 전에 내용을 직접 읽어 보는 습관이 좋겠죠.</p>
<p>Docker 설치판에는 처음 접속할 때 대시보드 계정을 만드는 단계가 있고, 데스크톱판은 로컬 자동 로그인 방식입니다. 제공업체 키를 추가했다면 화면 상단에서 통합 API 키를 복사할 수 있습니다. 일반적인 OpenAI 호환 클라이언트의 기본 주소는 <code>http://localhost:3001/v1</code>입니다. 데스크톱 앱에서 사용하는 실제 포트는 앱 설정에 따라 다를 수 있어 해당 화면에 표시된 주소를 쓰면 됩니다.</p>
<p>저는 처음부터 외부 접속을 열지 않겠습니다. 공식 보안 정책도 기본값인 로컬호스트 바인딩을 권하고, 모든 네트워크 인터페이스로 여는 설정은 위험성을 경고합니다. 회사 네트워크나 공개 서버에 올릴 계획이라면 접근 제어와 암호화 연결이 필요한 별도 운영 작업으로 보는 편이 맞습니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">클로드 코드와 코덱스 연결 뒤 모델이 바뀌는 방식</h2>
<p>로컬 라우터를 설치한 뒤에는 기존 코딩 도구를 이 라우터로 연결해야 합니다. 프로젝트에는 클로드 코드용 <code>npx freellmapi setup-claude --url http://localhost:3001</code>, 코덱스용 <code>npx freellmapi setup-codex --url http://localhost:3001</code> 같은 설정 명령이 안내돼 있어요. 실제 통합 키 입력이나 설정 파일 수정은 버전마다 달라질 수 있으니 <a href="https://github.com/tashfeenahmed/freellmapi/blob/main/docs/en/clients/01-agent-clients.md" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">공식 클라이언트 연결 문서</a>의 현재 절차를 따르는 게 낫습니다.</p>
<p>라우터의 자동 전환은 대체로 API 요청 제한이나 제공업체 오류가 생겼을 때 다른 사용 가능한 모델을 찾아 재시도하는 기능입니다. 30분 동안 같은 모델에 대화를 붙여 두는 세션 기능도 소개되어 있습니다. 다만 모델이 바뀌면 문맥 처리 방식이나 도구 호출 지원 여부가 달라질 수 있으므로 긴 코딩 작업에서는 결과 파일과 변경 사항을 직접 점검해야 합니다.</p>
<p>특히 게시물에서 말하는 ‘작업을 기억해 이어받는다’는 표현에는 조건이 붙습니다. 공식 설명에 따르면 모델 변경 시 짧은 인계 메모를 덧붙이는 기능은 선택 설정이며 기본으로 꺼져 있어요. 인계 메모를 켜도 이전 모델과 완전히 똑같이 판단하거나 코드 품질이 보장되는 것은 아닙니다. 이 부분은 자동화의 장점만큼 꼭 알려 주고 싶었습니다.</p>
<p></p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">API 키 암호화가 있어도 보안을 따져야 하는 이유</h2>
<p>개발자 <a href="https://github.com/tashfeenahmed/freellmapi/blob/main/SECURITY.md" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">보안 정책</a>에는 제공업체 키를 로컬 SQLite 데이터베이스에 AES-256-GCM 방식으로 암호화해 저장한다고 적혀 있습니다. 앱에는 통합 인증 토큰도 따로 있으며, 관련 비밀 키를 보관하는 환경 파일과 저장 폴더를 노출하지 말라고 권고합니다. 이런 기능은 분명 반갑지만 오픈소스나 암호화라는 단어 하나로 무조건 안전하다고 평가하긴 어렵습니다.</p>
<p>가장 놓치기 쉬운 것은 요청 내용의 이동 경로입니다. 라우터가 내 컴퓨터에서 작동하더라도 실제 질문과 코드 일부는 내가 선택한 외부 AI 제공업체 서버로 전달돼요. 업체별 데이터 보관, 학습 사용, 로그 정책이 서로 다를 수 있으니 회사 소스코드와 비밀번호, 고객 개인정보는 가린 다음 보내는 편을 권합니다. 자동 전환을 쓰면 요청을 받아 처리하는 제공업체도 달라질 수 있습니다.</p>
<ul>
<li>공식 저장소에서 받은 설치 파일과 최신 업데이트만 사용하기</li>
<li>API 키와 통합 토큰을 Git 저장소·화면 캡처·공유 문서에 붙여 넣지 않기</li>
<li>로컬 접속 유지, 외부 포트 공개와 공유 컴퓨터 사용 피하기</li>
<li>유출이 의심되면 통합 키를 재발급하고 업체별 API 키도 교체하기</li>
<li>민감한 코드나 개인정보는 테스트 요청에서 제외하기</li>
</ul>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">개인 학습에는 유용하지만 실서비스에는 신중해야 한다</h2>
<p>공식 README에는 이 프로젝트를 개인 실험과 학습을 위한 것으로 소개하고, 실제 서비스 운영에는 안정적인 유료 API로 옮기라는 취지의 안내가 있습니다. 모델이 많다는 장점만 보고 고객이 쓰는 서비스를 연결하면 무료 한도 소진, 제공업체 정책 변경, 품질 편차로 곤란해질 수 있거든요. 개발 도구의 MIT 라이선스와 외부 AI 모델의 서비스 이용 조건도 따로 보아야 합니다.</p>
<p>저라면 개인 코딩 연습, AI 모델 비교, 비용을 아끼는 프로토타입 작업에는 써 볼 만하다고 생각합니다. 반면 고객 정보가 오가는 업무나 매번 동일한 품질과 응답 속도가 필요한 자동화는 검토 범위가 훨씬 커집니다. 실무에서는 한도 초과 시 실패하는 상황을 대비하고, 어떤 제공업체가 요청을 처리했는지도 로그로 남기는 설계가 필요해 보입니다.</p>
<p>결국 가장 좋은 사용법은 처음부터 수십 개 업체를 모두 연결하는 게 아니라 약관을 이해한 무료 키 한두 개로 작은 테스트부터 시작하는 것입니다. 자동으로 이어진다는 편리함 뒤에 비용, 문맥, 데이터 이동이라는 조건이 있다는 사실만 알아도 선택이 한결 쉬워집니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">자주 묻는 질문</h2>
<p><b>Q. 무료 버전에도 카드 등록이 필요한가요?</b></p>
<p>FreeLLMAPI 자체는 카드 없이 설치할 수 있습니다. 다만 실제 모델을 제공하는 회사의 무료 API 가입 조건은 별도입니다.</p>
<p><b>Q. 클로드 유료 구독 없이 클로드 코드를 연동할 수 있나요?</b></p>
<p>공식 문서는 클로드 코드 클라이언트를 통합 라우터에 연결하는 설정을 안내합니다. 이때 응답은 연결된 외부 무료 모델이 생성할 수 있으며, 앤트로픽의 유료 클로드 모델까지 무료로 제공되는 방식은 아니에요.</p>
<p><b>Q. 한도가 차면 하던 코딩 작업이 반드시 이어지나요?</b></p>
<p>대체 모델로 재시도하는 기능은 있지만 맥락 인계는 선택 설정이고 응답 품질도 달라질 수 있습니다. 중요한 변경 사항은 버전 관리 기록으로 남기는 편이 좋습니다.</p>
<p><b>Q. 회사 프로젝트에도 써도 되나요?</b></p>
<p>프로그램의 MIT 라이선스와 별도로 각 제공업체의 약관, 데이터 보호 정책, 보안 요구 사항을 따져야 합니다. 프로젝트 개발자도 개인 실험·학습 중심으로 안내하고 있습니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">출처와 참고한 곳</h2>
<ul>
<li><a href="https://github.com/tashfeenahmed/freellmapi" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">FreeLLMAPI 공식 GitHub</a> — 라우팅 기능, 라이선스, 실사용 목적과 제한</li>
<li><a href="https://github.com/tashfeenahmed/freellmapi/blob/main/docs/en/install/01-install.md" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">공식 설치 문서</a> — 운영체제별 다운로드 및 Docker 설치 경로</li>
<li><a href="https://freellmapi.co/ko/pricing" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">공식 한국어 요금제</a> — 무료 버전과 프리미엄의 차이 및 표시 가격</li>
<li><a href="https://github.com/tashfeenahmed/freellmapi/blob/main/SECURITY.md" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">공식 보안 정책</a> — 키 암호화, 로컬 접속, 토큰 관리 권고</li>
<li><a href="https://github.com/tashfeenahmed/freellmapi/blob/main/docs/en/clients/01-agent-clients.md" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">클라이언트 연결 문서</a> — 클로드 코드와 기타 코딩 도구 설정</li>
</ul>
<style>@keyframes loovShine{0%{background-position:200% 0}100%{background-position:-200% 0}}@keyframes loovGlow{0%,100%{box-shadow:0 2px 8px rgba(26,115,232,.35)}50%{box-shadow:0 2px 16px rgba(109,179,255,.9)}}a.loov-link{animation:loovShine 2.8s linear infinite,loovGlow 2s ease-in-out infinite}a.loov-link:hover{filter:brightness(1.1);transform:translateY(-1px)}@media(prefers-reduced-motion:reduce){a.loov-link{animation:none}}</style>
<h2>함께 읽으면 좋은 글</h2>
<ul>
<li><a href="https://2days.kr/22/10/07/109016/it/program/">PHP 보안 취약점 비상, AI 발견 PHP2Shell 워드프레스 서버 패치</a></li>
<li><a href="https://2days.kr/20/10/08/108756/it/program/">Inspo MCP 무료 설치와 코딩 에이전트 디자인 레퍼런스 설정</a></li>
<li><a href="https://2days.kr/19/10/23/108691/it/program/">Kemono.cr Pawchive.pw 업데이트 비교</a></li>
</ul>
<!-- CONTENT END 4 -->
]]></content:encoded>
					
		
		
		<media:content url="https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/freellmapi-1.png?ssl=1" medium="image"></media:content>
            	</item>
		<item>
		<title>PHP 보안 취약점 비상, AI 발견 PHP2Shell 워드프레스 서버 패치</title>
		<link>https://2days.kr/22/10/07/109016/it/program/</link>
		
		<dc:creator><![CDATA[Lisa]]></dc:creator>
		<pubDate>Wed, 21 Oct 2026 22:46:43 +0000</pubDate>
				<category><![CDATA[program]]></category>
		<guid isPermaLink="false">https://2days.kr/22/10/07/109016/%eb%af%b8-%eb%b6%84%eb%a5%98/</guid>

					<description><![CDATA[워드프레스 블로그나 쇼핑몰을 운영한다면 서버의 PHP 버전부터 살펴봐야 할 때입니다. 2026년 10월 21일 공개된 PHP 보안 취약점 두 건은 로그인하지 않은 공격자가 서버에서 코드를 실행하거나 민감한 정보를 읽을 위험을 만들었습니다. 다행히 긴급 수정 버전은 이미 나왔고, 우선순위는 PHP 실행 환경의 업데이트입니다. AI가 찾아낸 결함이라는 말에 겁부터 나지만, 무엇을 고쳐야 하는지는 의외로 분명합니다. PHP2Shell 보안 취약점은 [&#8230;]]]></description>
										<content:encoded><![CDATA[<p>워드프레스 블로그나 쇼핑몰을 운영한다면 서버의 PHP 버전부터 살펴봐야 할 때입니다. 2026년 10월 21일 공개된 PHP 보안 취약점 두 건은 로그인하지 않은 공격자가 서버에서 코드를 실행하거나 민감한 정보를 읽을 위험을 만들었습니다. 다행히 긴급 수정 버전은 이미 나왔고, 우선순위는 PHP 실행 환경의 업데이트입니다. AI가 찾아낸 결함이라는 말에 겁부터 나지만, 무엇을 고쳐야 하는지는 의외로 분명합니다.</p>
<figure style="text-align:center;margin:0 auto 28px;"><img decoding="async" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" fifu-lazy="1" fifu-data-sizes="auto" fifu-data-srcset="https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/php-1.png?ssl=1&w=75&resize=75&ssl=1 75w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/php-1.png?ssl=1&w=100&resize=100&ssl=1 100w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/php-1.png?ssl=1&w=150&resize=150&ssl=1 150w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/php-1.png?ssl=1&w=240&resize=240&ssl=1 240w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/php-1.png?ssl=1&w=320&resize=320&ssl=1 320w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/php-1.png?ssl=1&w=500&resize=500&ssl=1 500w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/php-1.png?ssl=1&w=640&resize=640&ssl=1 640w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/php-1.png?ssl=1&w=800&resize=800&ssl=1 800w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/php-1.png?ssl=1&w=1024&resize=1024&ssl=1 1024w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/php-1.png?ssl=1&w=1280&resize=1280&ssl=1 1280w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/php-1.png?ssl=1&w=1600&resize=1600&ssl=1 1600w" fifu-data-src="https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/php-1.png?ssl=1" alt="PHP 보안 취약점 비상, AI 발견 PHP2Shell 워드프레스 서버 패치" title="PHP 보안 취약점 비상, AI 발견 PHP2Shell 워드프레스 서버 패치" style="width:100%;max-width:100%;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,0.15);" loading="lazy"/></figure><div class='code-block code-block-2' style='margin: 8px auto; text-align: center; display: block; clear: both;'>
<!-- 중간 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8940400388075870"
     data-ad-slot="8794586137"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script></div>

<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">PHP2Shell 보안 취약점은 왜 심각할까</h2>

<p>이번 사건은 PHP2Shell이라는 이름으로 알려졌습니다. PHP는 워드프레스와 각종 예약·결제·게시판 서비스의 서버에서 프로그램을 실행하는 언어입니다. 취약점이 홈페이지 디자인이나 특정 플러그인이 아니라 PHP 엔진 안에 있다는 점이 특히 걱정스럽더군요. 겉으로 멀쩡하게 보이는 사이트도 서버 구성이 취약하면 영향을 받을 수 있기 때문입니다.</p>
<p>공개된 식별 번호는 CVE-2026-109618과 CVE-2026-109619입니다. 두 결함 모두 PHP가 비정상적인 요청이나 메모리 부족 상황을 처리하다 내부 메모리 상태를 잘못 다루는 문제와 연결됩니다. 보안 등급은 CVSS 4.0 기준 각각 9.2점으로 발표됐고, 공격이 성립하면 서버 권한으로 명령이 실행되거나 인증 정보가 노출될 수 있어요. 물론 취약한 버전을 쓴다는 사실만으로 이미 해킹당했다는 결론을 내릴 수는 없습니다.</p>
<p>이번 발견에 AI가 쓰였다는 사실도 눈길을 끕니다. OpenAI는 연구팀이 GPT-5.6 Sol을 이용해 결함을 발견했고, Wiz도 AI 도구를 활용해 별도로 연구했다고 밝혔습니다. 이 소식은 AI가 모든 사이트를 자동으로 해킹했다는 발표가 아니라, 오랫동안 숨어 있던 취약점을 찾고 분석하는 능력이 빠르게 커지고 있다는 신호에 가깝습니다. 저는 공포스러운 제목보다 실제 보안 패치를 적용했는지가 훨씬 중요하다고 생각해요.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">워드프레스와 쇼핑몰 서버는 어디까지 위험할까</h2>
<p>연구진은 워드프레스·드루팔·줌라 환경에서 인증 없이 코드 실행이 가능한 사례를 재현했습니다. 그러나 해당 프로그램에만 생긴 문제가 아니에요. 같은 취약 PHP 엔진을 사용하는 다른 게시판, 기업 홈페이지, 자체 제작 쇼핑몰에도 위험이 생길 수 있습니다. 웹사이트 화면이 똑같아도 실제 서버에 깔린 PHP 버전과 웹서버 구성에 따라 대응이 달라집니다.</p>
<p>PHP 공식 보안 공지는 PHP-FPM, Apache의 mod_php, php-cgi, FrankenPHP, LiteSpeed처럼 웹 요청을 처리하는 구성 전반을 대상으로 지목했습니다. 특히 mod_php에서는 애플리케이션 코드가 실행되기도 전에 공격이 가능한 사례가 확인돼 위험도가 더 높다고 평가했죠. 반대로 서버가 PHP를 전혀 사용하지 않거나 이미 수정 버전이 적용됐다면 이번 결함으로 인한 노출 범위가 다릅니다.</p>
<p>관리자 입장에서 가장 흔한 착각은 워드프레스 본체나 플러그인을 최신으로 바꾸면 끝났다고 생각하는 겁니다. 이번 PHP 보안 취약점은 서버의 PHP 런타임이 핵심이니, 워드프레스 업데이트와 PHP 업데이트를 별도로 살펴야 합니다. 웹호스팅을 이용한다면 직접 서버에 접속하기보다 호스팅 업체 관리 화면에서 실제 적용 버전과 보안 공지부터 살펴보는 편이 안전하겠어요.</p>
<p></p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">PHP 긴급 보안 패치 버전은 무엇일까</h2>
<p>PHP 개발진은 2026년 10월 21일 공식 발표에서 아래 수정 버전을 공개했습니다. 운영 중인 주 버전 계열에 맞춰 최소한 이 버전 이상으로 올리는 것이 기본 대응입니다. <a href="https://www.php.net/archive/2026.php#2026-10-21-5" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">PHP 공식 긴급 보안 공지</a>에는 영향 범위와 임시 완화 조치도 함께 나와 있습니다.</p>
<div style="overflow-x:auto;">
<table style="width:100%;border-collapse:collapse;margin:18px 0;font-size:15px;">
<thead style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">
<tr>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">PHP 계열</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">긴급 수정 버전</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">운영자가 볼 부분</th>
</tr>
</thead>
<tbody>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">8.5</td>
<td style="border:1px solid #d0d7de;padding:10px;">8.5.12 이상</td>
<td style="border:1px solid #d0d7de;padding:10px;">설치 후 실행 중인 버전 재확인</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">8.4</td>
<td style="border:1px solid #d0d7de;padding:10px;">8.4.27 이상</td>
<td style="border:1px solid #d0d7de;padding:10px;">웹서버와 PHP 서비스 재시작 상태</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">8.3</td>
<td style="border:1px solid #d0d7de;padding:10px;">8.3.36 이상</td>
<td style="border:1px solid #d0d7de;padding:10px;">기존 확장 기능 호환성 점검</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">8.2</td>
<td style="border:1px solid #d0d7de;padding:10px;">8.2.35 이상</td>
<td style="border:1px solid #d0d7de;padding:10px;">2026년 말 지원 종료 전 상위 계열 이전 준비</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">8.1 이하</td>
<td style="border:1px solid #d0d7de;padding:10px;">PHP 프로젝트 지원 종료</td>
<td style="border:1px solid #d0d7de;padding:10px;">지원 버전으로 이전하거나 공급사의 보안 수정 적용 여부 확인</td>
</tr>
</tbody>
</table>
</div>
<p>PHP 8.1 이하 계열은 공식 프로젝트의 지원이 끝났습니다. 다만 리눅스 배포판이나 장기 지원 업체가 기존 버전에 수정 코드를 역적용해 제공할 수 있어, 표시된 버전 번호만으로 보안 상태를 단정하는 것도 실수입니다. 서버 제공 업체의 보안 공지와 실제 패키지 수정 내역을 같이 보는 게 정확하죠. 일반 다운로드는 <a href="https://www.php.net/downloads.php" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">PHP 공식 다운로드 페이지</a>를 참고하면 됩니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">내 서버의 PHP 버전 확인과 업데이트 순서</h2>
<p>홈페이지 운영자가 오늘 바로 해야 할 일은 사용 중인 사이트와 서버를 빠짐없이 적는 작업입니다. 운영 사이트는 물론 테스트 서버, 오래된 하위 도메인, 백업용 가상 서버도 PHP를 실행할 수 있거든요. 실제 서비스에 연결된 PHP 실행 환경은 관리자 화면이나 웹서버 설정, 호스팅 업체 지원센터를 통해 확인하는 것이 좋습니다.</p>
<ol>
<li>운영 사이트, 테스트 환경, 하위 도메인과 호스팅 계정을 목록으로 적습니다.</li>
<li>실제 웹 요청을 처리하는 PHP 버전과 실행 방식, 업체의 보안 수정 적용 여부를 파악합니다.</li>
<li>웹사이트 파일·데이터베이스를 백업하고 복원 절차를 점검합니다. 감염이 의심된다면 기존 기록도 보존합니다.</li>
<li>호스팅 업체 또는 서버 관리자의 정식 업데이트 절차로 PHP 패치를 적용하고 필요한 워커·서비스를 재시작합니다.</li>
<li>업데이트 뒤 실제 웹 서비스의 PHP 버전과 로그인, 주문, 결제, 파일 업로드, 예약 등 핵심 기능을 확인합니다.</li>
</ol>
<p>셸 명령어인 php -v는 서버에 설치된 명령행 PHP 버전만 보여줄 수도 있습니다. 웹사이트를 구동하는 PHP-FPM이나 Apache 모듈의 버전이 별도로 남아 있다면 이 검사만으로 안전 판정을 내리기는 어렵습니다. 그래서 저는 설정 화면의 숫자 하나보다 실제 요청에 연결된 실행 환경이 무엇인지부터 확인하겠습니다. 공개 웹 경로에 버전 확인용 진단 파일을 오래 남겨두는 실수도 피하는 편이 낫겠어요.</p>
<p></p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">패치를 곧바로 적용하지 못할 때 임시 대응</h2>
<p>서버를 지금 업그레이드하기 어렵다면 먼저 외부에 공개된 취약 서비스를 제한할지 판단해야 합니다. 운영 위험이 큰 서비스는 일시적으로 외부 접속을 막거나 점검 안내로 전환하는 선택도 있습니다. 예약이나 결제 때문에 운영 중단이 부담스럽겠지만, 고객 정보를 맡은 사이트라면 저는 노출을 방치하는 쪽이 더 걱정됩니다.</p>
<p>Cloudflare 등은 웹 방화벽 규칙을 제공해 공격 시도를 줄이는 데 참여했습니다. 이런 방어는 시간을 벌어 줄 뿐 PHP 자체의 결함을 제거하지 못합니다. <a href="https://blog.cloudflare.com/php-vulnerabilities-waf-protection" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Cloudflare의 PHP2Shell 대응 설명</a>과 호스팅 업체 공지를 참고하되, 방화벽을 켜 놓았다는 이유로 서버 업데이트를 뒤로 미루지는 않는 게 좋겠습니다.</p>
<p>PHP 공식 공지에는 메모리 제한, 파일 업로드 요청 제한, 세션 업로드 진행 기능 등의 임시 설정도 제시됐습니다. 단, 설정을 잘못 바꾸면 서버가 불안정해지거나 서비스가 멈출 수 있고 다른 공격 경로가 남을 수도 있습니다. 전문 관리자가 적용 범위를 검토할 사항이며 완전한 해결책은 수정 버전으로 올리는 일입니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">이미 해킹당했는지 로그에서 찾아볼 징후</h2>
<p>패치가 끝났더라도 앞서 공격 시도가 없었는지는 별도의 문제입니다. 보안 연구팀은 비정상적인 파일 업로드 형식의 요청 뒤 메모리 제한 오류나 HTTP 500 오류가 반복되는 현상, 이상한 세션 쿠키, PHP 작업 프로세스의 잦은 재시작을 조사 단서로 제시했습니다. 이런 흔적은 다른 장애에서도 나타날 수 있어 한 가지 징후만으로 침입을 확정하기는 어렵습니다.</p>
<p>의심스러운 정황을 발견했다면 서버 접근 기록, 웹서버 오류 기록, PHP 오류 기록, 보안 장비 이벤트를 시간순으로 보존하는 게 우선입니다. 관리자가 모르는 신규 계정, 웹 루트의 예상 밖 파일, 바뀐 설정과 외부 통신 내역도 함께 조사해야겠죠. 단순히 로그를 지우거나 서버를 재설치하면 나중에 원인을 추적하기 더 어려워질 수 있습니다.</p>
<p>침해가 확인되면 영향을 받은 서버를 격리하고 보존한 자료를 바탕으로 전문 대응 인력과 범위를 조사해야 합니다. 유출 가능성이 있는 비밀번호, API 키, 관리자 토큰은 적절한 순서로 교체하고 깨끗한 백업으로 복구할지 결정합니다. 개인정보가 실제로 유출됐다면 관계 법령에 따른 신고와 이용자 안내 의무도 검토해야 합니다. 패치와 침해 조사, 두 작업을 나눠 진행하는 게 핵심입니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">일반 이용자와 사이트 운영자는 무엇부터 할까</h2>
<p>뉴스를 보고 인터넷 검색만 해도 바로 해킹되는 것 아니냐고 걱정할 수 있습니다. 이번 PHP2Shell은 주로 웹서비스를 제공하는 서버 쪽의 취약점이므로, 일반 이용자의 휴대전화에 PHP 패치를 설치할 사안은 아닙니다. 다만 이용하던 사이트에서 실제 유출 안내가 오면 공식 경로로 계정 보안 조치를 진행해야 합니다.</p>
<p>개인 이용자는 같은 비밀번호를 여러 사이트에서 쓰지 않고 다중 인증을 설정해 두면 피해 확산을 줄이는 데 도움이 됩니다. 반면 사이트 운영자는 패치 적용 책임 주체를 먼저 확인해야 합니다. 관리형 호스팅 사용자는 업체가 PHP를 고치는지, 직접 운영하는 서버는 누가 패키지 업데이트와 재시작을 담당하는지 분명히 나눠야 하거든요.</p>
<p>이번 PHP 보안 취약점 사건에서 제가 가장 크게 느낀 건 AI가 공격 도구가 될 수 있다는 불안보다, 오래된 기반 소프트웨어의 빈틈을 운영자가 얼마나 빨리 고칠 수 있느냐의 차이입니다. 업데이트 전 자산 목록이 있는 팀과 그렇지 않은 팀의 대응 속도는 크게 다르겠죠. 오늘 하나를 선택해야 한다면 사용 중인 PHP 버전과 수정 적용 여부를 정확하게 파악하는 일이 먼저입니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">자주 묻는 질문</h2>
<p><b>Q. 워드프레스를 최신 버전으로 업데이트하면 안전한가요?</b></p>
<p>이번 결함은 PHP 엔진에 있어 워드프레스 업데이트와 별도로 서버의 PHP 수정 버전을 적용해야 합니다. 플러그인과 테마 보안 업데이트도 평소대로 유지하세요.</p>
<p><b>Q. PHP 7.4나 8.1 서버를 계속 써도 될까요?</b></p>
<p>공식 PHP 프로젝트는 해당 계열을 더 이상 일반 지원하지 않습니다. 공급사가 역적용한 보안 패치를 실제로 제공하는지 파악하고, 가능하면 지원 중인 계열로 이전할 계획을 세우세요.</p>
<p><b>Q. 웹 방화벽을 켰다면 업데이트를 미뤄도 되나요?</b></p>
<p>웹 방화벽은 알려진 공격 경로를 일부 줄여 주는 보조 수단입니다. PHP 개발진이 발표한 완전한 해결책은 보안 수정 버전 적용입니다.</p>
<p><b>Q. 보안 위험이 크다는 것은 이미 개인정보가 유출됐다는 말인가요?</b></p>
<p>취약점 공개와 실제 침해 사실은 구분해야 합니다. 해당 사이트의 로그 조사나 사업자의 공식 안내로 침해 여부와 범위가 확인돼야 합니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">출처와 참고한 곳</h2>
<ul>
<li><a href="https://www.php.net/archive/2026.php#2026-10-21-5" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">PHP 공식 개발팀</a> — 2026년 10월 21일 긴급 보안 공지, 수정 버전, 임시 대응 원칙</li>
<li><a href="https://www.wiz.io/blog/php2shell-php-rce" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Wiz 보안 연구팀</a> — PHP2Shell 기술 분석과 실제 재현 범위, 조사할 징후</li>
<li><a href="https://openai.com/index/coordinated-disclosure-of-critical-vulnerabilities/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">OpenAI</a> — AI 기반 결함 발견과 공동 보안 대응 경과</li>
<li><a href="https://digital.nhs.uk/cyber-alerts/2026/cc-4875" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">영국 NHS 디지털 보안 경보</a> — 영향을 받는 PHP 버전과 수정 권고</li>
<li><a href="https://blog.cloudflare.com/php-vulnerabilities-waf-protection" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Cloudflare</a> — 웹 방화벽을 통한 임시 보호 조치</li>
</ul>
<style>@keyframes loovShine{0%{background-position:200% 0}100%{background-position:-200% 0}}@keyframes loovGlow{0%,100%{box-shadow:0 2px 8px rgba(26,115,232,.35)}50%{box-shadow:0 2px 16px rgba(109,179,255,.9)}}a.loov-link{animation:loovShine 2.8s linear infinite,loovGlow 2s ease-in-out infinite}a.loov-link:hover{filter:brightness(1.1);transform:translateY(-1px)}@media(prefers-reduced-motion:reduce){a.loov-link{animation:none}}</style>
<h2>함께 읽으면 좋은 글</h2>
<ul>
<li><a href="https://2days.kr/20/10/08/108756/it/program/">Inspo MCP 무료 설치와 코딩 에이전트 디자인 레퍼런스 설정</a></li>
<li><a href="https://2days.kr/19/10/23/108691/it/program/">Kemono.cr Pawchive.pw 업데이트 비교</a></li>
<li><a href="https://2days.kr/17/10/16/108467/it/program/">AI 홈페이지 애니메이션 효과 9곳 비교와 적용 팁</a></li>
</ul>
<!-- CONTENT END 6 -->
]]></content:encoded>
					
		
		
		<media:content url="https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/php-1.png?ssl=1" medium="image"></media:content>
            	</item>
		<item>
		<title>Inspo MCP 무료 설치와 코딩 에이전트 디자인 레퍼런스 설정</title>
		<link>https://2days.kr/20/10/08/108756/it/program/</link>
		
		<dc:creator><![CDATA[Lisa]]></dc:creator>
		<pubDate>Mon, 19 Oct 2026 23:12:38 +0000</pubDate>
				<category><![CDATA[program]]></category>
		<guid isPermaLink="false">https://2days.kr/20/10/08/108756/%eb%af%b8-%eb%b6%84%eb%a5%98/</guid>

					<description><![CDATA[AI에게 랜딩 페이지를 만들어 달라고 했더니 어디선가 본 듯한 커다란 제목, 그라데이션 배경, 둥근 카드만 반복된 적 있나요? 그런 상황이라면 ‘세련되게 만들어 줘’라는 주문을 한 번 더 하는 대신 실제 사이트를 먼저 보여주는 편이 낫습니다. Inspo MCP는 코딩 에이전트가 웹사이트 디자인 레퍼런스를 직접 검색해 화면을 설계하도록 돕는 무료 연결 도구입니다. 무엇을 설치하고 어떻게 요청해야 하는지, [&#8230;]]]></description>
										<content:encoded><![CDATA[<p>AI에게 랜딩 페이지를 만들어 달라고 했더니 어디선가 본 듯한 커다란 제목, 그라데이션 배경, 둥근 카드만 반복된 적 있나요? 그런 상황이라면 ‘세련되게 만들어 줘’라는 주문을 한 번 더 하는 대신 실제 사이트를 먼저 보여주는 편이 낫습니다. Inspo MCP는 코딩 에이전트가 웹사이트 디자인 레퍼런스를 직접 검색해 화면을 설계하도록 돕는 무료 연결 도구입니다. 무엇을 설치하고 어떻게 요청해야 하는지, 또 결과물을 어디까지 참고해야 하는지 짚어보겠습니다.</p>
<figure style="text-align:center;margin:0 auto 28px;"><img decoding="async" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" fifu-lazy="1" fifu-data-sizes="auto" fifu-data-srcset="https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/inspo-mcp-1.png?ssl=1&w=75&resize=75&ssl=1 75w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/inspo-mcp-1.png?ssl=1&w=100&resize=100&ssl=1 100w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/inspo-mcp-1.png?ssl=1&w=150&resize=150&ssl=1 150w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/inspo-mcp-1.png?ssl=1&w=240&resize=240&ssl=1 240w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/inspo-mcp-1.png?ssl=1&w=320&resize=320&ssl=1 320w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/inspo-mcp-1.png?ssl=1&w=500&resize=500&ssl=1 500w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/inspo-mcp-1.png?ssl=1&w=640&resize=640&ssl=1 640w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/inspo-mcp-1.png?ssl=1&w=800&resize=800&ssl=1 800w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/inspo-mcp-1.png?ssl=1&w=1024&resize=1024&ssl=1 1024w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/inspo-mcp-1.png?ssl=1&w=1280&resize=1280&ssl=1 1280w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/inspo-mcp-1.png?ssl=1&w=1600&resize=1600&ssl=1 1600w" fifu-data-src="https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/inspo-mcp-1.png?ssl=1" alt="Inspo MCP 무료 설치와 코딩 에이전트 디자인 레퍼런스 설정" title="Inspo MCP 무료 설치와 코딩 에이전트 디자인 레퍼런스 설정" style="width:100%;max-width:100%;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,0.15);" loading="lazy"/></figure><div class='code-block code-block-2' style='margin: 8px auto; text-align: center; display: block; clear: both;'>
<!-- 중간 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8940400388075870"
     data-ad-slot="8794586137"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script></div>

<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">Inspo MCP는 예쁜 화면 모음과 무엇이 다를까</h2>

<p>평범한 디자인 갤러리는 사람이 직접 사이트를 둘러보고 마음에 드는 이미지를 저장하는 방식입니다. 반면 이 도구는 MCP라는 연결 방식을 통해 AI 코딩 에이전트가 자료를 읽도록 만든 서비스입니다. 사용자가 만들려는 서비스와 페이지 목적을 설명하면 에이전트는 관련 사례를 찾고 디자인 구성에 반영할 근거를 받아올 수 있죠. 저는 단순히 화면을 구경하는 기능보다 ‘코드를 쓰기 전에 참고 대상을 정한다’는 작업 순서가 눈에 들어왔습니다.</p>
<p><a href="https://inspomcp.dev/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Inspo 공식 갤러리</a>에는 2026년 10월 확인 시점 기준 실제 운영 사이트 832개와 화면 2,320개가 소개돼 있습니다. 각 화면은 데스크톱·모바일 캡처를 갖추고 있으며 글꼴, 색상, 레이아웃 구조 같은 자료를 제공합니다. 자료 수가 많다고 무조건 좋은 결과가 나오는 건 아니지만, 빈 화면에서 모호한 분위기만 지시하는 것보다는 선택할 수 있는 근거가 훨씬 구체적이에요.</p>
<p>예를 들어 음악 행사 페이지와 기업용 데이터 대시보드는 정보를 보여주는 우선순위부터 다릅니다. 그런데 참고 자료 없이 AI에게 둘 다 ‘모던하게’라고만 말하면 비슷한 카드형 화면으로 흘러갈 수 있습니다. Inspo에서는 업종, 화면 유형, 구성 형태를 힌트로 삼아 서로 다른 실제 사례를 찾아볼 수 있어서 이런 어긋남을 줄이는 데 도움이 됩니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">무료로 제공되는 범위와 디자인 자료의 종류</h2>
<p><a href="https://inspomcp.dev/about" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">운영사의 공식 소개</a>에는 호스팅된 MCP 서버가 무료이며 별도 요금제나 유료 장벽이 없다고 명시돼 있습니다. 계정 인증 없이 연결하는 방식도 제공합니다. 다만 연결된 Claude Code나 다른 코딩 도구의 사용료, API 사용 비용까지 무료라는 말은 아닙니다. 이 차이를 모르고 설치하면 나중에 비용을 오해하기 쉬워요.</p>
<p>화면 캡처만 모아둔 서비스라고 생각했다면 아래 구성은 의외일 수 있습니다. 실제 운영 사이트를 분석해 추출한 디자인 수치와 재사용 가능한 참고 컴포넌트까지 함께 제공하기 때문입니다. 저는 특히 기존 프로젝트의 색상과 글꼴을 맞춰야 할 때 사이트별 디자인 시스템 파일이 유용할 것 같습니다.</p>
<div style="overflow-x:auto;">
<table style="width:100%;border-collapse:collapse;margin:18px 0;font-size:15px;">
<thead style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">
<tr>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">제공 자료</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">공식 안내 규모</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">화면 제작에서 쓸 자리</th>
</tr>
</thead>
<tbody>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">실제 운영 웹사이트</td>
<td style="border:1px solid #d0d7de;padding:10px;">832개</td>
<td style="border:1px solid #d0d7de;padding:10px;">업종과 분위기가 맞는 사례 선정</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">수집된 화면</td>
<td style="border:1px solid #d0d7de;padding:10px;">2,320개</td>
<td style="border:1px solid #d0d7de;padding:10px;">데스크톱과 모바일 구성 비교</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">참고 컴포넌트</td>
<td style="border:1px solid #d0d7de;padding:10px;">68개</td>
<td style="border:1px solid #d0d7de;padding:10px;">히어로 영역·가격표·내비게이션 구조 참고</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">사이트별 DESIGN.md</td>
<td style="border:1px solid #d0d7de;padding:10px;">사이트마다 제공</td>
<td style="border:1px solid #d0d7de;padding:10px;">색상 역할·글자 크기·여백 규칙 점검</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">호스팅 MCP</td>
<td style="border:1px solid #d0d7de;padding:10px;">무료·인증 불필요</td>
<td style="border:1px solid #d0d7de;padding:10px;">코딩 에이전트에 자료 연결</td>
</tr>
</tbody>
</table>
</div>
<p>여기서 DESIGN.md는 사이트의 색상 역할, 서체 크기 체계, 간격과 CSS 변수 등을 읽기 쉽게 정리한 파일을 말합니다. 보기 좋은 사이트 한 장을 그대로 따라 그리는 대신 어떤 규칙으로 균형을 잡았는지를 살펴볼 수 있다는 점이 좋습니다. 숫자와 구성은 서비스가 갱신되면 달라질 수 있으니 현재 제공 범위를 볼 때는 <a href="https://inspomcp.dev/mcp" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">공식 MCP 안내 페이지</a>가 기준입니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">터미널 한 줄 설치와 설정 변경 전 점검</h2>
<p>설치는 Node.js와 npm의 npx 명령을 쓸 수 있는 개발 환경에서 진행합니다. 터미널을 열어 아래 명령을 입력하면 설치 도구가 컴퓨터에 있는 MCP 클라이언트를 찾아 연결 설정을 제안합니다. 공식 문서에서 안내하는 명령은 <code>npx -y inspo-mcp install</code>입니다. <code>-y</code>는 npx가 패키지를 실행할 때 물어보는 확인을 생략하는 옵션이므로, 이미 다른 설명에서 이 부분이 빠진 명령을 봤더라도 당황할 필요는 없습니다.</p>
<ol>
<li>터미널에서 <code>node -v</code>와 <code>npm -v</code>로 실행 환경을 확인합니다.</li>
<li>기존 설정이 걱정되면 <code>npx -y inspo-mcp install --dry-run</code>을 먼저 실행해 변경 계획만 살펴봅니다.</li>
<li>문제가 없으면 <code>npx -y inspo-mcp install</code>을 실행하고 제안되는 클라이언트와 설정을 읽은 뒤 진행합니다.</li>
<li>사용 중인 코딩 에이전트를 다시 시작하고 MCP 도구 목록에서 Inspo가 연결됐는지 살펴봅니다.</li>
</ol>
<p></p>
<p>여기서 주의할 점 하나. 설치 명령은 화면 디자인을 곧장 만들어주는 명령이 아니라 코딩 도구의 MCP 연결 설정을 추가하는 절차입니다. 공식 문서에 따르면 변경 대상 설정 파일은 백업되며, Zed는 기존 주석을 보존하도록 수정 내용을 직접 붙여 넣는 방식으로 안내합니다. 여러 편집기를 쓰는 사람이라면 자동 탐지 결과에 원하지 않는 클라이언트가 섞여 있는지 보는 편이 마음 편하겠습니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">Claude Code와 Cursor에서 직접 연결하는 경우</h2>
<p>자동 설치가 부담스럽거나 특정 프로그램 하나만 연결하고 싶을 수도 있겠죠. 이때는 Inspo의 무료 호스팅 주소인 <code>https://inspomcp.dev/api/mcp</code>를 사용하면 됩니다. 설치 도구가 지원하는 클라이언트는 Claude Code, Cursor, Codex, VS Code, Windsurf, Zed, Claude Desktop 등입니다. 클라이언트마다 설정 화면과 파일 위치가 다르기 때문에 한 프로그램의 설정을 다른 곳에 그대로 붙여 넣는 것은 피하세요.</p>
<p>Claude Code는 터미널에서 <code>claude mcp add --transport http inspo https://inspomcp.dev/api/mcp</code>로 등록할 수 있다고 공식 문서에 적혀 있습니다. Cursor라면 사용자 설정 파일 <code>~/.cursor/mcp.json</code> 안의 <code>mcpServers</code> 항목에 서버 이름 <code>inspo</code>와 위 URL을 등록하는 방식입니다. 설치 후 목록에 서버가 없으면 에이전트를 재시작하고 MCP 설정 화면에서 활성화 여부를 살피는 순서가 좋습니다.</p>
<p>자동 설치 명령과 수동 연결 중 무엇이 더 좋을까요? 처음 시도하는 사람은 설치 전 변경 계획을 보고 자동 설치를 선택하는 편이 편하겠습니다. 이미 MCP 서버를 여럿 관리하거나 팀별 설정을 따로 쓰는 개발자라면 수동 등록이 관리하기 쉬울 것 같아요. 서버 자체는 같은 자료를 제공하므로 차이는 연결 방식에 있습니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">AI에게 실제 디자인 레퍼런스를 찾게 하는 요청 문장</h2>
<p>연결했다면 프롬프트부터 달라져야 합니다. ‘감각적인 쇼핑몰을 만들어 줘’보다는 누구에게 어떤 정보를 가장 먼저 보여줄지 명시하는 편이 효과적입니다. 예를 들어 ‘소규모 사진 스튜디오 예약 페이지를 만들 거야. 모바일 방문자가 가격과 예약 버튼을 빨리 찾도록 실제 사이트 3곳을 참고해 구조를 비교하고, 우리 브랜드의 따뜻한 색상을 유지한 뒤 구현해 줘’처럼 요청할 수 있겠죠.</p>
<p>공식 MCP에는 요청문을 바탕으로 사례와 구성 제안을 모아주는 <code>recommend</code>, 화면을 검색하는 <code>search_screens</code>, 개별 사이트의 디자인 규칙을 가져오는 <code>get_design_system</code>, 참고 컴포넌트 코드를 확인하는 <code>get_reference_jsx</code> 같은 도구가 마련돼 있습니다. 도구 이름을 외울 필요까지는 없지만, AI가 무엇을 근거로 화면을 구성하는지 물어볼 때는 도움이 됩니다. 마음에 드는 첫 결과 하나만 따르기보다 서로 다른 사례의 장단점을 비교하게 해 보세요.</p>
<p></p>
<p>제가 추천하고 싶은 작업 순서는 간단합니다. 먼저 참고 사례를 찾고, 선택 이유와 모바일 화면 구조를 설명받은 다음, 사이트의 색상과 글꼴 규칙을 정한 후 코드 제작을 시작하는 겁니다. 이렇게 하면 구현이 끝난 뒤에야 ‘왜 이런 모양이지?’ 하고 되돌리는 일을 줄일 수 있을 것 같아요.</p>
<div style="overflow-x:auto;">
<table style="width:100%;border-collapse:collapse;margin:18px 0;font-size:15px;">
<thead style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">
<tr>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">막연한 지시</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">디자인 근거가 생기는 지시</th>
</tr>
</thead>
<tbody>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">깔끔하고 세련되게 만들어 줘</td>
<td style="border:1px solid #d0d7de;padding:10px;">실제 예약 서비스 사례를 비교하고 모바일 예약 버튼을 우선 배치해 줘</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">멋진 가격표를 만들어 줘</td>
<td style="border:1px solid #d0d7de;padding:10px;">가격제 비교 컴포넌트 사례를 찾고 차이가 드러나는 열 구조를 제안해 줘</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">폰트랑 색을 예쁘게 바꿔 줘</td>
<td style="border:1px solid #d0d7de;padding:10px;">참고 사이트의 글자 크기·색상 역할을 분석해 우리 브랜드에 맞게 조정해 줘</td>
</tr>
</tbody>
</table>
</div>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">실제 사이트를 참고할 때 피해야 할 실수</h2>
<p>이 도구가 가장 잘 맞는 작업은 랜딩 페이지, 포트폴리오, 서비스 소개 페이지처럼 화면 분위기와 정보 구조의 비중이 큰 작업입니다. 반대로 복잡한 결제 규칙이나 개인정보 처리, 접근성 검증까지 자동으로 해결해 주지는 않습니다. 디자인이 근사해졌더라도 버튼이 실제로 동작하는지, 작은 화면에서 글이 잘리지 않는지, 키보드로 이동할 수 있는지까지 따로 확인해야 합니다.</p>
<p>실제 운영 사이트를 참고한다는 말 때문에 캡처나 컴포넌트를 그대로 복제해도 된다고 오해하기 쉽습니다. 하지만 사이트의 로고, 사진, 문구, 독창적인 그래픽은 각 제작자의 권리가 걸린 영역입니다. <a href="https://github.com/Nutlope/inspo" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">오픈소스 저장소</a>의 서버 코드가 MIT 라이선스라고 해서 수집된 사이트의 디자인 자산까지 자유롭게 재배포할 수 있는 건 아닙니다. 저는 레이아웃의 원리와 정보 배치 방식을 배우되 결과물의 브랜드 요소는 직접 만드는 쪽을 권합니다.</p>
<p>또 한 가지 아쉬운 점은 좋은 사례를 많이 가져와도 에이전트가 사용자와 서비스에 맞는 판단까지 대신해 주지는 못한다는 사실입니다. 코딩 전에 ‘선택한 사례 세 곳과 다른 점, 모바일에서 줄어드는 요소, 원본을 그대로 따라 하지 않을 부분’을 설명하게 해 보세요. 참고 자료가 화려할수록 오히려 무엇을 버릴지가 중요해지거든요. <a href="https://inspomcp.dev/examples" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">공식 제작 사례</a>를 보면 레퍼런스와 실제 결과물을 연결해 살펴보는 감각을 잡는 데 도움이 됩니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">자주 묻는 질문</h2>
<p><b>Q. Inspo MCP를 사용하려면 결제가 필요한가요?</b></p>
<p>호스팅된 Inspo 서버는 공식 안내상 무료이며 별도 인증이 필요하지 않습니다. 다만 연결해서 사용하는 AI 코딩 도구의 요금은 별개입니다.</p>
<p><b>Q. Claude Code가 없어도 설치할 수 있나요?</b></p>
<p>가능합니다. Cursor, Codex, VS Code 등 다양한 MCP 클라이언트가 지원됩니다. 자동 설치 시 탐지되는 프로그램 목록을 먼저 살펴보세요.</p>
<p><b>Q. 화면 이미지를 그대로 복사해서 상업 사이트에 써도 되나요?</b></p>
<p>원본 사이트의 저작권과 상표권을 고려해야 합니다. 구조와 사용 흐름은 참고하되 이미지·로고·문구·시각 자산은 별도로 제작하는 방식이 안전합니다.</p>
<p><b>Q. 설치 후 아무런 화면도 나오지 않는데 실패한 건가요?</b></p>
<p>MCP는 코딩 에이전트 내부에서 자료를 제공하는 연결 도구입니다. 터미널에서 서버를 실행했다고 웹페이지가 자동으로 뜨는 방식이 아니므로, 코딩 도구를 열어 MCP 연결 상태와 사용 가능한 도구를 살펴보세요.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">출처와 참고한 곳</h2>
<ul>
<li><a href="https://inspomcp.dev/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Inspo 공식 사이트</a> — 운영 사이트와 화면 자료 규모, 갤러리 구성</li>
<li><a href="https://inspomcp.dev/mcp" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Inspo MCP 공식 안내</a> — 설치 명령어, 무료 제공과 MCP 도구 목록</li>
<li><a href="https://github.com/Nutlope/inspo" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Nutlope의 GitHub 저장소</a> — 클라이언트 연결 방식과 소스 라이선스</li>
<li><a href="https://aisparkup.com/wiki/inspo" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">AI Sparkup 소개 글</a> — 실제 디자인 사례를 구현에 활용할 때의 관점</li>
</ul>
<style>@keyframes loovShine{0%{background-position:200% 0}100%{background-position:-200% 0}}@keyframes loovGlow{0%,100%{box-shadow:0 2px 8px rgba(26,115,232,.35)}50%{box-shadow:0 2px 16px rgba(109,179,255,.9)}}a.loov-link{animation:loovShine 2.8s linear infinite,loovGlow 2s ease-in-out infinite}a.loov-link:hover{filter:brightness(1.1);transform:translateY(-1px)}@media(prefers-reduced-motion:reduce){a.loov-link{animation:none}}</style>
<h2>함께 읽으면 좋은 글</h2>
<ul>
<li><a href="https://2days.kr/19/10/23/108691/it/program/">Kemono.cr Pawchive.pw 업데이트 비교</a></li>
<li><a href="https://2days.kr/17/10/16/108467/it/program/">AI 홈페이지 애니메이션 효과 9곳 비교와 적용 팁</a></li>
<li><a href="https://2days.kr/15/10/19/108207/it/program/">코덱스 MCP 자동화 도구 5가지 연동 명령어와 발행 전 주의점</a></li>
</ul>
<!-- CONTENT END 8 -->
]]></content:encoded>
					
		
		
		<media:content url="https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/inspo-mcp-1.png?ssl=1" medium="image"></media:content>
            	</item>
		<item>
		<title>Kemono.cr Pawchive.pw 업데이트 비교</title>
		<link>https://2days.kr/19/10/23/108691/it/program/</link>
		
		<dc:creator><![CDATA[Lisa]]></dc:creator>
		<pubDate>Mon, 19 Oct 2026 14:06:10 +0000</pubDate>
				<category><![CDATA[program]]></category>
		<guid isPermaLink="false">https://2days.kr/19/10/23/108691/%eb%af%b8-%eb%b6%84%eb%a5%98/</guid>

					<description><![CDATA[두 사이트를 나란히 보면 메뉴 위치와 게시물 카드 배열이 비슷해서 같은 서비스를 다른 주소로 연 것처럼 느껴집니다. Kemono.cr과 Pawchive.pw의 체감 차이는 화면 모양보다 게시물의 최신성과 실제 파일 접근 상태에서 드러납니다. Pawchive 쪽이 더 자주 갱신된다는 이야기가 나오는 것도 이런 맥락이죠. 다만 모든 창작자에게 똑같이 적용되는 법칙은 아니어서, 최신 글을 보는 기준부터 구분하는 편이 정확합니다. 두 [&#8230;]]]></description>
										<content:encoded><![CDATA[<p>두 사이트를 나란히 보면 메뉴 위치와 게시물 카드 배열이 비슷해서 같은 서비스를 다른 주소로 연 것처럼 느껴집니다. Kemono.cr과 Pawchive.pw의 체감 차이는 화면 모양보다 게시물의 최신성과 실제 파일 접근 상태에서 드러납니다. Pawchive 쪽이 더 자주 갱신된다는 이야기가 나오는 것도 이런 맥락이죠. 다만 모든 창작자에게 똑같이 적용되는 법칙은 아니어서, 최신 글을 보는 기준부터 구분하는 편이 정확합니다.</p>
<figure style="text-align:center;margin:0 auto 28px;"><img decoding="async" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" fifu-lazy="1" fifu-data-sizes="auto" fifu-data-srcset="https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/kemonocr-pawchivepw-1.png?ssl=1&w=75&resize=75&ssl=1 75w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/kemonocr-pawchivepw-1.png?ssl=1&w=100&resize=100&ssl=1 100w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/kemonocr-pawchivepw-1.png?ssl=1&w=150&resize=150&ssl=1 150w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/kemonocr-pawchivepw-1.png?ssl=1&w=240&resize=240&ssl=1 240w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/kemonocr-pawchivepw-1.png?ssl=1&w=320&resize=320&ssl=1 320w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/kemonocr-pawchivepw-1.png?ssl=1&w=500&resize=500&ssl=1 500w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/kemonocr-pawchivepw-1.png?ssl=1&w=640&resize=640&ssl=1 640w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/kemonocr-pawchivepw-1.png?ssl=1&w=800&resize=800&ssl=1 800w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/kemonocr-pawchivepw-1.png?ssl=1&w=1024&resize=1024&ssl=1 1024w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/kemonocr-pawchivepw-1.png?ssl=1&w=1280&resize=1280&ssl=1 1280w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/kemonocr-pawchivepw-1.png?ssl=1&w=1600&resize=1600&ssl=1 1600w" fifu-data-src="https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/kemonocr-pawchivepw-1.png?ssl=1" alt="Kemono.cr Pawchive.pw 업데이트 비교" title="Kemono.cr Pawchive.pw 업데이트 비교" style="width:100%;max-width:100%;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,0.15);" loading="lazy"/></figure><div class='code-block code-block-2' style='margin: 8px auto; text-align: center; display: block; clear: both;'>
<!-- 중간 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8940400388075870"
     data-ad-slot="8794586137"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script></div>

<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">두 사이트의 레이아웃이 닮은 이유</h2>

<p><a href="https://pawchive.pw/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Pawchive 공식 첫 화면</a>에는 Kemono를 기반으로 한 공개 아카이브라는 설명이 있습니다. 그래서 창작자 목록과 게시물 검색이라는 기본 구조가 익숙하게 느껴지는 겁니다. 새로운 사이트에 들어갔는데도 메뉴를 다시 공부할 필요가 적다는 점은 편리하네요.</p>
<p>홈 화면에서 확인되는 Pawchive의 주요 콘텐츠 출처는 Patreon, Pixiv Fanbox, Discord입니다. 반면 검색 엔진에 남아 있는 <a href="https://kemono.cr/?lang=en" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Kemono 안내 페이지</a>에는 이보다 여러 플랫폼의 이름이 등장합니다. 이것은 각 사이트가 소개하는 범위의 차이일 뿐, 지금 모든 항목이 정상적으로 수집되거나 열람된다는 보장은 아닙니다.</p>
<p>두 사이트 모두 창작자별 목록과 게시물 중심의 탐색에 초점을 맞춘 아카이브입니다. 눈에 보이는 화면이 닮았다는 사실만으로 게시물 데이터, 파일 저장 상태, 운영 주체까지 똑같다고 생각하면 곤란해요. 화면은 비슷하지만 내부에 쌓여 있는 내용은 별개로 살펴봐야 합니다.</p>
<p></p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">Pawchive가 더 자주 업데이트된다는 느낌의 정체</h2>
<p>후원 플랫폼에서 새 글을 올리는 사람은 원래 창작자입니다. 이런 외부 아카이브에 그 글이 반영되는 과정은 별도이며, Pawchive 역시 기여자가 콘텐츠를 올리고 공유하는 구조라고 소개합니다. 그러니 ‘후원자가 Pawchive에 더 자주 업데이트한다’는 표현보다는 ‘기여자에 의해 아카이브에 반영되는 글이 더 자주 눈에 띈다’고 보는 편이 정확하겠습니다.</p>
<p>저는 이 차이가 레이아웃보다 훨씬 중요하다고 생각해요. 자주 확인하는 창작자가 새 작품을 냈는데 한 사이트의 목록은 오래된 상태라면, 검색 화면이 아무리 편해도 답답할 수밖에 없거든요. 반면 다른 사이트에서 해당 게시물의 반영 기록이 확인된다면 자연스럽게 그쪽을 먼저 열게 됩니다.</p>
<p>하지만 ‘대부분의 창작자가 Pawchive에서 더 빠르다’고 말하려면 같은 창작자들의 게시물과 반영 시각을 여러 차례 비교한 자료가 필요합니다. 그런 전체 통계는 이번 확인에서 찾지 못했습니다. 따라서 Pawchive가 더 낫다는 평가는 일부 창작자와 시점에서 충분히 성립할 수 있는 이용 경험으로 받아들이는 것이 적절해 보여요.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">게시 날짜와 아카이브 반영 날짜는 다릅니다</h2>
<p>글 목록에 날짜가 있다고 해서 그 날짜에 아카이브가 갱신됐다고 보기는 어렵습니다. 원본 플랫폼의 게시 시점, 이후 수정 시점, 아카이브에 나타난 시점이 서로 달라질 수 있거든요. 이 셋을 한꺼번에 ‘업데이트 날짜’라고 부르면 두 사이트를 잘못 비교하기 쉽습니다.</p>
<p>가장 이해하기 쉬운 예를 들어 볼게요. 창작자가 지난달에 올린 글을 누군가 오늘 아카이브에 반영했다면, 원본 게시일은 지난달이고 아카이브에 나타난 시점은 오늘입니다. 목록에 표시된 한 날짜만으로는 무엇이 더 빠른 서비스인지 판단이 어렵겠죠.</p>
<p>비교를 할 때는 같은 창작자와 같은 제목의 공개적으로 확인 가능한 기록을 기준으로 삼는 편이 낫습니다. 다음 항목은 개인적으로도 꼭 구분하고 싶은 부분입니다.</p>
<ul>
<li>원본 게시일과 수정일이 따로 표시되는지</li>
<li>두 아카이브에서 같은 게시물을 찾을 수 있는지</li>
<li>목록에 보이는 글과 실제 열리는 미디어가 일치하는지</li>
<li>반영되지 않은 기간이 특정 창작자에게만 발생했는지</li>
</ul>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">2026년 미디어 서버 상태에서 드러난 차이</h2>
<p>업데이트 빈도와는 별개로 게시물의 이미지나 첨부 파일이 실제 열리는지도 중요합니다. 2026년 9월 27일 공개된 <a href="https://github.com/VoxDroid/KemonoDownloader/releases" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">KemonoDownloader 프로젝트의 릴리스 기록</a>에는 Kemono.cr의 주요 미디어 서버가 간헐적으로 이용 불가능할 수 있고, Pawchive.pw 쪽은 해당 시점에 이용 가능한 것으로 표시돼 있습니다. 다만 이는 제삼자 도구 개발자가 점검한 미디어 서버 상태로, 사이트 전체의 현재 작동 여부를 증명하는 자료는 아닙니다.</p>
<p>이런 차이가 있다면 목록에서 게시물을 찾아도 실제 자료가 열리지 않아 답답한 상황이 생길 수 있겠어요. 그래서 검색 결과의 개수와 미디어 접근 상태를 분리해 보는 것이 좋습니다. 예전에 저장된 항목이 많다는 사실과 지금 정상적으로 표시된다는 사실은 다른 문제니까요.</p>
<p>또 서버 상황은 언제든 바뀔 수 있습니다. 한 날짜의 상태표를 근거로 앞으로도 늘 Pawchive만 정상 작동한다고 결론 내리기는 어렵습니다. 오히려 해당 기록은 ‘레이아웃이 같아도 실제 이용 상태는 다르다’는 점을 잘 보여주는 자료라고 느꼈습니다.</p>
<p></p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">Kemono와 Pawchive 비교표로 보는 선택 기준</h2>
<p>두 사이트 가운데 어느 쪽이 무조건 우수한지를 정하기보다 어떤 기준을 중요하게 보는지가 먼저입니다. 새로운 게시물의 반영 여부가 가장 중요하다면 익숙한 화면보다 현재 갱신되는 목록에 눈길이 갈 수밖에 없어요. 반대로 오래된 자료의 검색 범위는 창작자마다 다른 결과를 보일 수 있습니다.</p>
<div style="overflow-x:auto;">
<table style="width:100%;border-collapse:collapse;margin:18px 0;font-size:15px;">
<thead style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">
<tr>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">비교 항목</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">Kemono.cr</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">Pawchive.pw</th>
</tr>
</thead>
<tbody>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">기본 구조</td>
<td style="border:1px solid #d0d7de;padding:10px;">창작자·게시물 중심 아카이브</td>
<td style="border:1px solid #d0d7de;padding:10px;">Kemono 기반의 유사한 탐색 구조</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">최신 글 반영</td>
<td style="border:1px solid #d0d7de;padding:10px;">창작자별로 확인 필요</td>
<td style="border:1px solid #d0d7de;padding:10px;">빠르다고 느끼는 사례가 있으나 전체 통계 없음</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">소개된 출처</td>
<td style="border:1px solid #d0d7de;padding:10px;">검색에 남은 안내에서 여러 플랫폼 표기</td>
<td style="border:1px solid #d0d7de;padding:10px;">첫 화면에 Patreon·Fanbox·Discord 표기</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">미디어 서버</td>
<td style="border:1px solid #d0d7de;padding:10px;">2026년 9월 27일 외부 점검에서 불안정 표기</td>
<td style="border:1px solid #d0d7de;padding:10px;">같은 날 외부 점검에서 이용 가능 표기</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">이용 시 유의점</td>
<td colspan="2" style="border:1px solid #d0d7de;padding:10px;">게시일·실제 반영·저작권·계정 보안을 별도로 고려</td>
</tr>
</tbody>
</table>
</div>
<p>표를 보면 두 사이트가 닮았다는 첫인상은 맞지만, 무엇을 확인하려는지에 따라 만족도가 달라질 수 있음을 알 수 있습니다. 저는 최신성에 무게를 두는 사람이라면 Pawchive 쪽의 최근 반영 사례가 눈에 들어올 것 같아요. 그렇더라도 빠져 있는 게시물이 없는지는 개별 창작자 단위로 비교해야 합니다.</p>
<p>한 가지 주의할 점도 있습니다. 게시물 수가 많거나 최근 날짜가 표시된다고 해서 원본 플랫폼의 구독 권한과 동일한 이용 권리가 생기는 것은 아닙니다. 창작자를 정식으로 후원하는 방식은 아카이브 탐색과 분리해 생각해야 하겠죠.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">계정 보안과 창작자 권리도 함께 생각할 부분</h2>
<p>Pawchive의 가져오기 안내에는 외부 후원 사이트에서 사용하는 로그인 세션 정보를 제출하는 절차가 설명되어 있습니다. 이 부분은 특히 조심스럽습니다. <a href="https://cheatsheetseries.owasp.org/cheatsheets/Session_Management_Cheat_Sheet.html" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">OWASP의 세션 보안 설명</a>에 따르면 유효한 세션 식별자가 노출되면 계정이 도용될 위험이 있기 때문입니다.</p>
<p>저라면 편의성을 위해 제 로그인 쿠키나 계정 토큰을 제삼자에게 전달하는 선택은 피하겠습니다. 사이트를 둘러보는 일과 개인 계정의 인증 정보를 넘기는 일은 위험 수준이 크게 다르거든요. 브라우저에 수상한 확장 프로그램을 설치하라는 요구가 나와도 출처와 권한부터 신중하게 따져볼 일입니다.</p>
<p>창작물의 권리도 잊기 쉽습니다. <a href="https://www.patreon.com/policy/legal" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Patreon 이용약관</a>은 구매하거나 구독한 회원이라도 창작자가 허락하지 않은 방식으로 작품을 공유할 수 없다고 설명합니다. 다른 곳에서 게시물을 찾을 수 있다는 이유만으로 재배포 권한이 생기지는 않아요. 좋아하는 창작자의 최신 소식과 이용 권한을 가장 정확히 확인하려면 창작자의 공식 페이지가 기준입니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">자주 묻는 질문</h2>
<p><b>Q. Pawchive.pw와 Kemono.cr는 같은 사이트인가요?</b></p>
<p>같은 형태의 아카이브로 보이지만, Pawchive는 자체 소개에서 Kemono 기반 서비스라고 설명합니다. 이름과 화면이 닮아도 게시물 반영 상태까지 동일하다고 단정할 근거는 없습니다.</p>
<p><b>Q. Pawchive가 항상 더 빨리 업데이트되나요?</b></p>
<p>일부 창작자에게는 그렇게 보일 수 있습니다. 다만 모든 창작자를 아우르는 신뢰할 만한 최신 반영 속도 통계를 확인하지 못했으므로 절대적인 우열로 표현하기는 어렵습니다.</p>
<p><b>Q. Kemono에는 예전 게시물이 더 많나요?</b></p>
<p>두 사이트가 소개하는 출처 범위와 누적 데이터가 같지 않을 수 있습니다. 특정 창작자의 오래된 게시물 보유량은 별도로 살펴봐야 하며, 소개 페이지의 플랫폼 수만으로 판단하기는 어렵습니다.</p>
<p><b>Q. 외부 사이트에 후원 계정의 세션 정보를 넣어도 되나요?</b></p>
<p>권하지 않습니다. 세션 정보는 실제 로그인 상태를 유지하는 민감한 자격 정보여서 유출되면 계정 접근 위험이 생길 수 있습니다. 공식 후원 서비스 안에서 계정을 관리하는 편이 안전합니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">출처와 참고한 곳</h2>
<ul>
<li><a href="https://pawchive.pw/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Pawchive</a> — 서비스 기반, 아카이브 설명과 주요 메뉴 확인</li>
<li><a href="https://kemono.cr/?lang=en" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Kemono</a> — 검색에 남은 서비스 소개 및 콘텐츠 출처 비교</li>
<li><a href="https://github.com/VoxDroid/KemonoDownloader/releases" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">KemonoDownloader 릴리스</a> — 2026년 9월 27일의 미디어 서버 상태 참고</li>
<li><a href="https://www.patreon.com/policy/legal" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Patreon 이용약관</a> — 창작자 권리와 공유 범위 확인</li>
<li><a href="https://cheatsheetseries.owasp.org/cheatsheets/Session_Management_Cheat_Sheet.html" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">OWASP 세션 보안 지침</a> — 인증 세션 정보의 노출 위험 확인</li>
</ul>
<style>@keyframes loovShine{0%{background-position:200% 0}100%{background-position:-200% 0}}@keyframes loovGlow{0%,100%{box-shadow:0 2px 8px rgba(26,115,232,.35)}50%{box-shadow:0 2px 16px rgba(109,179,255,.9)}}a.loov-link{animation:loovShine 2.8s linear infinite,loovGlow 2s ease-in-out infinite}a.loov-link:hover{filter:brightness(1.1);transform:translateY(-1px)}@media(prefers-reduced-motion:reduce){a.loov-link{animation:none}}</style>
<h2>함께 읽으면 좋은 글</h2>
<ul>
<li><a href="https://2days.kr/17/10/16/108467/it/program/">AI 홈페이지 애니메이션 효과 9곳 비교와 적용 팁</a></li>
<li><a href="https://2days.kr/15/10/19/108207/it/program/">코덱스 MCP 자동화 도구 5가지 연동 명령어와 발행 전 주의점</a></li>
<li><a href="https://2days.kr/10/11/09/69832/it/program/">X 게시물을 내 노션에 스크랩하는 코드</a></li>
</ul>
<!-- CONTENT END 10 -->
]]></content:encoded>
					
		
		
		<media:content url="https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/kemonocr-pawchivepw-1.png?ssl=1" medium="image"></media:content>
            	</item>
		<item>
		<title>AI 홈페이지 애니메이션 효과 9곳 비교와 적용 팁</title>
		<link>https://2days.kr/17/10/16/108467/it/program/</link>
		
		<dc:creator><![CDATA[Lisa]]></dc:creator>
		<pubDate>Sat, 17 Oct 2026 07:29:22 +0000</pubDate>
				<category><![CDATA[program]]></category>
		<guid isPermaLink="false">https://2days.kr/17/10/16/108467/%eb%af%b8-%eb%b6%84%eb%a5%98/</guid>

					<description><![CDATA[AI로 홈페이지를 만들었는데 어딘가 밋밋하다면, 버튼과 제목이 전부 가만히 있는지 먼저 보세요. AI 홈페이지 애니메이션 효과는 첫 화면의 분위기를 살리는 쉬운 수단이지만, 사이트 전체를 흔들 필요는 없습니다. 저는 메인 헤더에 시선을 끄는 움직임 하나를 두고 아래 영역은 정돈하는 구성을 권합니다. 문제는 효과의 개수보다 어디에 놓느냐에 있거든요. AI 홈페이지가 밋밋해 보일 때 먼저 바꿀 곳 자동 [&#8230;]]]></description>
										<content:encoded><![CDATA[<p>AI로 홈페이지를 만들었는데 어딘가 밋밋하다면, 버튼과 제목이 전부 가만히 있는지 먼저 보세요. AI 홈페이지 애니메이션 효과는 첫 화면의 분위기를 살리는 쉬운 수단이지만, 사이트 전체를 흔들 필요는 없습니다. 저는 메인 헤더에 시선을 끄는 움직임 하나를 두고 아래 영역은 정돈하는 구성을 권합니다. 문제는 효과의 개수보다 어디에 놓느냐에 있거든요.</p>
<figure style="text-align:center;margin:0 auto 28px;"><img decoding="async" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" fifu-lazy="1" fifu-data-sizes="auto" fifu-data-srcset="https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/ai-1-4.png?ssl=1&w=75&resize=75&ssl=1 75w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/ai-1-4.png?ssl=1&w=100&resize=100&ssl=1 100w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/ai-1-4.png?ssl=1&w=150&resize=150&ssl=1 150w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/ai-1-4.png?ssl=1&w=240&resize=240&ssl=1 240w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/ai-1-4.png?ssl=1&w=320&resize=320&ssl=1 320w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/ai-1-4.png?ssl=1&w=500&resize=500&ssl=1 500w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/ai-1-4.png?ssl=1&w=640&resize=640&ssl=1 640w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/ai-1-4.png?ssl=1&w=800&resize=800&ssl=1 800w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/ai-1-4.png?ssl=1&w=1024&resize=1024&ssl=1 1024w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/ai-1-4.png?ssl=1&w=1280&resize=1280&ssl=1 1280w, https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/ai-1-4.png?ssl=1&w=1600&resize=1600&ssl=1 1600w" fifu-data-src="https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/ai-1-4.png?ssl=1" alt="AI 홈페이지 애니메이션 효과 9곳 비교와 적용 팁" title="AI 홈페이지 애니메이션 효과 9곳 비교와 적용 팁" style="width:100%;max-width:100%;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,0.15);" loading="lazy"/></figure><div class='code-block code-block-2' style='margin: 8px auto; text-align: center; display: block; clear: both;'>
<!-- 중간 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8940400388075870"
     data-ad-slot="8794586137"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script></div>

<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">AI 홈페이지가 밋밋해 보일 때 먼저 바꿀 곳</h2>
<p>자동 생성한 랜딩페이지를 열면 커다란 제목, 설명, 버튼, 세 칸짜리 카드가 익숙한 순서로 놓일 때가 많습니다. 그 자체로 나쁜 화면은 아니지만, 마우스를 올려도 반응이 없고 처음 들어왔을 때의 변화도 없다면 평범하게 느껴질 수 있죠. 저는 이때 색상부터 다시 고르기보다는 제목이나 배경의 미세한 움직임을 먼저 살피는 편입니다.</p>
<p>추천하는 위치는 첫 화면의 헤더 영역입니다. 예를 들어 제목은 부드럽게 등장시키고, 배경에는 낮은 대비의 빛 흐름을 주는 식이죠. 작은 상호작용까지 포함해 한 화면에 눈에 띄는 효과를 1~2개 정도로 제한하면 내용을 읽는 데 방해가 덜 됩니다. 이 수치는 공식 디자인 규칙이 아니라 화면을 과하게 꾸미지 않기 위한 제 기준입니다.</p>
<p>반대로 가격표, 긴 설명, 신청 양식에 끊임없이 움직이는 효과를 넣으면 시선이 갈라집니다. 특히 중요한 버튼이 지나치게 튀면 오히려 주변 문구가 묻힐 듯해요. AI 홈페이지 애니메이션 효과를 고를 때도 사용자에게 읽히거나 눌려야 할 요소를 먼저 정하는 편이 훨씬 효율적입니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">애니메이션 효과 사이트 9곳 특징과 무료 이용 비교</h2>
<p>아래 사이트들은 모두 같은 일을 하는 도구가 아닙니다. 리액트 컴포넌트 코드를 가져오는 곳, 디자이너가 만든 화면을 찾는 곳, 코드 없이 그래픽을 편집하는 곳이 섞여 있어요. 현재 작업하는 홈페이지가 리액트 기반인지, 노코드 빌더인지부터 구분하면 헤매는 시간이 줄어듭니다.</p>
<div style="overflow-x:auto;">
<table style="width:100%;border-collapse:collapse;margin:18px 0;font-size:15px;">
<thead style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">
<tr>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">사이트</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">잘 맞는 작업</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">이용할 때 볼 점</th>
</tr>
</thead>
<tbody>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">오리진킷</td>
<td style="border:1px solid #d0d7de;padding:10px;">애니메이션 컴포넌트와 구간</td>
<td style="border:1px solid #d0d7de;padding:10px;">무료 복사·AI 이용량 제한</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">리액트 비츠</td>
<td style="border:1px solid #d0d7de;padding:10px;">움직이는 제목과 배경</td>
<td style="border:1px solid #d0d7de;padding:10px;">리액트 코드 적용 필요</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">매직 UI</td>
<td style="border:1px solid #d0d7de;padding:10px;">랜딩페이지용 강조 효과</td>
<td style="border:1px solid #d0d7de;padding:10px;">무료 오픈소스와 별도 상품 구분</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">애서터니티 UI</td>
<td style="border:1px solid #d0d7de;padding:10px;">히어로·카드·3차원 효과</td>
<td style="border:1px solid #d0d7de;padding:10px;">무료 컴포넌트와 유료 블록 구분</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">21st.dev</td>
<td style="border:1px solid #d0d7de;padding:10px;">디자이너별 화면 탐색</td>
<td style="border:1px solid #d0d7de;padding:10px;">무료 열람과 복사 횟수 구분</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">애니마타</td>
<td style="border:1px solid #d0d7de;padding:10px;">텍스트·버튼·위젯</td>
<td style="border:1px solid #d0d7de;padding:10px;">코드 복사 후 스타일 조절</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">모션 프리미티브</td>
<td style="border:1px solid #d0d7de;padding:10px;">제품 화면의 섬세한 전환</td>
<td style="border:1px solid #d0d7de;padding:10px;">모션·테일윈드 기반</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">스키퍼 UI</td>
<td style="border:1px solid #d0d7de;padding:10px;">드래그·스크롤 등 독특한 효과</td>
<td style="border:1px solid #d0d7de;padding:10px;">일부 유료, 무료판 출처 표기 조건</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">유니콘 스튜디오</td>
<td style="border:1px solid #d0d7de;padding:10px;">코드 없는 인터랙티브 그래픽</td>
<td style="border:1px solid #d0d7de;padding:10px;">내보내기·게시 조건 확인</td>
</tr>
</tbody>
</table>
</div>
<p>2026년 10월 공식 사이트에 표시된 규모를 보면, 애서터니티 UI의 200개 이상은 컴포넌트뿐 아니라 블록과 템플릿을 합친 표현입니다. 21st.dev의 1만 2천 개 이상도 리액트 구성요소, 템플릿, 테마를 포함한 수치예요. 애니마타는 156개 이상의 애니메이션 컴포넌트를 안내하고 있습니다. 숫자만 비교하기보다 무료로 실제 적용할 수 있는 항목이 무엇인지 보는 게 낫겠습니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">오리진킷과 리액트 비츠, 매직 UI 활용법</h2>
<p><a href="https://www.originkit.dev/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">오리진킷 공식 사이트</a>는 움직이는 컴포넌트와 구간을 찾아 원하는 홈페이지 분위기에 맞게 가져오는 출발점으로 좋습니다. 미리보기에서 효과를 고르고 복사한 자료를 클로드 코드 같은 코딩 도우미에 전달하는 흐름을 생각하면 편해요. 다만 무료 이용에는 AI 크레딧과 복사 횟수 제한이 있으니 여러 후보를 한꺼번에 가져오려면 이용 조건을 살피는 게 좋겠죠.</p>
<p><a href="https://www.reactbits.dev/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">리액트 비츠</a>는 타이핑되는 글자, 반응하는 텍스트, 입자나 파동 느낌의 배경을 찾을 때 특히 눈에 들어옵니다. 자바스크립트와 타입스크립트, 일반 CSS와 테일윈드 선택지를 제공하고 소스 복사나 설치 방식도 안내해요. 설명이 많은 기업 소개 페이지라면 배경보다 첫 문장의 등장 효과 하나부터 적용하는 편을 추천합니다.</p>
<p><a href="https://magicui.design/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">매직 UI</a>는 랜딩페이지의 버튼, 글자, 빛 효과에 힘을 주고 싶을 때 어울립니다. 공식 사이트는 무료 오픈소스 애니메이션 컴포넌트를 안내하며 별도의 유료 템플릿 상품도 소개하죠. 효과를 붙인 뒤 버튼의 목적과 대비가 흐려지지 않는지 확인하면 더 좋은 화면이 됩니다. 번쩍이는 장식보다 사용자가 누를 이유가 선명한 버튼이 오래 남는 법이니까요.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">애서터니티 UI와 21st.dev, 애니마타를 고르는 기준</h2>
<p><a href="https://ui.aceternity.com/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">애서터니티 UI</a>는 메인 헤더, 카드, 스크롤 반응, 배경 효과를 폭넓게 고를 수 있는 라이브러리입니다. 무료 컴포넌트도 있지만 완성된 블록이나 템플릿 일부는 별도 접근이 필요합니다. 화면 전체 구성을 빨리 잡으려는 작업이라면 단일 애니메이션보다 완성형 구간을 먼저 살펴보는 것도 방법입니다.</p>
<p></p>
<p><a href="https://21st.dev/community/components" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">21st.dev 구성요소 모음</a>은 한 제작자의 취향에 갇히지 않고 다양한 디자인을 비교할 때 유용합니다. 공식 소개에서는 컴포넌트의 프롬프트를 복사해 클로드 코드나 다른 AI 제작 도구에 적용하는 흐름을 보여줍니다. 전체 열람이 무료인 것과 무제한 복사가 무료인 것은 다르니, 마음에 드는 후보를 먼저 추리는 게 좋습니다.</p>
<p><a href="https://animata.design/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">애니마타</a>는 단순한 장식뿐 아니라 텍스트, 버튼, 탭, 위젯 같은 실제 인터페이스 요소를 폭넓게 제공합니다. 무료 오픈소스라고 안내하는 점이 반갑네요. 거대한 배경보다 작은 버튼 피드백이 필요한 서비스 화면이라면 이쪽에서 답을 찾기 쉬울 것 같습니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">모션 프리미티브와 스키퍼 UI, 유니콘 스튜디오의 차이</h2>
<p><a href="https://motion-primitives.com/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">모션 프리미티브</a>는 모션과 테일윈드 기반의 재사용 가능한 움직임 요소를 다룹니다. 카드가 나타나거나 화면이 전환될 때 너무 극적인 연출 대신 섬세한 반응을 주고 싶은 경우에 적합하겠죠. 개발자가 기존 디자인 시스템 안으로 가져와 세부 값을 조절하기 좋은 방향입니다.</p>
<p><a href="https://www.skiper-ui.com/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">스키퍼 UI</a>는 흔한 카드 효과에서 벗어나 드래그, 이미지 반응, 스크롤 연출을 찾을 때 둘러볼 만합니다. 공식 문서에는 무료와 유료 구성요소가 섞여 있고, 무료 버전 이용 시 출처 표기 조건도 안내되어 있습니다. 상업용 페이지라면 단순히 복사가 되느냐보다 사용 조건부터 읽어야 마음이 편하겠네요.</p>
<p><a href="https://www.unicorn.studio/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">유니콘 스튜디오</a>는 코드를 직접 작성하는 대신 시각적 편집 화면에서 인터랙티브 그래픽과 움직이는 배경을 구성하는 도구입니다. 리액트 개발이 부담스러운 디자이너에게 특히 관심이 갈 만하죠. 다만 복잡한 시각 효과는 기기 성능에 영향을 줄 수 있어 모바일 화면을 실제로 열어 보는 과정이 필요합니다.</p>
<p></p>
<p>두 예시 화면처럼 첫 화면의 시각적 포인트는 선명하게 두되, 주변 문구와 하단 안내는 읽기 편하게 남겨 두는 쪽이 제 취향입니다. 홈페이지가 전시 작품이라면 화려함에 더 투자하겠지만, 상담 신청이나 상품 소개가 목표라면 이야기가 달라집니다. 클릭보다 먼저 읽혀야 할 내용이 있으니까요.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">클로드 코드에 적용하는 순서와 모바일 성능 점검</h2>
<p>처음부터 여러 사이트에서 효과를 섞으면 스타일 충돌이나 라이브러리 중복이 생길 수 있습니다. 저는 제목 등장 효과 하나를 먼저 적용하고 화면을 확인한 뒤, 배경을 추가할지 결정하는 순서가 실용적이라고 봅니다. 실제로 코드를 붙여 넣기 전에 홈페이지의 프레임워크와 기존 스타일 방식을 먼저 알려 주면 수정 범위도 좁힐 수 있죠.</p>
<ol>
<li>먼저 메인 헤더에서 움직일 요소를 하나 정합니다. 제목, 배경, 버튼 가운데 우선순위가 가장 높은 것을 고릅니다.</li>
<li>사이트 미리보기에서 후보를 고른 다음 코드 또는 프롬프트를 복사합니다. 사용하는 서비스의 무료·유료 표시도 함께 읽습니다.</li>
<li>클로드 코드에 현재 프로젝트 구조를 설명하고 기존 글자·색상·버튼 동작을 유지한 채 해당 효과만 적용하도록 요청합니다.</li>
<li>데스크톱과 모바일에서 재생 속도, 글자 대비, 버튼 클릭, 스크롤 끊김을 확인합니다. 문제가 생기면 효과 강도를 낮추거나 제거합니다.</li>
</ol>
<p>예를 들어 요청은 이렇게 구체적인 편이 낫습니다. ‘기존 메인 헤더의 문구와 링크를 유지하고 제목에만 부드러운 등장 애니메이션을 추가해 줘. 작은 화면과 움직임 줄이기 설정에서는 효과를 최소화하고, 다른 구간의 스타일은 변경하지 마.’ 이 정도만 지정해도 페이지 전체가 의도치 않게 바뀌는 상황을 줄이는 데 도움이 됩니다.</p>
<p>접근성도 빼놓을 수 없습니다. 운영체제에서 움직임 줄이기를 선택한 사람에게는 CSS의 <a href="https://developer.mozilla.org/ko/docs/Web/CSS/Guides/Media_queries/Using_for_accessibility" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">prefers-reduced-motion 안내</a>처럼 불필요한 애니메이션을 줄이거나 꺼 주는 방식이 있습니다. 자동 재생되는 큰 배경이 불편한 사람도 있거든요. 움직임이 없어도 제목과 버튼, 서비스 설명은 온전히 보이는 상태를 목표로 삼으면 좋겠습니다.</p>
<p>AI 홈페이지 애니메이션 효과를 적용하고 나면 휴대전화로 직접 페이지를 열고 글자가 늦게 뜨는지, 스크롤이 버벅이는지, 처음에 빈 화면이 오래 보이는지를 살펴보세요. 마음에 드는 효과라고 무조건 남기지 않는 결단도 필요합니다. 저는 히어로의 고품질 효과 하나와 나머지의 깔끔한 구성이 가장 무난한 출발점이라고 생각합니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">자주 묻는 질문</h2>
<p><b>Q. 코딩을 몰라도 애니메이션을 만들 수 있나요?</b></p>
<p>유니콘 스튜디오처럼 시각적 편집에 중심을 둔 도구부터 살펴보세요. 반면 리액트 컴포넌트 라이브러리는 코드를 프로젝트에 적용하는 과정이 필요합니다.</p>
<p><b>Q. 오리진킷과 21st.dev 중 어디부터 볼까요?</b></p>
<p>움직이는 개별 효과를 찾는다면 오리진킷을, 여러 디자이너의 화면 구성과 프롬프트를 폭넓게 비교하고 싶다면 21st.dev를 먼저 권합니다.</p>
<p><b>Q. 무료 사이트의 구성요소는 전부 상업적으로 쓸 수 있나요?</b></p>
<p>그렇지는 않습니다. 서비스와 개별 구성요소마다 이용 조건이 다를 수 있고, 스키퍼 UI의 무료판처럼 출처 표기 조건이 있는 경우도 있습니다.</p>
<p><b>Q. 움직이는 배경을 넣으면 홈페이지가 느려지나요?</b></p>
<p>사용한 그래픽의 복잡도와 기기 성능에 따라 달라집니다. 특히 모바일에서 확인하고 필요하면 가벼운 효과로 바꾸는 편이 좋겠습니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">출처와 참고한 곳</h2>
<ul>
<li><a href="https://www.originkit.dev/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">오리진킷</a> — 애니메이션 컴포넌트와 이용 방식.</li>
<li><a href="https://www.reactbits.dev/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">리액트 비츠</a> — 텍스트와 배경 애니메이션 분류.</li>
<li><a href="https://magicui.design/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">매직 UI</a> — 오픈소스 컴포넌트와 랜딩페이지 효과.</li>
<li><a href="https://ui.aceternity.com/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">애서터니티 UI</a> — 무료 구성요소 및 블록·템플릿 구분.</li>
<li><a href="https://21st.dev/community/components" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">21st.dev</a> — 커뮤니티 구성요소와 사용 범위.</li>
<li><a href="https://animata.design/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">애니마타</a> — 무료 애니메이션 컴포넌트 목록.</li>
<li><a href="https://motion-primitives.com/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">모션 프리미티브</a> — 애니메이션 UI 키트 소개.</li>
<li><a href="https://www.skiper-ui.com/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">스키퍼 UI</a> — 구성요소 및 이용 조건.</li>
<li><a href="https://www.unicorn.studio/" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">유니콘 스튜디오</a> — 시각적 인터랙티브 그래픽 편집 도구.</li>
<li><a href="https://developer.mozilla.org/ko/docs/Web/CSS/Guides/Media_queries/Using_for_accessibility" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">엠디엔 웹 문서</a> — 움직임 줄이기 접근성 설정.</li>
</ul>
<style>@keyframes loovShine{0%{background-position:200% 0}100%{background-position:-200% 0}}@keyframes loovGlow{0%,100%{box-shadow:0 2px 8px rgba(26,115,232,.35)}50%{box-shadow:0 2px 16px rgba(109,179,255,.9)}}a.loov-link{animation:loovShine 2.8s linear infinite,loovGlow 2s ease-in-out infinite}a.loov-link:hover{filter:brightness(1.1);transform:translateY(-1px)}@media(prefers-reduced-motion:reduce){a.loov-link{animation:none}}</style>
<h2>함께 읽으면 좋은 글</h2>
<ul>
<li><a href="https://2days.kr/15/10/19/108207/it/program/">코덱스 MCP 자동화 도구 5가지 연동 명령어와 발행 전 주의점</a></li>
<li><a href="https://2days.kr/10/11/09/69832/it/program/">X 게시물을 내 노션에 스크랩하는 코드</a></li>
<li><a href="https://2days.kr/17/07/11/64708/it/program/">2025년 원스트라이크 아웃제도 전면 시행! 자본시장에 닥친 경고</a></li>
</ul>
<!-- CONTENT END 12 -->
]]></content:encoded>
					
		
		
		<media:content url="https://i3.wp.com/2days.kr/wp-content/uploads/2026/10/ai-1-4.png?ssl=1" medium="image"></media:content>
            	</item>
		<item>
		<title>코덱스 MCP 자동화 도구 5가지 연동 명령어와 발행 전 주의점</title>
		<link>https://2days.kr/15/10/19/108207/it/program/</link>
		
		<dc:creator><![CDATA[Lisa]]></dc:creator>
		<pubDate>Thu, 15 Oct 2026 10:48:07 +0000</pubDate>
				<category><![CDATA[program]]></category>
		<guid isPermaLink="false">https://2days.kr/15/10/19/108207/%eb%af%b8-%eb%b6%84%eb%a5%98/</guid>

					<description><![CDATA[클로드 코드에서 쓰던 자동화 도구를 코덱스에서도 쓸 수 있느냐는 질문이 자주 나옵니다. 답은 대부분 가능하다는 겁니다. 코덱스 MCP 자동화는 외부 서비스의 도구를 연결해 글 발행, 소셜 예약, 웹 탐색, 영상 생성을 한 작업 흐름으로 묶는 방식입니다. 다만 다섯 가지를 무조건 똑같은 MCP 명령어로 설치하면 한 군데에서 막힙니다. 리모션은 지금 별도 플러그인과 스킬을 권장하거든요. 무엇을 연결할지 [&#8230;]]]></description>
										<content:encoded><![CDATA[<p>클로드 코드에서 쓰던 자동화 도구를 코덱스에서도 쓸 수 있느냐는 질문이 자주 나옵니다. 답은 대부분 가능하다는 겁니다. 코덱스 MCP 자동화는 외부 서비스의 도구를 연결해 글 발행, 소셜 예약, 웹 탐색, 영상 생성을 한 작업 흐름으로 묶는 방식입니다. 다만 다섯 가지를 무조건 똑같은 MCP 명령어로 설치하면 한 군데에서 막힙니다. 리모션은 지금 별도 플러그인과 스킬을 권장하거든요.</p>
<p>무엇을 연결할지 고민된다면 리모션, 업리카, Zernio, 크롬 DevTools MCP, 힉스필드를 먼저 구분해 두면 됩니다. 단순한 이름 목록보다 실제 설정 명령어와 각 도구가 하지 못하는 일을 함께 아는 편이 시간을 아껴 줍니다.</p>
<figure style="text-align:center;margin:0 auto 28px;"><img decoding="async" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" fifu-lazy="1" fifu-data-sizes="auto" fifu-data-srcset="https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/mcp-1.png?ssl=1&w=75&resize=75&ssl=1 75w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/mcp-1.png?ssl=1&w=100&resize=100&ssl=1 100w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/mcp-1.png?ssl=1&w=150&resize=150&ssl=1 150w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/mcp-1.png?ssl=1&w=240&resize=240&ssl=1 240w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/mcp-1.png?ssl=1&w=320&resize=320&ssl=1 320w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/mcp-1.png?ssl=1&w=500&resize=500&ssl=1 500w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/mcp-1.png?ssl=1&w=640&resize=640&ssl=1 640w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/mcp-1.png?ssl=1&w=800&resize=800&ssl=1 800w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/mcp-1.png?ssl=1&w=1024&resize=1024&ssl=1 1024w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/mcp-1.png?ssl=1&w=1280&resize=1280&ssl=1 1280w, https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/mcp-1.png?ssl=1&w=1600&resize=1600&ssl=1 1600w" fifu-data-src="https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/mcp-1.png?ssl=1" alt="코덱스 MCP 자동화 도구 5가지 연동 명령어와 발행 전 주의점" title="코덱스 MCP 자동화 도구 5가지 연동 명령어와 발행 전 주의점" style="width:100%;max-width:100%;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,0.15);" loading="lazy"/></figure><div class='code-block code-block-2' style='margin: 8px auto; text-align: center; display: block; clear: both;'>
<!-- 중간 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8940400388075870"
     data-ad-slot="8794586137"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script></div>

<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">코덱스 자동화에 붙일 도구 5가지, 역할부터 구분하기</h2>
<p>도구를 많이 붙인다고 자동화가 좋아지는 건 아닙니다. 무엇을 만드는지, 어디에 올리는지, 사이트를 직접 열어야 하는지에 따라 담당을 나눠야 합니다. 서로 비슷해 보이는 업리카와 Zernio도 운영하는 채널과 필요한 기능에 따라 선택이 갈립니다.</p>
<div style="overflow-x:auto;">
<table style="width:100%;border-collapse:collapse;margin:18px 0;font-size:15px;">
<thead style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">
<tr>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">도구</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">가장 잘 맞는 일</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">코덱스 연결 방식</th>
<th style="border:1px solid #d0d7de;padding:10px;background:#eaf2ff;text-align:left;">구분할 점</th>
</tr>
</thead>
<tbody>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">리모션(Remotion)</td>
<td style="border:1px solid #d0d7de;padding:10px;">코드로 모션 그래픽·영상 제작</td>
<td style="border:1px solid #d0d7de;padding:10px;">공식 플러그인·에이전트 스킬</td>
<td style="border:1px solid #d0d7de;padding:10px;">기존 공식 MCP는 사용 중단 권고</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">업리카(uplika)</td>
<td style="border:1px solid #d0d7de;padding:10px;">네이버 블로그 등 여러 채널 발행, 발행 기록·노출 확인</td>
<td style="border:1px solid #d0d7de;padding:10px;">원격 MCP</td>
<td style="border:1px solid #d0d7de;padding:10px;">채널 연결·승인이 먼저 필요</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">Zernio</td>
<td style="border:1px solid #d0d7de;padding:10px;">쓰레드 예약 게시, 댓글 대응, 지원 플랫폼 메시지 관리</td>
<td style="border:1px solid #d0d7de;padding:10px;">원격 MCP</td>
<td style="border:1px solid #d0d7de;padding:10px;">쓰레드 DM은 지원하지 않음</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">크롬 DevTools MCP</td>
<td style="border:1px solid #d0d7de;padding:10px;">사이트 탐색·화면 확인·반복 브라우저 조작</td>
<td style="border:1px solid #d0d7de;padding:10px;">로컬 MCP</td>
<td style="border:1px solid #d0d7de;padding:10px;">로그인 세션과 접근 권한에 주의</td>
</tr>
<tr>
<td style="border:1px solid #d0d7de;padding:10px;">힉스필드(Higgsfield)</td>
<td style="border:1px solid #d0d7de;padding:10px;">AI 이미지·짧은 영상 생성</td>
<td style="border:1px solid #d0d7de;padding:10px;">원격 MCP</td>
<td style="border:1px solid #d0d7de;padding:10px;">모델별 이용 조건·생성 비용 확인</td>
</tr>
</tbody>
</table>
</div>
<p>여기서 핵심은 MCP와 스킬의 차이입니다. MCP는 코덱스가 외부 도구를 호출하게 해 주는 연결 통로이고, 스킬은 작업 순서와 작성 요령을 알려 주는 지침입니다. 같은 자동화 흐름에서 함께 쓸 수 있지만 같은 설치 방식은 아닙니다.</p>
<p></p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">모션 그래픽은 리모션, AI 영상과 이미지는 힉스필드</h2>
<p>리모션은 자막이 움직이거나 숫자가 변화하는 영상, 반복적으로 바뀌는 상품 소개 영상에 어울립니다. 장면의 길이와 움직임을 코드로 제어하므로 같은 템플릿에서 상품명이나 가격만 바꾼 버전을 만들기 좋습니다. 영상에 글자와 그래프를 정확히 맞춰야 하는 작업에 특히 유용합니다.</p>
<p>2026년 10월 기준 설치에서 헷갈리기 쉬운 부분이 있습니다. <a href="https://www.remotion.dev/docs/ai/mcp" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">리모션 공식 문서</a>는 과거의 호스팅 MCP를 더 이상 권장하지 않고, 에이전트 스킬로 옮기라고 안내합니다. 코덱스에서는 <a href="https://www.remotion.dev/docs/ai/codex-plugin" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">리모션 공식 코덱스 플러그인</a>을 쓰거나 리모션 프로젝트에서 <code>npx remotion skills add</code>를 실행하는 쪽이 현재 문서에 맞는 접근입니다. 따라서 &#8216;다섯 개 모두 MCP 주소 한 줄&#8217;이라는 설명은 리모션에 한해서 수정해야 정확합니다.</p>
<p>힉스필드는 반대로 생성형 이미지와 영상에 초점을 둡니다. 제품 콘셉트 컷이나 짧은 광고 장면을 텍스트 지시로 만들 때 맡기고, 완성된 자산을 리모션 프로젝트에 가져와 자막과 타이밍을 조합하는 식으로 이어 붙일 수 있습니다. <a href="https://higgsfield.ai/mcp" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">힉스필드 공식 MCP 페이지</a>에 원격 서버 주소가 공개되어 있으며, 계정 인증과 생성 가능한 모델·크레딧 조건은 서비스 화면을 따릅니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">블로그 발행은 업리카, 쓰레드 예약과 댓글은 Zernio</h2>
<p>업리카는 네이버 블로그, 쓰레드, 인스타그램, 유튜브 등 여러 채널에 콘텐츠를 보내는 기능을 제공합니다. 연결된 계정을 골라 발행하고 발행 기록을 읽는 작업에 맞습니다. 네이버 블로그의 공개 글과 검색 노출을 진단하는 관련 기능도 제공하지만, 이것을 네이버 관리자 화면의 모든 비공개 방문자 통계를 가져온다는 뜻으로 받아들이면 안 됩니다. 어떤 통계를 쓸 수 있는지는 <a href="https://uplika.com/ko/docs/posts" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">업리카 공식 발행·분석 문서</a>의 항목별 설명으로 구분할 수 있습니다.</p>
<p>Zernio는 쓰레드 게시물 예약, 댓글 조회·답글, 성과 확인이 필요한 운영자에게 적합합니다. 하나의 계정에서 여러 소셜 플랫폼을 관리하고, 지원되는 서비스에서는 메시지 관리까지 연결합니다. 다만 &#8216;쓰레드 예약·댓글·DM&#8217;을 한 묶음으로 이해하면 곤란합니다. <a href="https://docs.zernio.com/platforms/threads" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Zernio 쓰레드 문서</a>에는 쓰레드 댓글 관련 기능은 있지만 쓰레드 DM 기능은 없다고 명시되어 있습니다. DM 자동화는 인스타그램처럼 해당 메시지 기능을 지원하는 플랫폼에서 따로 판단해야 합니다.</p>
<p>둘 다 발행을 지원하므로 처음부터 함께 연결할 필요는 없습니다. 네이버 블로그 중심이라면 업리카부터, 소셜 예약과 반응 관리가 핵심이라면 Zernio부터 선택하는 편이 설정도 간단합니다. 게시할 채널이 겹친다면 어느 서비스가 최종 발행하는지 하나로 정해야 중복 업로드를 피할 수 있습니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">브라우저 벤치마킹과 업로드는 크롬 DevTools MCP</h2>
<p>외부 서비스가 공식 발행 API를 제공하지 않거나 사람이 보는 실제 화면을 확인해야 할 때는 브라우저 제어 도구가 필요합니다. 크롬 DevTools MCP를 연결하면 코덱스가 페이지를 열고 요소를 살펴보며 버튼을 누르고 결과를 확인하도록 도울 수 있습니다. 경쟁 사이트의 공개 페이지를 비교하거나, 작성한 랜딩 페이지가 모바일 화면에서 깨지는지 살펴보는 데도 쓸 수 있죠.</p>
<p>단, 브라우저를 조종할 수 있다는 말이 모든 사이트의 업로드를 보장한다는 뜻은 아닙니다. 로그인 방식, 파일 선택 창, CAPTCHA, 서비스 약관과 브라우저 권한에 따라 사람이 직접 마무리해야 하는 단계가 생길 수 있습니다. <a href="https://developer.chrome.com/docs/devtools/agents/get-started" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">크롬 공식 설치 문서</a>는 브라우저에 로그인된 계정과 열려 있는 내용을 에이전트가 읽고 조작할 수 있다는 보안 주의사항도 안내합니다.</p>
<p>그래서 브라우저 벤치마킹은 공개 화면에서 시작하고, 실제 계정이 연결된 탭에서는 수정·삭제·결제·발행을 승인 없이 수행하지 않는 편이 좋습니다. 발행 API가 있는 곳은 업리카나 Zernio로 보내고, 크롬은 화면 확인과 예외 작업에 쓰면 운영 위험을 줄일 수 있습니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">코덱스 MCP 서버 연결 명령어와 설정 확인 순서</h2>
<p>코덱스 MCP 자동화를 준비할 때는 서버의 연결 방식부터 구분해야 합니다. 코덱스는 로컬 실행형 MCP와 인터넷 주소를 사용하는 원격 MCP를 모두 지원합니다. 기본 설정은 <code>~/.codex/config.toml</code>에 저장되며 CLI와 같은 환경의 IDE 확장에서 공유합니다. 다음 명령어는 각 서비스의 공식 문서에 기재된 서버 주소 또는 설치 명령을 바탕으로 한 예시입니다.</p>
<pre><code>codex mcp add uplika --url https://api.uplika.com/mcp
codex mcp add zernio --url https://mcp.zernio.com/mcp
codex mcp add chrome-devtools -- npx chrome-devtools-mcp@latest
codex mcp add higgsfield --url https://mcp.higgsfield.ai/mcp
codex mcp list</code></pre>
<p>한 번에 붙여넣기 전에 <code>codex</code> 명령이 설치되어 있는지, 크롬 MCP를 위한 Node.js와 <code>npx</code>를 실행할 수 있는지 확인합니다. 원격 MCP에는 서비스 계정 인증이 별도로 필요합니다. 업리카와 Zernio는 계정 연결 후 브라우저 승인 절차를 거치고, 인증 창이 열리지 않으면 <code>codex mcp login uplika</code> 또는 <code>codex mcp login zernio</code>로 다시 시도할 수 있습니다.</p>
<p>리모션은 위 목록에 억지로 넣지 않습니다. 리모션 프로젝트에서 <code>npx remotion skills add</code>를 실행하거나 코덱스의 리모션 플러그인을 선택합니다. 설정이 끝났으면 <code>codex mcp list</code>로 등록 상태를 보고, 코덱스 대화 안에서 실제 읽기 전용 도구 하나를 호출해 연결을 시험해 보는 게 안전합니다. 더 자세한 설정 구조는 <a href="https://learn.chatgpt.com/docs/extend/mcp?surface=cli" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">코덱스 공식 MCP 안내</a>에 있습니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">다섯 도구를 연결해 콘텐츠 한 편 만드는 실제 작업 흐름</h2>
<p>가령 새 서비스 소개 글과 짧은 홍보 영상을 함께 준비한다고 생각해 봅시다. 먼저 크롬으로 공개 경쟁 페이지의 구성과 표현을 살펴본 뒤, 확인된 사실만 추려 블로그 초안을 만듭니다. 힉스필드로 필요한 시각 자료를 생성하고 리모션으로 움직이는 자막과 장면 전환을 구성하면 각 도구가 하는 일이 분명해집니다.</p>
<p>그다음 업리카에 블로그용 글을 초안 상태로 준비하고, Zernio에는 쓰레드에 올릴 짧은 소개 문구와 예약 일정을 넘깁니다. 이때 같은 콘텐츠를 두 곳에서 동시에 발행하도록 지시하지 않습니다. 초안과 예약 내용을 사람이 먼저 확인한 뒤 승인된 계정에만 올리고, 게시가 끝나면 실제 게시물 주소와 실패 여부를 확인합니다.</p>
<p>처음 요청할 때도 &#8216;모든 걸 알아서 올려&#8217;보다 &#8216;자료 조사와 초안까지만 진행하고, 외부 공개 전에 제목·이미지·채널·예약 시각을 보여 줘&#8217;라고 말하는 쪽이 낫습니다. 작업이 길어져도 마지막 통제 지점이 명확하기 때문입니다.</p>
<p></p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">연결은 됐는데 자동화가 실패할 때 확인할 항목</h2>
<p>코덱스 MCP 자동화에서 제일 흔한 문제는 등록과 사용 가능 상태를 혼동하는 겁니다. <code>codex mcp list</code>에 이름이 뜬다고 해서 서비스 계정 로그인, 채널 선택, 권한 승인이 끝난 건 아닙니다. 읽기 전용 조회가 되는지부터 시험한 뒤 발행 권한으로 넘어가세요.</p>
<ul>
<li>계정 목록이 비어 있다면 연결할 채널을 먼저 선택했는지 살핍니다.</li>
<li>게시가 실패하면 채널별 글자 수와 이미지·영상 규격을 비교합니다.</li>
<li>쓰레드 DM 지시가 안 되면 지원하지 않는 기능을 호출한 것은 아닌지 구분합니다.</li>
<li>크롬이 로그인된 페이지를 읽는다면 민감한 탭과 개인 정보를 노출하지 않았는지 점검합니다.</li>
<li>영상 생성 요청이 멈추면 생성 크레딧, 모델 접근 권한, 작업 완료 상태를 각각 봅니다.</li>
<li>도구가 등록되어도 사용되지 않으면 새 코덱스 세션에서 목록을 확인하고 해당 도구를 명시해 시험합니다.</li>
</ul>
<p>마지막으로 발행된 결과만 성공으로 기록해야 합니다. 예약 요청 성공과 실제 게시 완료는 다른 상태이고, AI가 성공했다고 말하더라도 플랫폼에서 반환된 게시물 ID나 주소가 있는지 확인하는 것이 좋습니다. 외부로 나가는 작업은 자동화하되 마지막 승인과 검증은 남겨 두는 구조가 안정적입니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">자주 묻는 질문</h2>
<p><b>Q. 클로드 코드 MCP를 코덱스에서도 그대로 쓸 수 있나요?</b></p>
<p>표준 MCP 서버를 제공하고 코덱스가 지원하는 연결 방식이라면 대부분 가능합니다. 다만 클라이언트별 설정 파일과 설치 명령어는 서로 다르고 서비스별 인증도 따로 합니다.</p>
<p><b>Q. 리모션도 코덱스 MCP 명령어 한 줄로 설치하나요?</b></p>
<p>리모션의 기존 공식 MCP는 사용 중단 대상으로 안내됩니다. 현재 공식 문서에 맞춰 코덱스 플러그인 또는 리모션 에이전트 스킬을 쓰는 편이 좋습니다.</p>
<p><b>Q. Zernio로 쓰레드 DM을 자동 발송할 수 있나요?</b></p>
<p>아니요. 공식 문서상 쓰레드는 댓글 답글 등을 지원하지만 DM은 지원하지 않습니다. 인스타그램 같은 다른 플랫폼의 메시지 기능과 구별해야 합니다.</p>
<p><b>Q. 업리카와 Zernio를 둘 다 설치해야 하나요?</b></p>
<p>필수는 아닙니다. 블로그 중심인지 소셜 예약·댓글 중심인지에 맞춰 하나부터 연결하고, 실제로 필요한 기능이 생겼을 때 추가해도 충분합니다.</p>
<h2 style="font-size:22px;color:#1a73e8;margin:34px 0 12px;font-weight:bold;" data-ke-size="size26">출처와 참고한 곳</h2>
<ul>
<li><a href="https://learn.chatgpt.com/docs/extend/mcp?surface=cli" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">OpenAI 코덱스 MCP 문서</a> — 설정 위치, 설치 명령과 인증 방식</li>
<li><a href="https://www.remotion.dev/docs/ai/codex-plugin" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Remotion 코덱스 플러그인 문서</a> 및 <a href="https://www.remotion.dev/docs/ai/mcp" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">기존 MCP 안내</a> — 공식 권장 방식과 사용 중단 사실</li>
<li><a href="https://uplika.com/ko/docs" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">업리카 MCP 연결 안내</a> — 서버 주소와 채널 승인</li>
<li><a href="https://docs.zernio.com/platforms/threads" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Zernio 쓰레드 기능 안내</a> — 게시물·댓글·DM 지원 범위</li>
<li><a href="https://developer.chrome.com/docs/devtools/agents/get-started" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Chrome DevTools MCP 시작 안내</a> — 설치 명령과 브라우저 접근 주의사항</li>
<li><a href="https://higgsfield.ai/mcp" class="loov-link" target="_blank" rel="noopener noreferrer" style="display:inline-block;padding:3px 12px;margin:0 2px;border-radius:999px;background:linear-gradient(110deg,#1a73e8 30%,#6db3ff 50%,#1a73e8 70%);background-size:200% 100%;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(26,115,232,.45);">Higgsfield MCP 안내</a> — 이미지·영상 생성용 원격 서버 주소</li>
</ul>
<style>@keyframes loovShine{0%{background-position:200% 0}100%{background-position:-200% 0}}@keyframes loovGlow{0%,100%{box-shadow:0 2px 8px rgba(26,115,232,.35)}50%{box-shadow:0 2px 16px rgba(109,179,255,.9)}}a.loov-link{animation:loovShine 2.8s linear infinite,loovGlow 2s ease-in-out infinite}a.loov-link:hover{filter:brightness(1.1);transform:translateY(-1px)}@media(prefers-reduced-motion:reduce){a.loov-link{animation:none}}</style>
<h2>함께 읽으면 좋은 글</h2>
<ul>
<li><a href="https://2days.kr/10/11/09/69832/it/program/">X 게시물을 내 노션에 스크랩하는 코드</a></li>
<li><a href="https://2days.kr/17/07/11/64708/it/program/">2025년 원스트라이크 아웃제도 전면 시행! 자본시장에 닥친 경고</a></li>
<li><a href="https://2days.kr/14/07/12/64637/it/program/">키보드 입력 한 줄로 만드는 게임? Mirage AI 실시간 게임 생성의 미래</a></li>
</ul>
<!-- CONTENT END 14 -->
]]></content:encoded>
					
		
		
		<media:content url="https://i1.wp.com/2days.kr/wp-content/uploads/2026/10/mcp-1.png?ssl=1" medium="image"></media:content>
            	</item>
		<item>
		<title>X 게시물을 내 노션에 스크랩하는 코드</title>
		<link>https://2days.kr/10/11/09/69832/it/program/</link>
		
		<dc:creator><![CDATA[urjent]]></dc:creator>
		<pubDate>Mon, 10 Nov 2025 00:55:42 +0000</pubDate>
				<category><![CDATA[program]]></category>
		<guid isPermaLink="false">https://2days.kr/?p=69832</guid>

					<description><![CDATA[X.com에 노션 스크랩하는 코드를 올려 놓습니다 X 게시물을 내 노션에 스크랩하는 코드 #!/usr/bin/env python3 # -*- coding: utf-8 -*- """ X(Twitter) → Notion 자동 파이프라인 (macOS, 최종판) - 창 열림 + 로그인 대기(콘솔 Enter) 후 수집 시작 - macOS Chrome 프로필 자동 감지 + 잠금 시 임시 프로필 복제(B 방안) - webdriver_manager의 THIRD_PARTY_NOTICES.chromedriver 경로 보정 [&#8230;]]]></description>
										<content:encoded><![CDATA[<p>X.com에 노션 스크랩하는 코드를 올려 놓습니다</p>
<h2><strong>X 게시물을 내 노션에 스크랩하는 코드</strong></h2>
<figure id="attachment_69834" aria-describedby="caption-attachment-69834" style="width: 696px" class="wp-caption aligncenter"><img loading="lazy" decoding="async" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" fifu-lazy="1" fifu-data-sizes="auto" fifu-data-srcset="https://i2.wp.com/2days.kr/wp-content/uploads/2025/11/제목을-입력해주세요__-복사본-001-79-1024x1024.jpg?ssl=1&amp;w=75&amp;resize=75&amp;ssl=1 75w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/11/제목을-입력해주세요__-복사본-001-79-1024x1024.jpg?ssl=1&amp;w=100&amp;resize=100&amp;ssl=1 100w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/11/제목을-입력해주세요__-복사본-001-79-1024x1024.jpg?ssl=1&amp;w=150&amp;resize=150&amp;ssl=1 150w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/11/제목을-입력해주세요__-복사본-001-79-1024x1024.jpg?ssl=1&amp;w=240&amp;resize=240&amp;ssl=1 240w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/11/제목을-입력해주세요__-복사본-001-79-1024x1024.jpg?ssl=1&amp;w=320&amp;resize=320&amp;ssl=1 320w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/11/제목을-입력해주세요__-복사본-001-79-1024x1024.jpg?ssl=1&amp;w=500&amp;resize=500&amp;ssl=1 500w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/11/제목을-입력해주세요__-복사본-001-79-1024x1024.jpg?ssl=1&amp;w=640&amp;resize=640&amp;ssl=1 640w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/11/제목을-입력해주세요__-복사본-001-79-1024x1024.jpg?ssl=1&amp;w=800&amp;resize=800&amp;ssl=1 800w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/11/제목을-입력해주세요__-복사본-001-79-1024x1024.jpg?ssl=1&amp;w=1024&amp;resize=1024&amp;ssl=1 1024w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/11/제목을-입력해주세요__-복사본-001-79-1024x1024.jpg?ssl=1&amp;w=1280&amp;resize=1280&amp;ssl=1 1280w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/11/제목을-입력해주세요__-복사본-001-79-1024x1024.jpg?ssl=1&amp;w=1600&amp;resize=1600&amp;ssl=1 1600w" class="wp-image-69834 size-large" fifu-data-src="https://i2.wp.com/2days.kr/wp-content/uploads/2025/11/제목을-입력해주세요__-복사본-001-79-1024x1024.jpg?ssl=1" alt="X 게시물을 내 노션에 스크랩하는 코드" width="696" height="696" loading="lazy" title="X 게시물을 내 노션에 스크랩하는 코드 29"><figcaption id="caption-attachment-69834" class="wp-caption-text">X 게시물을 내 노션에 스크랩하는 코드</figcaption></figure><div class='code-block code-block-2' style='margin: 8px auto; text-align: center; display: block; clear: both;'>
<!-- 중간 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8940400388075870"
     data-ad-slot="8794586137"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script></div>

<div>
<pre>#!/usr/bin/env python3
# -*- coding: utf-8 -*-

"""
X(Twitter) → Notion 자동 파이프라인 (macOS, 최종판)
- 창 열림 + 로그인 대기(콘솔 Enter) 후 수집 시작
- macOS Chrome 프로필 자동 감지 + 잠금 시 임시 프로필 복제(B 방안)
- webdriver_manager의 THIRD_PARTY_NOTICES.chromedriver 경로 보정
- 무한 스크롤로 TARGET_COUNT 까지 수집
- 이미지/동영상 다운로드 → 5MiB 이하 자동 압축 → Notion 업로드(새 File Upload API)
- DB 스키마 유연 적응: Title 자동 탐색, 기타 속성은 있으면 매핑/없으면 생략
- Media(files) 없으면 생성 시도 → 실패 시 file 블록(children)로 첨부
- 중복 방지: 페이지 재활용, 동일 파일명 재업로드 방지
- 업로드 성공 파일은 즉시 로컬 삭제
"""

import os, re, csv, time, stat, json, logging, io, subprocess, shutil, tempfile
from pathlib import Path
from typing import Dict, Any, List, Optional, Tuple

import requests
from requests.adapters import HTTPAdapter
from urllib3.util.retry import Retry
from urllib.parse import urlparse, parse_qsl, urlencode, urlunparse

from PIL import Image

from selenium import webdriver
from selenium.webdriver.chrome.options import Options
from selenium.webdriver.chrome.service import Service
from selenium.webdriver.common.by import By
from selenium.common.exceptions import SessionNotCreatedException, WebDriverException
from webdriver_manager.chrome import ChromeDriverManager
import yt_dlp

# ===================== 설정 =====================
ACCOUNT       = "<span style="color: #ff0000;">수집대상"</span>      # 수집 대상 X 계정
TARGET_COUNT  = 8000                  # 원하는 수집 개수
MAX_SCROLL    = 100000                 # 최대 스크롤 시도
SCROLL_PAUSE  = 7.5                  # 스크롤 간 대기(안정성)
HEADLESS      = False                # 창 열림 권장(True면 로그인 대기 비활성)
WAIT_FOR_LOGIN= True                 # 창 뜬 뒤 로그인하고 콘솔 Enter로 시작

OUT_DIR       = Path("./NatureIsAmazing_v3")

# Notion (개인용, 하드코딩 요청 반영)
NOTION_API_KEY         = "<span style="color: #ff0000;">노션API</span>"
NOTION_DATABASE_ID_RAW = "<span style="color: #ff0000;">노션DP</span>"  # 하이픈 없어도 허용
NOTION_VERSION         = "2022-06-28"

# 선택: X 로그인 쿠키(Netscape 형식, yt-dlp용)
COOKIES_FILE = ""  # 예) "/Users/<span style="color: #ff0000;">아이디(영문이름)/</span>cookies_twitter.txt"

UA = ("Mozilla/5.0 (Macintosh; Intel Mac OS X 13_5) AppleWebKit/537.36 "
      "(KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36")

MAX_UPLOAD_BYTES = 5 * 1024 * 1024  # 5 MiB

logging.basicConfig(level=logging.INFO,
                    format="%(asctime)s | %(levelname)s | %(message)s",
                    datefmt="%H:%M:%S")

# ===================== 공통 유틸 =====================
def ensure_executable(path: str):
    if not os.access(path, os.X_OK):
        os.chmod(path, stat.S_IRUSR | stat.S_IWUSR | stat.S_IXUSR |
                       stat.S_IRGRP | stat.S_IXGRP |
                       stat.S_IROTH | stat.S_IXOTH)

def build_http_session() -&gt; requests.Session:
    s = requests.Session()
    retries = Retry(total=5, connect=5, read=5, backoff_factor=0.6,
                    status_forcelist=(429,500,502,503,504),
                    allowed_methods=["GET","HEAD","OPTIONS"])
    s.headers.update({"User-Agent": UA, "Accept": "*/*"})
    s.mount("http://", HTTPAdapter(max_retries=retries))
    s.mount("https://", HTTPAdapter(max_retries=retries))
    return s

def normalize_x_url(u: str) -&gt; str:
    return u.replace("x.com", "twitter.com")

def force_orig(url: str) -&gt; str:
    if "twimg.com/media" not in url:
        return url
    parts = list(urlparse(url))
    qs = dict(parse_qsl(parts[4]))
    qs["name"] = "orig"
    parts[4] = urlencode(qs)
    return urlunparse(parts)

def hyphenate_uuid(s: str) -&gt; str:
    s = re.sub(r"[^0-9a-fA-F]", "", s)
    return f"{s[0:8]}-{s[8:12]}-{s[12:16]}-{s[16:20]}-{s[20:32]}" if len(s)==32 else s

NOTION_DATABASE_ID = hyphenate_uuid(NOTION_DATABASE_ID_RAW)

# ===================== macOS Chrome 프로필 감지/복제 =====================
def _profile_locked(profile_path: Path) -&gt; bool:
    for name in ("SingletonLock","SingletonCookie","SingletonSocket"):
        if (profile_path / name).exists():
            return True
    return False

def _make_ephemeral_profile(base_dir: Path, profile_dir: str) -&gt; Tuple[str,str]:
    """
    원본 프로필에서 핵심 데이터만 복사하여 임시 user-data-dir 생성.
    큰 캐시류는 제외해 충돌 최소화.
    """
    src = base_dir / profile_dir
    tmp_root = Path(tempfile.mkdtemp(prefix="chrome-epi-"))
    dst = tmp_root / "Default"
    dst.mkdir(parents=True, exist_ok=True)

    whitelist = [
        "Cookies","Cookies-journal","Network","Preferences","Secure Preferences",
        "Local Storage","History","Favicons","Visited Links","Bookmarks","Session Storage"
    ]
    blacklist = {"Cache","Code Cache","GPUCache","Service Worker","ShaderCache","GrShaderCache"}

    def _copy_entry(name: str):
        s = src / name
        d = dst / name
        if not s.exists(): return
        if s.is_dir():
            if name in blacklist: return
            shutil.copytree(s, d, dirs_exist_ok=True)
        else:
            try: shutil.copy2(s, d)
            except Exception: pass

    for entry in whitelist: _copy_entry(entry)
    for name in os.listdir(src):
        if name in whitelist or name in blacklist: continue
        sp = src / name
        dp = dst / name
        try:
            if sp.is_file() and sp.stat().st_size &lt;= 5*1024*1024:
                shutil.copy2(sp, dp)
        except Exception:
            pass

    return str(tmp_root), "Default"

def find_chrome_profile_on_macos() -&gt; Tuple[Optional[str], Optional[str]]:
    home = Path.home()
    base = home / "Library" / "Application Support" / "Google" / "Chrome"
    local_state = base / "Local State"
    try:
        if local_state.is_file():
            data = json.loads(local_state.read_text(encoding="utf-8"))
            last_used = data.get("profile", {}).get("last_used")
            if last_used and (base / last_used).is_dir():
                return str(base), last_used
    except Exception:
        pass
    for name in ["Default"]+[f"Profile {i}" for i in range(1,12)]:
        if (base / name).is_dir():
            return str(base), name
    return None, None

# ===================== 압축기 =====================
def compress_image_to_limit(src: Path, dst: Path, max_bytes: int = MAX_UPLOAD_BYTES) -&gt; bool:
    try:
        img = Image.open(src).convert("RGB")
    except Exception as e:
        logging.error(f"이미지 열기 실패: {src} -&gt; {e}")
        return False

    def resize(img, max_side):
        w, h = img.size
        if max(w,h) &lt;= max_side: return img
        ratio = max_side / max(w,h)
        return img.resize((int(w*ratio), int(h*ratio)), Image.LANCZOS)

    for ms in [1600, 1400, 1200, 1000, 800, 640, 560, 480]:
        test = resize(img, ms)
        for q in [85,80,72,65,57,50,42,35,30,25]:
            buf = io.BytesIO()
            test.save(buf, format="JPEG", quality=q, optimize=True, progressive=True)
            data = buf.getvalue()
            if len(data) &lt;= max_bytes:
                dst.write_bytes(data); return True
    buf = io.BytesIO()
    resize(img, 432).save(buf, format="JPEG", quality=24, optimize=True, progressive=True)
    dst.write_bytes(buf.getvalue())
    return dst.stat().st_size &lt;= max_bytes

def _run_ffmpeg(args: List[str]) -&gt; bool:
    try:
        res = subprocess.run(args, stdout=subprocess.DEVNULL, stderr=subprocess.DEVNULL, check=False)
        return res.returncode == 0
    except Exception:
        return False

def compress_video_to_limit(src: Path, dst: Path, max_bytes: int = MAX_UPLOAD_BYTES) -&gt; bool:
    steps = [
        ("scale='min(720,iw)':-2", 28, 64),
        ("scale='min(640,iw)':-2", 30, 56),
        ("scale='min(540,iw)':-2", 32, 48),
        ("scale='min(480,iw)':-2", 35, 40),
    ]
    for vf, crf, a_kbps in steps:
        args = ["ffmpeg","-y","-i",str(src),
                "-vf",vf,"-c:v","libx264","-preset","veryfast","-crf",str(crf),
                "-c:a","aac","-b:a",f"{a_kbps}k","-movflags","+faststart",
                "-fs",str(max_bytes-1024), str(dst)]
        if _run_ffmpeg(args) and dst.exists() and dst.stat().st_size &lt;= max_bytes:
            return True
    args = ["ffmpeg","-y","-i",str(src),
            "-vf","scale='min(432,iw)':-2","-c:v","libx264","-preset","veryfast","-crf","38",
            "-c:a","aac","-b:a","40k","-movflags","+faststart","-fs",str(max_bytes-1024), str(dst)]
    return _run_ffmpeg(args) and dst.exists() and dst.stat().st_size &lt;= max_bytes

# ===================== Selenium / Driver (안정화 리트라이) =====================
def _system_chrome_binary() -&gt; Optional[str]:
    candidates = [
        "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome",
        str(Path.home() / "Applications/Google Chrome.app/Contents/MacOS/Google Chrome"),
    ]
    for c in candidates:
        if os.path.exists(c):
            return c
    return None

def _resolve_chromedriver_path(raw_path: str) -&gt; str:
    path = raw_path
    if os.path.basename(path) == "THIRD_PARTY_NOTICES.chromedriver":
        d = os.path.dirname(path)
        for f in os.listdir(d):
            p = os.path.join(d, f)
            if f.startswith("chromedriver") and os.path.isfile(p):
                path = p; break
    if not os.path.isfile(path) or not os.access(path, os.X_OK):
        d = os.path.dirname(path)
        for f in os.listdir(d):
            p = os.path.join(d, f)
            if f.startswith("chromedriver") and os.path.isfile(p) and os.access(p, os.X_OK):
                path = p; break
    ensure_executable(path)
    return path

def _base_options(headless: bool) -&gt; Options:
    opts = Options()
    # 공통 옵션
    opts.add_argument("--no-sandbox")
    opts.add_argument("--disable-dev-shm-usage")
    opts.add_argument("--disable-gpu")
    opts.add_argument("--window-size=1280,2400")
    opts.add_argument("--disable-notifications")
    opts.add_argument("--disable-extensions")
    opts.add_argument("--mute-audio")
    opts.add_argument("--log-level=3")
    opts.add_argument(f"--user-agent={UA}")
    if headless:
        opts.add_argument("--headless=new")
        opts.add_argument("--disable-software-rasterizer")
        opts.add_argument("--disable-features=VizDisplayCompositor")
    # 시스템 Chrome 바이너리 지정
    sys_bin = _system_chrome_binary()
    if sys_bin:
        opts.binary_location = sys_bin
        logging.info(f"Using system Chrome binary: {sys_bin}")
    else:
        logging.warning("System Chrome binary not found. Relying on default.")
    return opts

def _start_driver_with(opts: Options) -&gt; webdriver.Chrome:
    raw = ChromeDriverManager().install()
    path = _resolve_chromedriver_path(raw)
    return webdriver.Chrome(service=Service(path), options=opts)

def setup_driver(headless: bool = False):
    """
    부팅 전략(순차 재시도):
    1) 시스템 프로필 사용
    2) 시스템 프로필 잠금/충돌 → 임시 복제 프로필 사용
    3) 프로필 없이 기본 실행
    4) headless 최소 옵션
    """
    # 1) 시스템 프로필 시도
    base, prof = find_chrome_profile_on_macos()
    if base and prof:
        profile_path = Path(base) / prof
        opts = _base_options(headless=headless)
        if _profile_locked(profile_path):
            logging.info("Profile locked → try ephemeral clone")
        else:
            opts.add_argument(f"--user-data-dir={base}")
            opts.add_argument(f"--profile-directory={prof}")
            try:
                logging.info(f"Launching Chrome with profile: {prof}")
                return _start_driver_with(opts)
            except (SessionNotCreatedException, WebDriverException) as e:
                logging.warning(f"Profile launch failed: {e}")

        # 2) 임시 복제 프로필
        try:
            epi_dir, epi_prof = _make_ephemeral_profile(Path(base), prof)
            opts = _base_options(headless=headless)
            opts.add_argument(f"--user-data-dir={epi_dir}")
            opts.add_argument(f"--profile-directory={epi_prof}")
            logging.info("Launching Chrome with ephemeral profile")
            return _start_driver_with(opts)
        except (SessionNotCreatedException, WebDriverException) as e:
            logging.warning(f"Ephemeral profile launch failed: {e}")

    # 3) 프로필 없이
    try:
        opts = _base_options(headless=headless)
        logging.info("Launching Chrome without user profile")
        return _start_driver_with(opts)
    except (SessionNotCreatedException, WebDriverException) as e:
        logging.warning(f"No-profile launch failed: {e}")

    # 4) 최후: headless 최소 옵션
    try:
        opts = _base_options(headless=True)
        logging.info("Launching Chrome headless (fallback)")
        return _start_driver_with(opts)
    except Exception as e:
        logging.error(f"All launch strategies failed: {e}")
        raise

# ===================== 로그인 대기 =====================
def wait_for_login_and_keypress(driver, account: str) -&gt; bool:
    try:
        # 대상 프로필 페이지로 포커스
        target = f"https://x.com/{account}"
        if "x.com" not in driver.current_url and "twitter.com" not in driver.current_url:
            driver.get(target)
            time.sleep(2)

        print("\n==============================================")
        print(" 로그인 후 계속 진행 안내")
        print("----------------------------------------------")
        print(" 1) 열린 Chrome 창에서 X(Twitter)에 로그인하세요.")
        print(" 2) 프로필/타임라인이 정상 로드되는지 확인하세요.")
        print(" 3) 여기 콘솔에서 Enter를 누르면 스크랩을 시작합니다.")
        print("    (s 입력 후 Enter: 즉시 시작)")
        print("==============================================\n")
        _ = input("로그인 완료 후 Enter(또는 s 입력 후 Enter)를 눌러 계속: ").strip().lower()
        return True
    except Exception as e:
        logging.warning(f"로그인 대기 중 경고: {e}")
        return True

# ===================== 스크랩 =====================
def download_file(session: requests.Session, url: str, dest: Path) -&gt; bool:
    try:
        tmp = dest.with_suffix(dest.suffix + ".part")
        with session.get(url, stream=True, timeout=30) as r:
            r.raise_for_status()
            with open(tmp, "wb") as f:
                for chunk in r.iter_content(8192):
                    if chunk: f.write(chunk)
        os.replace(tmp, dest)
        return True
    except Exception as e:
        logging.warning(f"이미지 다운로드 실패: {url} -&gt; {e}")
        return False

def find_video_links(card) -&gt; Optional[str]:
    links = [a.get_attribute("href") for a in card.find_elements(By.TAG_NAME, "a")]
    for l in links:
        if l and ("/video/" in l or "/i/status/" in l or "/status/" in l):
            return l
    return None

def download_video(tweet_url: str, dest: Path) -&gt; bool:
    try:
        url = normalize_x_url(tweet_url)
        ydl_opts = {
            "quiet": True,
            "no_warnings": True,
            "format": "bv*[ext=mp4]+ba[ext=m4a]/b[ext=mp4]/bv*+ba/b",
            "merge_output_format": "mp4",
            "outtmpl": str(dest),
            "retries": 5,
            "fragment_retries": 10,
            "socket_timeout": 20,
            "user_agent": UA,
            "geo_bypass": True,
            "concurrent_fragment_downloads": 3,
        }
        if COOKIES_FILE and Path(COOKIES_FILE).exists():
            ydl_opts["cookiefile"] = COOKIES_FILE
        with yt_dlp.YoutubeDL(ydl_opts) as ydl:
            ydl.download([url])
        return True
    except Exception as e:
        logging.warning(f"영상 다운로드 실패: {url} -&gt; {e}")
        return False

def scrape(account: str, out_dir: Path, max_scroll: int, scroll_pause: float,
           headless: bool, target_count: int = 100) -&gt; Dict[str, Any]:
    out_dir.mkdir(exist_ok=True)
    media_dir = out_dir / "media"; media_dir.mkdir(exist_ok=True)
    csv_path = out_dir / "tweets.csv"

    driver = setup_driver(headless=headless)
    driver.get(f"https://x.com/{account}")
    time.sleep(5)

    # 로그인 대기
    if WAIT_FOR_LOGIN and not headless:
        if not wait_for_login_and_keypress(driver, account):
            logging.error("로그인 대기 실패"); driver.quit()
            return {"tweets": {}, "csv": csv_path, "media_dir": media_dir, "account": account}

    tweets: Dict[str, Dict[str, Any]] = {}
    last_height = driver.execute_script("return document.body.scrollHeight")
    stalls, stall_limit = 0, 12
    session = build_http_session()

    logging.info(f"@{account} 수집 시작… (목표 {target_count}개)")
    for _ in range(max_scroll):
        cards = driver.find_elements(By.XPATH, "//article[@data-testid='tweet']")
        new_count = 0
        for c in cards:
            try:
                link = c.find_element(By.XPATH, ".//a[contains(@href,'status')]")
                tid = link.get_attribute("href").split("/")[-1]
                if not tid or not tid.isdigit() or tid in tweets:
                    continue
                text = c.text.replace("\n", " ")
                imgs = [force_orig(i.get_attribute("src")) for i in c.find_elements(By.XPATH, ".//img[contains(@src,'twimg.com/media')]")]
                vids = [v.get_attribute("src") for v in c.find_elements(By.XPATH, ".//video") if v.get_attribute("src")]
                orig_video = find_video_links(c)
                tweets[tid] = {"id": tid, "text": text, "images": imgs, "videos": vids, "orig_video": orig_video}
                new_count += 1
            except Exception:
                pass

        if len(tweets) &gt;= target_count:
            logging.info(f"목표 {target_count}개 달성, 스크랩 종료"); break

        # 스크롤 지그재그
        driver.execute_script("window.scrollTo(0, document.body.scrollHeight);")
        time.sleep(scroll_pause)
        driver.execute_script("window.scrollTo(0, document.body.scrollHeight*0.85);")
        time.sleep(scroll_pause)

        new_height = driver.execute_script("return document.body.scrollHeight")
        if new_height == last_height and new_count == 0:
            stalls += 1
            if stalls &gt;= stall_limit:
                logging.info("더 이상 컨텐츠 로드 없음 → 종료"); break
        else:
            stalls = 0
        last_height = new_height

    driver.quit()
    logging.info(f"트윗 {len(tweets)}개 수집 완료")

    # CSV
    with open(csv_path, "w", newline="", encoding="utf-8") as f:
        w = csv.writer(f)
        w.writerow(["id", "text", "image_count", "video_count", "orig_video"])
        for t in tweets.values():
            w.writerow([t["id"], t["text"], len(t["images"]), len(t["videos"]), t["orig_video"]])
    logging.info(f"CSV 저장: {csv_path}")

    # 미디어 다운로드
    logging.info("미디어 다운로드…")
    for tid, t in tweets.items():
        tweet_url = normalize_x_url(t.get("orig_video") or f"https://x.com/{account}/status/{tid}")
        for idx, m in enumerate(t["images"], 1):
            dest = media_dir / f"{tid}_img{idx}.jpg"
            if not dest.exists():
                download_file(session, m, dest)
        if bool(t.get("videos")) or bool(t.get("orig_video")):
            dest = media_dir / f"{tid}_video.mp4"
            if not dest.exists():
                download_video(tweet_url, dest)

    logging.info(f"미디어 저장 완료: {media_dir}")
    return {"tweets": tweets, "csv": csv_path, "media_dir": media_dir, "account": account}

# ===================== Notion (유연 매핑) =====================
def notion_headers() -&gt; Dict[str, str]:
    h = {"Authorization": f"Bearer {NOTION_API_KEY}",
         "Content-Type": "application/json"}
    if NOTION_VERSION: h["Notion-Version"] = NOTION_VERSION
    return h

def notion_get_db() -&gt; Dict[str, Any]:
    r = requests.get(f"https://api.notion.com/v1/databases/{NOTION_DATABASE_ID}",
                     headers=notion_headers(), timeout=30)
    r.raise_for_status(); return r.json()

def find_title_prop(db: Dict[str, Any]) -&gt; str:
    for name, meta in db.get("properties", {}).items():
        if meta.get("type") == "title": return name
    raise RuntimeError("이 DB에는 Title 속성이 없습니다. (제목 속성 1개 필요)")

def map_optional_props(db: Dict[str, Any]) -&gt; Dict[str, Optional[str]]:
    props = db.get("properties", {})
    def norm(s): return re.sub(r"[\s_]+","",s.lower())
    candidates = {
        "text": ["text","tweettext","본문","내용"],
        "image_count": ["imagecount","images","imgcount","이미지개수","이미지수"],
        "video_count": ["videocount","videos","vidcount","동영상개수","비디오개수"],
        "tweet_url": ["tweeturl","url","링크","원문","원본url"],
        "media": ["media","files","attachments","첨부","파일"],
    }
    found = {"text":None,"image_count":None,"video_count":None,"tweet_url":None,"media":None}
    for name, meta in props.items():
        t = meta.get("type"); n = norm(name)
        if t=="rich_text" and found["text"] is None and (n in candidates["text"]): found["text"]=name
        if t=="number"    and found["image_count"] is None and (n in candidates["image_count"]): found["image_count"]=name
        if t=="number"    and found["video_count"] is None and (n in candidates["video_count"]): found["video_count"]=name
        if t=="url"       and found["tweet_url"] is None and (n in candidates["tweet_url"]): found["tweet_url"]=name
        if t=="files"     and found["media"] is None and (n in candidates["media"]): found["media"]=name
    # 타입 기반 폴백
    if not found["text"]:
        for n,m in props.items():
            if m.get("type")=="rich_text": found["text"]=n; break
    if not found["tweet_url"]:
        for n,m in props.items():
            if m.get("type")=="url": found["tweet_url"]=n; break
    if not found["media"]:
        for n,m in props.items():
            if m.get("type")=="files": found["media"]=n; break
    if not found["image_count"]:
        for n,m in props.items():
            if m.get("type")=="number": found["image_count"]=n; break
    if not found["video_count"]:
        for n,m in props.items():
            if m.get("type")=="number" and n!=found["image_count"]: found["video_count"]=n; break
    return found

def ensure_media_property(db: Dict[str, Any]) -&gt; Optional[str]:
    for name, meta in db.get("properties", {}).items():
        if meta.get("type")=="files": return name
    patch = {"properties":{"Media":{"name":"Media","type":"files","files":{}}}}
    r = requests.patch(f"https://api.notion.com/v1/databases/{NOTION_DATABASE_ID}",
                       headers=notion_headers(), json=patch, timeout=30)
    if r.status_code in (200,202): return "Media"
    logging.warning(f"DB files 속성 생성 실패: {r.status_code} {r.text}")
    return None

def notion_query_by_title(title_prop: str, value: str) -&gt; Optional[str]:
    payload = {"filter":{"property":title_prop,"title":{"equals":value}},"page_size":1}
    r = requests.post(f"https://api.notion.com/v1/databases/{NOTION_DATABASE_ID}/query",
                      headers=notion_headers(), json=payload, timeout=30)
    r.raise_for_status(); res = r.json().get("results", [])
    return res[0]["id"] if res else None

def notion_create_page(row: Dict[str, Any], title_prop: str, opt: Dict[str, Optional[str]]) -&gt; str:
    props: Dict[str, Any] = {title_prop: {"title":[{"text":{"content":row["id"]}}]}}
    if opt["text"]:
        txt = (row.get("text") or "")[:2000]
        props[opt["text"]] = {"rich_text":[{"text":{"content":txt}}]} if txt else {"rich_text":[]}
    if opt["image_count"]:
        props[opt["image_count"]] = {"number": len(row.get("images", []))}
    if opt["video_count"]:
        props[opt["video_count"]] = {"number": len(row.get("videos", []))}
    if opt["tweet_url"]:
        props[opt["tweet_url"]] = {"url": row["tweet_url"]}

    payload = {"parent":{"database_id":NOTION_DATABASE_ID},
               "properties": props,
               "children":[{"object":"block","type":"bookmark","bookmark":{"url":row["tweet_url"]}}]}
    r = requests.post("https://api.notion.com/v1/pages", headers=notion_headers(), json=payload, timeout=30)
    if r.status_code &gt;= 400:
        logging.error(f"페이지 생성 실패: {r.status_code} {r.text}\nPayload: {payload}")
    r.raise_for_status()
    return r.json()["id"]

def notion_get_page_media_names(page_id: str, media_prop: Optional[str]) -&gt; List[str]:
    if not media_prop: return []
    r = requests.get(f"https://api.notion.com/v1/pages/{page_id}", headers=notion_headers(), timeout=30)
    r.raise_for_status()
    items = r.json().get("properties", {}).get(media_prop, {}).get("files", [])
    return [i.get("name") for i in items if i.get("name")]

# --- File Upload API ---
def mime_from_suffix(p: Path) -&gt; str:
    ext = p.suffix.lower()
    if ext in [".jpg",".jpeg"]: return "image/jpeg"
    if ext == ".png": return "image/png"
    if ext == ".gif": return "image/gif"
    if ext == ".mp4": return "video/mp4"
    return "application/octet-stream"

def notion_create_file_upload(name: str, mime: str) -&gt; Dict[str, Any]:
    r = requests.post("https://api.notion.com/v1/file_uploads",
                      headers=notion_headers(),
                      json={"file_name": name, "file_mime_type": mime}, timeout=60)
    r.raise_for_status(); return r.json()

def notion_send_file_upload(file_upload_id: str, filepath: Path):
    headers = {k:v for k,v in notion_headers().items() if k!="Content-Type"}
    with open(filepath, "rb") as fh:
        r = requests.post(f"https://api.notion.com/v1/file_uploads/{file_upload_id}/send",
                          headers=headers, files={"file": (filepath.name, fh)}, timeout=600)
    r.raise_for_status(); return r.json()

def as_uploaded_file_obj(file_upload_id: str, name: str) -&gt; Dict[str, Any]:
    return {"name": name, "type": "file_upload", "file_upload": {"id": file_upload_id}}

def notion_update_media_property(page_id: str, media_prop: str, files: List[Dict[str, Any]]):
    payload = {"properties": {media_prop: {"files": files}}}
    r = requests.patch(f"https://api.notion.com/v1/pages/{page_id}",
                       headers=notion_headers(), json=payload, timeout=60)
    if r.status_code &gt;= 400:
        logging.error(f"Media 속성 업데이트 실패: {r.status_code} {r.text}\nPayload: {payload}")
    r.raise_for_status()

def notion_append_file_blocks(page_id: str, files: List[Dict[str, Any]]):
    children = []
    for f in files:
        children.append({"object":"block","type":"file",
                         "file":{"type":"file_upload","file_upload":{"file_upload_id": f["file_upload"]["id"]}}})
    r = requests.patch(f"https://api.notion.com/v1/blocks/{page_id}/children",
                       headers=notion_headers(), json={"children": children}, timeout=60)
    if r.status_code &gt;= 400:
        logging.error(f"파일 블록 첨부 실패: {r.status_code} {r.text}")
    r.raise_for_status()

# ===================== 파이프라인 =====================
def run_pipeline(account: str, out_dir: Path, target_count: int, max_scroll: int, headless: bool):
    result = scrape(account, out_dir, max_scroll, SCROLL_PAUSE, headless, target_count=target_count)
    tweets = result["tweets"]; media_dir: Path = result["media_dir"]

    if not (NOTION_API_KEY and NOTION_DATABASE_ID):
        logging.error("NOTION_API_KEY/NOTION_DATABASE_ID 필요"); return

    db = notion_get_db()
    title_prop = find_title_prop(db)
    opt_props  = map_optional_props(db)
    if not opt_props["media"]:
        created = ensure_media_property(db)
        if created: opt_props["media"] = created

    for tid, t in tweets.items():
        row = {
            "id": tid,
            "text": t.get("text",""),
            "images": t.get("images",[]),
            "videos": t.get("videos",[]),
            "tweet_url": normalize_x_url(t.get("orig_video") or f"https://x.com/{account}/status/{tid}"),
        }

        page_id = notion_query_by_title(title_prop, row["id"])
        if not page_id:
            try:
                page_id = notion_create_page(row, title_prop, opt_props)
            except requests.HTTPError as e:
                logging.error(f"[{tid}] 페이지 생성 실패 → 스킵: {e}")
                continue
        time.sleep(0.25)

        existing_names = set()
        if opt_props["media"]:
            try:
                existing_names = set(notion_get_page_media_names(page_id, opt_props["media"]))
            except Exception as e:
                logging.warning(f"[{tid}] 기존 Media 조회 실패(무시): {e}")

        uploaded_files: List[Dict[str, Any]] = []

        # 이미지
        for p in sorted(media_dir.glob(f"{tid}_img*.jpg")):
            if not p.exists() or p.name in existing_names: continue
            temp = p.with_suffix(".upload.jpg")
            if not compress_image_to_limit(p, temp, MAX_UPLOAD_BYTES):
                logging.error(f"[{tid}] 이미지 5MiB 이하 압축 실패: {p.name}")
                if temp.exists(): temp.unlink(missing_ok=True)
                continue
            try:
                meta = notion_create_file_upload(p.name, mime_from_suffix(temp))
                notion_send_file_upload(meta["id"], temp)
                uploaded_files.append(as_uploaded_file_obj(meta["id"], p.name))
                temp.unlink(missing_ok=True); p.unlink(missing_ok=True)
                logging.info(f"[{tid}] 이미지 업로드 성공 → {p.name}")
            except Exception as e:
                logging.error(f"[{tid}] 이미지 업로드 실패({p.name}): {e}")
                if temp.exists(): temp.unlink(missing_ok=True)
            time.sleep(0.12)

        # 동영상
        v = media_dir / f"{tid}_video.mp4"
        if v.exists() and v.name not in existing_names:
            tempv = v.with_suffix(".upload.mp4")
            if compress_video_to_limit(v, tempv, MAX_UPLOAD_BYTES):
                try:
                    meta = notion_create_file_upload(v.name, mime_from_suffix(tempv))
                    notion_send_file_upload(meta["id"], tempv)
                    uploaded_files.append(as_uploaded_file_obj(meta["id"], v.name))
                    tempv.unlink(missing_ok=True); v.unlink(missing_ok=True)
                    logging.info(f"[{tid}] 동영상 업로드 성공 → {v.name}")
                except Exception as e:
                    logging.error(f"[{tid}] 동영상 업로드 실패({v.name}): {e}")
                    if tempv.exists(): tempv.unlink(missing_ok=True)
            else:
                logging.error(f"[{tid}] 동영상 5MiB 이하 압축 실패: {v.name}")
                if tempv.exists(): tempv.unlink(missing_ok=True)

        # 반영
        if uploaded_files:
            try:
                if opt_props["media"]:
                    notion_update_media_property(page_id, opt_props["media"], uploaded_files)
                    logging.info(f"[{tid}] Media 속성에 {len(uploaded_files)}개 설정")
                else:
                    notion_append_file_blocks(page_id, uploaded_files)
                    logging.info(f"[{tid}] 파일 블록으로 {len(uploaded_files)}개 첨부")
            except Exception as e:
                logging.error(f"[{tid}] 파일 반영 실패: {e}")
        else:
            logging.info(f"[{tid}] 신규 업로드 없음")

# ===================== 엔트리포인트 =====================
def main():
    run_pipeline(ACCOUNT, OUT_DIR, TARGET_COUNT, MAX_SCROLL, HEADLESS)

if __name__ == "__main__":
    main()</pre>
</div>
<!-- CONTENT END 16 -->
]]></content:encoded>
					
		
		
		<media:content url="https://i2.wp.com/2days.kr/wp-content/uploads/2025/11/제목을-입력해주세요__-복사본-001-79-1024x1024.jpg?ssl=1" medium="image"></media:content>
            	</item>
		<item>
		<title>2025년 원스트라이크 아웃제도 전면 시행! 자본시장에 닥친 경고</title>
		<link>https://2days.kr/17/07/11/64708/it/program/</link>
		
		<dc:creator><![CDATA[urjent]]></dc:creator>
		<pubDate>Thu, 17 Jul 2025 02:11:02 +0000</pubDate>
				<category><![CDATA[program]]></category>
		<guid isPermaLink="false">https://2days.kr/?p=64708</guid>

					<description><![CDATA[2025년 원스트라이크 아웃제도 전면 시행! 자본시장에 닥친 경고 &#8220;주가조작 한 번이면 끝!&#8221; 이제 자본시장에선 진짜로 기회가 단 한 번뿐입니다. 안녕하세요, 요즘 뉴스 보셨나요? 저는 며칠 전 친구와 카페에서 자산운용 이야기를 하다가 ‘원스트라이크 아웃제도’ 소식을 처음 접했어요. 한 번의 불공정거래만으로 자본시장에서 퇴출될 수 있다니, 그야말로 판도가 확 바뀌는 느낌이더라구요. 특히나 요즘처럼 투자자들이 유튜브나 커뮤니티에서 정보 찾다 [&#8230;]]]></description>
										<content:encoded><![CDATA[<h3 style="line-height: 1.8; margin-bottom: 1.2em; color: #6a1b9a; font-weight: 500; font-family: 'Noto Sans KR', sans-serif;" data-ke-size="size23"><span style="color: #000000; font-size: 15px;">2025년 원스트라이크 아웃제도 전면 시행! 자본시장에 닥친 경고 &#8220;주가조작 한 번이면 끝!&#8221; 이제 자본시장에선 진짜로 기회가 단 한 번뿐입니다.</span></h3>
<p style="line-height: 1.8; margin-bottom: 1.2em; color: #6a1b9a; font-weight: 500; font-family: 'Noto Sans KR', sans-serif;" data-ke-size="size16"><span style="color: #000000;">안녕하세요, 요즘 뉴스 보셨나요? 저는 며칠 전 친구와 카페에서 자산운용 이야기를 하다가 ‘원스트라이크 아웃제도’ 소식을 처음 접했어요. 한 번의 불공정거래만으로 자본시장에서 퇴출될 수 있다니, 그야말로 판도가 확 바뀌는 느낌이더라구요. 특히나 요즘처럼 투자자들이 유튜브나 커뮤니티에서 정보 찾다 피해보는 경우가 많다 보니, 이런 강력한 제재가 오히려 신뢰를 줄 수 있을지도 모르겠단 생각이 들었죠. 그래서 이번 글에서는 2025년부터 시행되는 이 제도가 뭔지, 우리 투자자에게 어떤 의미인지 차근차근 정리해보려고 해요.</span></p>
<h3 style="line-height: 1.8; margin-bottom: 1.2em; color: #6a1b9a; font-weight: 500; font-family: 'Noto Sans KR', sans-serif;" data-ke-size="size23"><b><span style="color: #000000;">2025년 원스트라이크 아웃제도 전면 시행! 자본시장에 닥친 경고</span></b></h3>
<figure id="attachment_64709" aria-describedby="caption-attachment-64709" style="width: 696px" class="wp-caption aligncenter"><img loading="lazy" decoding="async" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" fifu-lazy="1" fifu-data-sizes="auto" fifu-data-srcset="https://i1.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-68-1024x559.png?ssl=1&amp;w=75&amp;resize=75&amp;ssl=1 75w, https://i1.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-68-1024x559.png?ssl=1&amp;w=100&amp;resize=100&amp;ssl=1 100w, https://i1.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-68-1024x559.png?ssl=1&amp;w=150&amp;resize=150&amp;ssl=1 150w, https://i1.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-68-1024x559.png?ssl=1&amp;w=240&amp;resize=240&amp;ssl=1 240w, https://i1.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-68-1024x559.png?ssl=1&amp;w=320&amp;resize=320&amp;ssl=1 320w, https://i1.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-68-1024x559.png?ssl=1&amp;w=500&amp;resize=500&amp;ssl=1 500w, https://i1.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-68-1024x559.png?ssl=1&amp;w=640&amp;resize=640&amp;ssl=1 640w, https://i1.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-68-1024x559.png?ssl=1&amp;w=800&amp;resize=800&amp;ssl=1 800w, https://i1.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-68-1024x559.png?ssl=1&amp;w=1024&amp;resize=1024&amp;ssl=1 1024w, https://i1.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-68-1024x559.png?ssl=1&amp;w=1280&amp;resize=1280&amp;ssl=1 1280w, https://i1.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-68-1024x559.png?ssl=1&amp;w=1600&amp;resize=1600&amp;ssl=1 1600w" class="wp-image-64709 size-large" fifu-data-src="https://i1.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-68-1024x559.png?ssl=1" alt="2025년 원스트라이크 아웃제도 전면 시행! 자본시장에 닥친 경고" width="696" height="380" loading="lazy" title="2025년 원스트라이크 아웃제도 전면 시행! 자본시장에 닥친 경고 30"><figcaption id="caption-attachment-64709" class="wp-caption-text">2025년 원스트라이크 아웃제도 전면 시행! 자본시장에 닥친 경고</figcaption></figure><div class='code-block code-block-2' style='margin: 8px auto; text-align: center; display: block; clear: both;'>
<!-- 중간 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8940400388075870"
     data-ad-slot="8794586137"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script></div>


<div style="background: linear-gradient(135deg, #f5f0ff, #f0e6ff); border-radius: 8px; padding: 20px; margin: 20px 0; box-shadow: 0 4px 10px rgba(106, 27, 154, 0.08); font-family: 'Noto Sans KR', sans-serif; border-left: 4px solid #9c27b0;">
<div style="margin-bottom: 15px;">
<h3 style="font-weight: bold; color: #4a148c; font-size: 18px; margin: 0;">목차</h3>
</div>
<div style="display: flex; flex-direction: column; gap: 10px;"><a style="color: #6a1b9a; text-decoration: none; font-weight: 500;" href="#what-is-out">원스트라이크 아웃제도란 무엇인가?</a><a style="color: #6a1b9a; text-decoration: none; font-weight: 500;" href="#why-now">왜 지금 ‘원스트라이크 아웃’인가?</a><a style="color: #6a1b9a; text-decoration: none; font-weight: 500;" href="#ai-system">AI 기반 감시 시스템, 무엇이 달라졌나</a><a style="color: #6a1b9a; text-decoration: none; font-weight: 500;" href="#penalty">주가조작 시, 어떤 제재가 가해질까?</a><a style="color: #6a1b9a; text-decoration: none; font-weight: 500;" href="#delisting">부실 상장사 퇴출 기준도 강화된다</a><a style="color: #6a1b9a; text-decoration: none; font-weight: 500;" href="#reporting">불공정거래를 목격했다면 이렇게 신고하세요</a></div>
</div>
<h2 id="what-is-out" style="font-size: 1.8rem; font-weight: bold; color: #4a148c; margin-top: 1.5em; margin-bottom: 0.8em; line-height: 1.2; border-left: 5px solid #9c27b0; padding-left: 0.8em; font-family: 'Noto Sans KR', sans-serif;">원스트라이크 아웃제도란 무엇인가?</h2>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">2025년부터 시행되는 &#8216;원스트라이크 아웃제도&#8217;는 자본시장 내 불공정거래를 한 번만 저질러도 즉시 퇴출될 수 있는 매우 강력한 제재 방식입니다. 과거에는 수차례 적발되어야 실질적인 퇴출로 이어졌지만, 이제는 주가조작, 내부자거래, 허위공시 등의 위반이 단 한 번만 있어도 심각한 불이익이 따르게 되죠.</p>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">특히 이번 제도에는 <b>불법이익 계좌의 즉시 지급정지, 과징금 최대 2배 부과, 임원 선임 및 금융거래 제한</b> 같은 복합적인 조치가 포함되어 있어요. 단순한 경고 수준이 아니라, 자본시장에서의 생명줄 자체를 끊는 셈이죠.</p>
<h2 id="why-now" style="font-size: 1.8rem; font-weight: bold; color: #4a148c; margin-top: 1.5em; margin-bottom: 0.8em; line-height: 1.2; border-left: 5px solid #9c27b0; padding-left: 0.8em; font-family: 'Noto Sans KR', sans-serif;">왜 지금 ‘원스트라이크 아웃’인가?</h2>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">최근 몇 년 사이, SNS와 유튜브를 통한 허위 정보 유포와 AI 기반 시세조종 같은 수법이 급증하면서 기존 제도로는 이를 감당하기 어려운 상황이었어요. 이런 배경 속에서 &#8216;한두 번쯤은 괜찮겠지&#8217;라는 생각 자체를 차단하고, 반복 범죄의 뿌리를 뽑기 위해 ‘원스트라이크 아웃제도’가 도입된 것입니다.</p>
<table style="width: 100%; border-collapse: collapse; margin: 1.5em 0; font-family: 'Noto Sans KR', sans-serif;" data-ke-align="alignLeft">
<thead>
<tr>
<th style="border: 1px solid #e1bee7; padding: 0.5em; text-align: left; background-color: #9c27b0; color: white; font-weight: bold;">기존 제도</th>
<th style="border: 1px solid #e1bee7; padding: 0.5em; text-align: left; background-color: #9c27b0; color: white; font-weight: bold;">신설 제도</th>
</tr>
</thead>
<tbody>
<tr>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">다수 위반 시 누적 제재</td>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">한 번의 위반으로 즉시 퇴출</td>
</tr>
<tr style="background-color: #f3e5f5;">
<td style="border: 1px solid #e1bee7; padding: 0.5em;">조사 이후 제재 조치</td>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">수사 전 단계에서 선제 차단</td>
</tr>
</tbody>
</table>
<h2 id="ai-system" style="font-size: 1.8rem; font-weight: bold; color: #4a148c; margin-top: 1.5em; margin-bottom: 0.8em; line-height: 1.2; border-left: 5px solid #9c27b0; padding-left: 0.8em; font-family: 'Noto Sans KR', sans-serif;">AI 기반 감시 시스템, 무엇이 달라졌나</h2>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">이번 제도 시행과 함께 자본시장 감시 시스템도 크게 바뀌었어요. 기존에는 계좌 단위의 감시였다면 이제는 <b>‘개인 식별 기반’</b> 분석으로 전환되었고, AI가 이상 거래를 정밀하게 탐지할 수 있게 되었죠.</p>
<ul style="margin-bottom: 1.2em; padding-left: 2em; list-style-type: none; color: #333; font-family: 'Noto Sans KR', sans-serif;">
<li style="margin-bottom: 0.5em; position: relative;">동일인 식별 기술로 연관 계좌 추적 가능</li>
<li style="margin-bottom: 0.5em; position: relative;">AI로 시세 관여율 분석 및 예측 가능</li>
<li style="margin-bottom: 0.5em; position: relative;">수사 전 단계에서 지급정지 등 선제 조치 가능</li>
</ul>
<h2 id="penalty" style="font-size: 1.8rem; font-weight: bold; color: #4a148c; margin-top: 1.5em; margin-bottom: 0.8em; line-height: 1.2; border-left: 5px solid #9c27b0; padding-left: 0.8em; font-family: 'Noto Sans KR', sans-serif;">주가조작 시, 어떤 제재가 가해질까?</h2>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">주가조작이 적발되면 이제는 단순한 과징금 수준에서 끝나지 않아요. ‘생활 전체를 뒤흔들 만큼의 제재’가 가해집니다. 말 그대로, 한 번의 위반이 인생의 큰 전환점이 될 수 있는 거죠.</p>
<h2 id="delisting" style="font-size: 1.8rem; font-weight: bold; color: #4a148c; margin-top: 1.5em; margin-bottom: 0.8em; line-height: 1.2; border-left: 5px solid #9c27b0; padding-left: 0.8em; font-family: 'Noto Sans KR', sans-serif;">부실 상장사 퇴출 기준도 강화된다</h2>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">‘원스트라이크 아웃제도’는 단지 불공정거래 적발자만 겨냥하는 것이 아닙니다. 부실 상장사들도 이제는 더 엄격한 기준에 따라 퇴출될 수 있어요. 투자자 입장에서는 보다 안전한 환경에서 거래하게 되는 거죠.</p>
<table style="width: 100%; border-collapse: collapse; margin: 1.5em 0; font-family: 'Noto Sans KR', sans-serif;" data-ke-align="alignLeft">
<thead>
<tr>
<th style="border: 1px solid #e1bee7; padding: 0.5em; text-align: left; background-color: #9c27b0; color: white; font-weight: bold;">강화 항목</th>
<th style="border: 1px solid #e1bee7; padding: 0.5em; text-align: left; background-color: #9c27b0; color: white; font-weight: bold;">내용</th>
</tr>
</thead>
<tbody>
<tr>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">시가총액·매출액 기준</td>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">기존보다 상향 조정되어 일정 수준 미달 시 퇴출</td>
</tr>
<tr style="background-color: #f3e5f5;">
<td style="border: 1px solid #e1bee7; padding: 0.5em;">감사의견</td>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">2년 연속 비적정 의견 시 즉시 상장폐지</td>
</tr>
<tr>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">코스닥 퇴출 심사</td>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">단심제로 간소화되어 신속한 조치 가능</td>
</tr>
</tbody>
</table>
<h2 id="reporting" style="font-size: 1.8rem; font-weight: bold; color: #4a148c; margin-top: 1.5em; margin-bottom: 0.8em; line-height: 1.2; border-left: 5px solid #9c27b0; padding-left: 0.8em; font-family: 'Noto Sans KR', sans-serif;">불공정거래를 목격했다면 이렇게 신고하세요</h2>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">혹시 주가조작이나 허위 정보 유포 같은 장면을 직접 목격했다면? 지금 바로 아래 경로로 신고할 수 있습니다. 신고자는 철저히 보호되고, 보상금도 지급되니 적극적인 참여가 필요해요.</p>
<ul style="margin-bottom: 1.2em; padding-left: 2em; list-style-type: none; color: #333; font-family: 'Noto Sans KR', sans-serif;">
<li style="margin-bottom: 0.5em; position: relative;">인터넷 접수: 시장감시위원회 불공정거래신고센터</li>
<li style="margin-bottom: 0.5em; position: relative;">전화 접수: 1577-0088</li>
<li style="margin-bottom: 0.5em; position: relative;">익명 보장 + 보상금 제도 운영 중</li>
</ul>
<div style="margin: 2em 0; font-family: 'Noto Sans KR', sans-serif;">
<div style="font-weight: bold; color: #9c27b0; font-size: 1.5rem; margin-bottom: 1em;">자주 묻는 질문 (FAQ)</div>
<div style="margin-bottom: 2em;">
<div style="font-weight: bold; color: #9c27b0; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #9c27b0; color: white; border-radius: 50%; margin-right: 8px;">Q</span> &#8216;원스트라이크 아웃제도&#8217;는 모든 자본시장 범죄에 적용되나요?</div>
<div style="margin-left: 32px; margin-bottom: 1em;">
<p style="margin: 0; line-height: 1.6;">아니요. 주가조작, 허위공시, 내부자거래 등 중대 불공정거래 행위에만 적용됩니다. 단순 실수나 행정 오류는 제외돼요.</p>
</div>
<div style="font-weight: bold; color: #6a1b9a; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #6a1b9a; color: white; border-radius: 50%; margin-right: 8px;">A</span> 적용 대상은 중대한 자본시장 범죄</div>
</div>
<div style="margin-bottom: 2em;">
<div style="font-weight: bold; color: #9c27b0; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #9c27b0; color: white; border-radius: 50%; margin-right: 8px;">Q</span> 제보자가 보복을 당할 위험은 없나요?</div>
<div style="margin-left: 32px; margin-bottom: 1em;">
<p style="margin: 0; line-height: 1.6;">불공정거래 신고 시스템은 익명성을 보장하며, 신원 노출 시 법적으로도 보호 조치가 적용됩니다.</p>
</div>
<div style="font-weight: bold; color: #6a1b9a; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #6a1b9a; color: white; border-radius: 50%; margin-right: 8px;">A</span> 제보자는 철저히 보호됩니다</div>
</div>
<div style="margin-bottom: 2em;">
<div style="font-weight: bold; color: #9c27b0; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #9c27b0; color: white; border-radius: 50%; margin-right: 8px;">Q</span> 과거 범죄 이력도 적용 대상인가요?</div>
<div style="margin-left: 32px; margin-bottom: 1em;">
<p style="margin: 0; line-height: 1.6;">2025년 7월 이후 발생한 범죄에 대해서만 적용되며, 과거 이력은 참고자료로만 활용됩니다.</p>
</div>
<div style="font-weight: bold; color: #6a1b9a; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #6a1b9a; color: white; border-radius: 50%; margin-right: 8px;">A</span> 시행일 이후 사건만 해당됩니다</div>
</div>
<div style="margin-bottom: 2em;">
<div style="font-weight: bold; color: #9c27b0; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #9c27b0; color: white; border-radius: 50%; margin-right: 8px;">Q</span> 상장사 퇴출은 누가 결정하나요?</div>
<div style="margin-left: 32px; margin-bottom: 1em;">
<p style="margin: 0; line-height: 1.6;">한국거래소에서 심사 기준에 따라 단심제로 결정하며, 이의제기 절차는 제한됩니다.</p>
</div>
<div style="font-weight: bold; color: #6a1b9a; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #6a1b9a; color: white; border-radius: 50%; margin-right: 8px;">A</span> 거래소 단심제로 신속 결정</div>
</div>
<div style="margin-bottom: 2em;">
<div style="font-weight: bold; color: #9c27b0; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #9c27b0; color: white; border-radius: 50%; margin-right: 8px;">Q</span> 금융감독원도 수사권이 있나요?</div>
<div style="margin-left: 32px; margin-bottom: 1em;">
<p style="margin: 0; line-height: 1.6;">수사권은 없지만, 금융위·거래소·검찰과 협조하여 강제조사 요청 및 자료 공유가 가능합니다.</p>
</div>
<div style="font-weight: bold; color: #6a1b9a; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #6a1b9a; color: white; border-radius: 50%; margin-right: 8px;">A</span> 협조 기반 강제조사 요청 가능</div>
</div>
<div style="margin-bottom: 2em;">
<div style="font-weight: bold; color: #9c27b0; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #9c27b0; color: white; border-radius: 50%; margin-right: 8px;">Q</span> 실수로 위반한 경우도 퇴출되나요?</div>
<div style="margin-left: 32px; margin-bottom: 1em;">
<p style="margin: 0; line-height: 1.6;">고의성이 입증되지 않은 경우 경고 또는 시정명령 수준으로 그칩니다. 단, 반복 실수는 예외가 될 수 있어요.</p>
</div>
<div style="font-weight: bold; color: #6a1b9a; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #6a1b9a; color: white; border-radius: 50%; margin-right: 8px;">A</span> 단순 실수는 유예될 수 있음</div>
</div>
</div>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">2025년부터 전면 시행된 ‘원스트라이크 아웃제도’는 단순히 규제를 강화한 수준이 아닙니다. 시장의 체질을 바꾸는 강력한 선언이자, 투자자 보호를 위한 결정적 수단이죠. 이제는 투자자 스스로도 더욱 책임 있는 판단이 필요해졌어요. 여러분은 어떻게 생각하시나요? 댓글로 여러분의 생각을 나눠주세요. 그리고 이 글이 유익했다면, 주변에도 꼭 공유해 주세요!</p>
<p style="font-size: 0.9rem; line-height: 1.6; color: #666; font-family: 'Noto Sans KR', sans-serif;">투자자 보호, 자본시장 개혁, 주가조작, 불공정거래, 원스트라이크아웃, 상장폐지, 감시제도, 금융정책, AI감시, 코스닥기준</p>
<p style="font-size: 0.9rem; line-height: 1.6; color: #666; font-family: 'Noto Sans KR', sans-serif;"><a style="background-color: #e6f5ff; color: #0070d1; text-align: start;" href="https://aboda.kr/entry/%EC%BD%94%EC%8A%A4%ED%94%BC-%EB%A7%A4%EB%8F%84-%EC%82%AC%EC%9D%B4%EB%93%9C%EC%B9%B4-%EB%B0%9C%EB%8F%99-%EB%A7%A4%EB%8F%84-%EC%8B%A4%EB%A6%AC-%EC%97%84%EC%B2%AD%EB%82%98" target="_blank" rel="noopener">2025.04.07 &#8211; [경제상식/주식] &#8211; 코스피 매도 사이드카 발동, 매도 실리 엄청나</a></p>
<p><a href="https://2days.kr/27/08/20/45946/lifestyle/whats-hot/">주식의 기초정보(코스피와 코스닥,지수)</a></p>
<!-- CONTENT END 18 -->
]]></content:encoded>
					
		
		
		<media:content url="https://i1.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-68-1024x559.png?ssl=1" medium="image"></media:content>
            	</item>
		<item>
		<title>키보드 입력 한 줄로 만드는 게임? Mirage AI 실시간 게임 생성의 미래</title>
		<link>https://2days.kr/14/07/12/64637/it/program/</link>
		
		<dc:creator><![CDATA[urjent]]></dc:creator>
		<pubDate>Mon, 14 Jul 2025 03:35:28 +0000</pubDate>
				<category><![CDATA[program]]></category>
		<guid isPermaLink="false">https://2days.kr/?p=64637</guid>

					<description><![CDATA[키보드 입력 한 줄로 만드는 게임? Mirage AI 실시간 게임 생성의 미래 게임 만드는 게 코딩보다 쉬운 세상? 이제는 한 문장만으로도 게임을 만들 수 있어요! 안녕하세요, 요즘 기술 뉴스 볼 때마다 놀랄 일이 너무 많지 않나요? 특히 저는 게임을 좋아하는 사람으로서 Mirage AI라는 이름을 처음 들었을 때, 솔직히 &#8216;또 뻔한 데모겠지&#8217; 싶었어요. 근데요, 진짜 해보고 [&#8230;]]]></description>
										<content:encoded><![CDATA[<p style="font-size: 1.1rem; line-height: 1.8; margin-bottom: 1.2em; color: #6a1b9a; font-weight: 500; font-family: 'Noto Sans KR', sans-serif;"><span style="color: #000000;">키보드 입력 한 줄로 만드는 게임? Mirage AI 실시간 게임 생성의 미래 게임 만드는 게 코딩보다 쉬운 세상? 이제는 한 문장만으로도 게임을 만들 수 있어요!</span></p>
<p style="font-size: 1.1rem; line-height: 1.8; margin-bottom: 1.2em; color: #6a1b9a; font-weight: 500; font-family: 'Noto Sans KR', sans-serif;"><span style="color: #000000;">안녕하세요, 요즘 기술 뉴스 볼 때마다 놀랄 일이 너무 많지 않나요? 특히 저는 게임을 좋아하는 사람으로서 Mirage AI라는 이름을 처음 들었을 때, 솔직히 &#8216;또 뻔한 데모겠지&#8217; 싶었어요. 근데요, 진짜 해보고 나니까&#8230; 완전 충격! 😲 그냥 키보드에 &#8220;도시가 폭발하는 게임 보여줘&#8221;라고 치니까 GTA 느낌의 장면이 눈앞에 펼쳐지더라고요. 여러분도 저처럼 게임을 직접 만들어보는 게 꿈이었다면, 이 글 꼭 끝까지 읽어주세요. 뭔가 새로운 세상이 열리고 있다는 느낌, 진짜예요.</span></p>
<h3 style="line-height: 1.8; margin-bottom: 1.2em; color: #6a1b9a; font-weight: 500; font-family: 'Noto Sans KR', sans-serif;" data-ke-size="size23"><b><span style="color: #000000;">키보드 입력 한 줄로 만드는 게임? Mirage AI 실시간 게임 생성의 미래</span></b></h3>
<figure data-ke-type="image" data-ke-mobilestyle="widthOrigin" data-ke-style="alignCenter">
<p><figure id="attachment_64639" aria-describedby="caption-attachment-64639" style="width: 696px" class="wp-caption aligncenter"><img loading="lazy" decoding="async" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" fifu-lazy="1" fifu-data-sizes="auto" fifu-data-srcset="https://i2.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-62-1024x559.png?ssl=1&amp;w=75&amp;resize=75&amp;ssl=1 75w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-62-1024x559.png?ssl=1&amp;w=100&amp;resize=100&amp;ssl=1 100w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-62-1024x559.png?ssl=1&amp;w=150&amp;resize=150&amp;ssl=1 150w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-62-1024x559.png?ssl=1&amp;w=240&amp;resize=240&amp;ssl=1 240w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-62-1024x559.png?ssl=1&amp;w=320&amp;resize=320&amp;ssl=1 320w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-62-1024x559.png?ssl=1&amp;w=500&amp;resize=500&amp;ssl=1 500w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-62-1024x559.png?ssl=1&amp;w=640&amp;resize=640&amp;ssl=1 640w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-62-1024x559.png?ssl=1&amp;w=800&amp;resize=800&amp;ssl=1 800w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-62-1024x559.png?ssl=1&amp;w=1024&amp;resize=1024&amp;ssl=1 1024w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-62-1024x559.png?ssl=1&amp;w=1280&amp;resize=1280&amp;ssl=1 1280w, https://i2.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-62-1024x559.png?ssl=1&amp;w=1600&amp;resize=1600&amp;ssl=1 1600w" class="wp-image-64639 size-large" fifu-data-src="https://i2.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-62-1024x559.png?ssl=1" alt="키보드 입력 한 줄로 만드는 게임? Mirage AI 실시간 게임 생성의 미래" width="696" height="380" loading="lazy" title="키보드 입력 한 줄로 만드는 게임? Mirage AI 실시간 게임 생성의 미래 31"><figcaption id="caption-attachment-64639" class="wp-caption-text">키보드 입력 한 줄로 만드는 게임? Mirage AI 실시간 게임 생성의 미래</figcaption></figure></figure><div class='code-block code-block-2' style='margin: 8px auto; text-align: center; display: block; clear: both;'>
<!-- 중간 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8940400388075870"
     data-ad-slot="8794586137"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script></div>

<div style="background: linear-gradient(135deg, #f5f0ff, #f0e6ff); border-radius: 8px; padding: 20px; margin: 20px 0; box-shadow: 0 4px 10px rgba(106, 27, 154, 0.08); font-family: 'Noto Sans KR', sans-serif; border-left: 4px solid #9c27b0;">
<div style="margin-bottom: 15px;">
<h3 style="font-weight: bold; color: #4a148c; font-size: 18px; margin: 0;">목차</h3>
</div>
<div style="display: flex; flex-direction: column; gap: 10px;"><a style="color: #6a1b9a; text-decoration: none; font-weight: 500;" href="#what-is-mirage">Mirage AI란 무엇인가?</a><a style="color: #6a1b9a; text-decoration: none; font-weight: 500;" href="#key-features">Mirage AI의 핵심 기능 살펴보기</a><a style="color: #6a1b9a; text-decoration: none; font-weight: 500;" href="#demo-experience">직접 체험해본 데모 소개</a><a style="color: #6a1b9a; text-decoration: none; font-weight: 500;" href="#current-limitations">아직은 아쉬운 점들</a><a style="color: #6a1b9a; text-decoration: none; font-weight: 500;" href="#future-potential">Mirage AI의 미래 가능성</a><a style="color: #6a1b9a; text-decoration: none; font-weight: 500;" href="#final-thoughts">정리하며: 게임 제작의 새로운 시대</a></div>
</div>
<h2 id="what-is-mirage" style="font-size: 1.8rem; font-weight: bold; color: #4a148c; margin-top: 1.5em; margin-bottom: 0.8em; line-height: 1.2; border-left: 5px solid #9c27b0; padding-left: 0.8em; font-family: 'Noto Sans KR', sans-serif;">Mirage AI란 무엇인가?</h2>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">Mirage AI는 Dynamics Lab에서 개발한 혁신적인 실시간 AI 게임 생성 플랫폼입니다. 간단히 말해서, 사용자가 한 문장 정도의 텍스트나 키보드 조작만으로도 게임 세계를 만들어낼 수 있는 기술이에요. 기존의 게임 제작은 엄청난 리소스와 시간이 필요했죠. 그런데 Mirage AI는 그런 제작 과정을 생략하고, <b>즉석에서 게임 콘텐츠를 생성해주는</b> 거예요. 예를 들면, &#8220;좀비가 등장하는 폐허 도시를 보여줘!&#8221;라고 입력하면 바로 그런 장면이 펼쳐집니다. 뭔가 영화 속 기술이 현실로 나타난 느낌이에요.</p>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;"><a href="https://blog.dynamicslab.ai/" target="_blank" rel="noopener">https://blog.dynamicslab.ai/</a></p>
<figure id="og_1752462714826" contenteditable="false" data-ke-type="opengraph" data-ke-align="alignCenter" data-og-type="website" data-og-title="Mirage: AI UGC game engine" data-og-description="The future of gaming isn't built level by level by expert designers—it's imagined, generated, and played by anyone, in real time. Meet Mirage: the world's first real-time generative engine enabling live UGC gameplay through state-of-the-art AI World Mode" data-og-host="blog.dynamicslab.ai" data-og-source-url="https://blog.dynamicslab.ai/" data-og-url="https://blog.dynamicslab.ai/" data-og-image="https://2days.kr/wp-content/uploads/rehost/8d/8d8d376457781373589d48f451e9ccec9388f05d.png">
<div class="og-image"></div>
<div class="og-text">
<p class="og-title">Mirage: AI UGC game engine</p>
<p class="og-desc">The future of gaming isn&#8217;t built level by level by expert designers—it&#8217;s imagined, generated, and played by anyone, in real time. Meet Mirage: the world&#8217;s first real-time generative engine enabling live UGC gameplay through state-of-the-art AI World Mode</p>
<p class="og-host">blog.dynamicslab.ai</p>
</div>
</figure>
<h2 id="key-features" style="font-size: 1.8rem; font-weight: bold; color: #4a148c; margin-top: 1.5em; margin-bottom: 0.8em; line-height: 1.2; border-left: 5px solid #9c27b0; padding-left: 0.8em; font-family: 'Noto Sans KR', sans-serif;">Mirage AI의 핵심 기능 살펴보기</h2>
<figure data-ke-type="image" data-ke-mobilestyle="widthOrigin" data-ke-style="alignCenter"><figcaption>

</figcaption></figure>
<table style="width: 100%; border-collapse: collapse; margin: 1.5em 0; font-family: 'Noto Sans KR', sans-serif;" data-ke-align="alignLeft">
<thead>
<tr>
<th style="border: 1px solid #e1bee7; padding: 0.5em; text-align: left; background-color: #9c27b0; color: white; font-weight: bold;">기능</th>
<th style="border: 1px solid #e1bee7; padding: 0.5em; text-align: left; background-color: #9c27b0; color: white; font-weight: bold;">설명</th>
</tr>
</thead>
<tbody>
<tr>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">실시간 생성</td>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">플레이 도중에도 환경, 객체 등을 즉시 생성</td>
</tr>
<tr style="background-color: #f3e5f5;">
<td style="border: 1px solid #e1bee7; padding: 0.5em;">포토리얼 그래픽</td>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">현실감 있는 그래픽과 물리 기반 렌더링 제공</td>
</tr>
<tr>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">프롬프트 기반 인터랙션</td>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">자연어 한 줄로 장면 및 시나리오 구현 가능</td>
</tr>
<tr style="background-color: #f3e5f5;">
<td style="border: 1px solid #e1bee7; padding: 0.5em;">Transformer + Diffusion</td>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">시간 흐름과 시각 묘사 동시 처리</td>
</tr>
</tbody>
</table>
<h2 id="demo-experience" style="font-size: 1.8rem; font-weight: bold; color: #4a148c; margin-top: 1.5em; margin-bottom: 0.8em; line-height: 1.2; border-left: 5px solid #9c27b0; padding-left: 0.8em; font-family: 'Noto Sans KR', sans-serif;">직접 체험해본 데모 소개</h2>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">제가 실제로 체험해본 데모는 <b>Urban Chaos</b>와 <b>Coastal Drift</b> 두 가지였어요. 각각 도심 속 혼돈과 해안 드라이브를 테마로 하는 게임인데, 모두 Mirage AI가 실시간으로 생성해주는 거예요.</p>
<ul style="margin-bottom: 1.2em; padding-left: 2em; list-style-type: none; color: #333; font-family: 'Noto Sans KR', sans-serif;">
<li style="margin-bottom: 0.5em; position: relative;">Urban Chaos: GTA 스타일, 도시 파괴 및 차량 조작 가능 <a href="https://demo.dynamicslab.ai/chaos" target="_blank" rel="noopener">https://demo.dynamicslab.ai/chaos</a></li>
<li style="margin-bottom: 0.5em; position: relative;">Coastal Drift: Forza Horizon 느낌, 해안 도로에서 질주 체험 <a href="https://demo.dynamicslab.ai/drift" target="_blank" rel="noopener">https://demo.dynamicslab.ai/drift</a></li>
</ul>
<h2 id="current-limitations" style="font-size: 1.8rem; font-weight: bold; color: #4a148c; margin-top: 1.5em; margin-bottom: 0.8em; line-height: 1.2; border-left: 5px solid #9c27b0; padding-left: 0.8em; font-family: 'Noto Sans KR', sans-serif;">아직은 아쉬운 점들</h2>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">Mirage AI는 정말 인상적인 기술이지만, 아직 완벽하다고 보기엔 조금 이른 단계입니다. 특히 해상도나 프레임 속도는 현재 SD급에 머물러 있고, 복잡한 장면에서는 약간의 딜레이도 느껴져요. 그리고 <b>개발자 도구(API, SDK)</b>가 제공되지 않아 일반 유저 이상의 활용은 불가능한 상황입니다.</p>
<table style="width: 100%; border-collapse: collapse; margin: 1.5em 0; font-family: 'Noto Sans KR', sans-serif;" data-ke-align="alignLeft">
<thead>
<tr>
<th style="border: 1px solid #e1bee7; padding: 0.5em; text-align: left; background-color: #9c27b0; color: white; font-weight: bold;">제한 요소</th>
<th style="border: 1px solid #e1bee7; padding: 0.5em; text-align: left; background-color: #9c27b0; color: white; font-weight: bold;">현재 상황</th>
</tr>
</thead>
<tbody>
<tr>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">해상도/프레임</td>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">SD급, 약 16FPS</td>
</tr>
<tr style="background-color: #f3e5f5;">
<td style="border: 1px solid #e1bee7; padding: 0.5em;">시각적 일관성</td>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">단기적 연결은 양호하나 장기성 부족</td>
</tr>
<tr>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">개발자 접근성</td>
<td style="border: 1px solid #e1bee7; padding: 0.5em;">API/SDK 미공개</td>
</tr>
</tbody>
</table>
<h2 id="future-potential" style="font-size: 1.8rem; font-weight: bold; color: #4a148c; margin-top: 1.5em; margin-bottom: 0.8em; line-height: 1.2; border-left: 5px solid #9c27b0; padding-left: 0.8em; font-family: 'Noto Sans KR', sans-serif;">Mirage AI의 미래 가능성</h2>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">Dynamics Lab은 Mirage를 단순한 체험형 AI가 아닌, <b>진짜 ‘창작 플랫폼’</b>으로 키우고자 하고 있어요. 그 비전이 정말 멋있더라고요. 공식 블로그에서도 &#8220;Not just PLAY—but CREATE&#8221;라는 문장을 강조하듯이, 단순한 플레이를 넘어 함께 만들어가는 환경을 지향합니다.</p>
<ul style="margin-bottom: 1.2em; padding-left: 2em; list-style-type: none; color: #333; font-family: 'Noto Sans KR', sans-serif;">
<li style="margin-bottom: 0.5em; position: relative;">모바일, VR/AR, 콘솔 확장 계획</li>
<li style="margin-bottom: 0.5em; position: relative;">멀티 유저 협업 기능 및 공동 프롬프트 편집 가능성</li>
<li style="margin-bottom: 0.5em; position: relative;">베타 API/SDK 공개 예정 소식</li>
</ul>
<h2 id="final-thoughts" style="font-size: 1.8rem; font-weight: bold; color: #4a148c; margin-top: 1.5em; margin-bottom: 0.8em; line-height: 1.2; border-left: 5px solid #9c27b0; padding-left: 0.8em; font-family: 'Noto Sans KR', sans-serif;">정리하며 게임 제작의 새로운 시대</h2>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">Mirage AI는 단순한 AI 데모를 넘어서, 우리가 알고 있던 게임 제작 패러다임을 완전히 뒤집는 기술이에요. 물론 아직은 부족한 점도 많지만, 분명히</p>
<p><mark style="background-color: #e1bee7; color: #6a1b9a; padding: 0 3px; border-radius: 2px; font-family: 'Noto Sans KR', sans-serif;">우리가 기대해온 미래에 가장 가까운 게임 도구</mark></p>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">중 하나입니다.</p>
<div style="margin: 1.5em 0; font-family: 'Noto Sans KR', sans-serif;">
<div style="font-weight: bold; color: #9c27b0; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #9c27b0; color: white; border-radius: 50%; margin-right: 8px;">Q</span> Mirage AI는 일반 사용자가 게임을 만들 수 있나요?</div>
<div style="margin-left: 32px; margin-bottom: 1em;">
<p style="margin: 0; line-height: 1.6;">네, 가능합니다. 현재는 데모 환경 위주이지만, 키보드 입력이나 간단한 명령어로 누구나 게임을 생성할 수 있어요.</p>
</div>
<div style="font-weight: bold; color: #9c27b0; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #9c27b0; color: white; border-radius: 50%; margin-right: 8px;">Q</span> Mirage AI는 무료인가요?</div>
<div style="margin-left: 32px; margin-bottom: 1em;">
<p style="margin: 0; line-height: 1.6;">현재 공개된 데모 버전은 무료로 체험 가능합니다. 향후 유료화 여부는 아직 발표되지 않았어요.</p>
</div>
<div style="font-weight: bold; color: #9c27b0; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #9c27b0; color: white; border-radius: 50%; margin-right: 8px;">Q</span> 데모를 사용하려면 설치가 필요한가요?</div>
<div style="margin-left: 32px; margin-bottom: 1em;">
<p style="margin: 0; line-height: 1.6;">아니요, 별도 설치 없이 브라우저에서 바로 실행됩니다. WebRTC 기반의 스트리밍 방식이에요.</p>
</div>
<div style="font-weight: bold; color: #9c27b0; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #9c27b0; color: white; border-radius: 50%; margin-right: 8px;">Q</span> Mirage AI는 어떤 기술로 만들어졌나요?</div>
<div style="margin-left: 32px; margin-bottom: 1em;">
<p style="margin: 0; line-height: 1.6;">Transformer 기반 시퀀스 모델과 Diffusion 시각 생성기를 혼합한 구조를 사용하고 있어요.</p>
</div>
<div style="font-weight: bold; color: #9c27b0; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #9c27b0; color: white; border-radius: 50%; margin-right: 8px;">Q</span> 다른 사람과 함께 게임을 만들 수 있나요?</div>
<div style="margin-left: 32px; margin-bottom: 1em;">
<p style="margin: 0; line-height: 1.6;">아직은 멀티 유저 기능은 없지만, 향후 협업형 콘텐츠 제작 기능이 도입될 가능성이 있습니다.</p>
</div>
<div style="font-weight: bold; color: #9c27b0; margin-bottom: 0.5em; font-size: 1.1rem;"><span style="display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; background-color: #9c27b0; color: white; border-radius: 50%; margin-right: 8px;">Q</span> Mirage AI 데모 링크는 어디서 확인할 수 있나요?</div>
<div style="margin-left: 32px;">
<p style="margin: 0; line-height: 1.6;">공식 데모 페이지에서 확인할 수 있어요. <a style="color: #8e24aa; text-decoration: none; font-weight: bold;" href="https://demo.dynamicslab.ai/chaos" target="_blank" rel="noopener">Urban Chaos</a>, <a style="color: #8e24aa; text-decoration: none; font-weight: bold;" href="https://demo.dynamicslab.ai/drift" target="_blank" rel="noopener">Coastal Drift</a>를 직접 플레이해보세요!</p>
</div>
</div>
<p style="font-size: 1rem; line-height: 1.8; margin-bottom: 1.2em; color: #333; font-family: 'Noto Sans KR', sans-serif;">요즘은 기술이라는 게 하루가 다르게 발전하잖아요. 근데 그 중심에 Mirage AI 같은 도구가 있다는 사실, 솔직히 좀 놀랍지 않나요? 이 글을 통해 저처럼 &#8216;게임은 해봤지만 만들어본 적은 없는&#8217; 분들에게도 새로운 세상이 열리고 있다는 걸 느끼셨길 바래요. 한 문장만으로도 상상하던 세계가 펼쳐지는 경험, 꼭 한 번 해보세요. 그리고 댓글이나 이메일로 여러분의 체험담도 공유해 주세요! 우리 함께 이 미래를 만들어가요. 💜</p>
<p style="font-size: 0.95rem; color: #666; font-family: 'Noto Sans KR', sans-serif;">Mirage AI, 게임 생성 AI, 실시간 게임 제작, 프롬프트 기반 게임, Dynamics Lab, Urban Chaos 데모, Coastal Drift 데모, 게임 엔진 혁신, AI</p>
<p><a href="https://aboda.kr/entry/GPT%EC%99%80-MCP-%EC%97%B0%EB%8F%99-Notion%EC%9D%84-%EB%B6%84%EC%84%9D%ED%95%98%EB%8A%94-AI-%EB%8F%84%EA%B5%AC-%EB%A7%8C%EB%93%A4%EA%B8%B0" target="_blank" rel="noopener">2025.07.10 &#8211; [제품추천/IT] &#8211; GPT와 MCP 연동 Notion을 분석하는 AI 도구 만들기</a></p>
<p><a href="https://2days.kr/24/06/10/64187/contents/">Lovable 웹사이트 AI 몇 분 만에 프로 수준으로 만들기</a></p>
<!-- CONTENT END 20 -->
]]></content:encoded>
					
		
		
		<media:content url="https://i2.wp.com/2days.kr/wp-content/uploads/2025/07/Image_fx-62-1024x559.png?ssl=1" medium="image"></media:content>
            	</item>
	</channel>
</rss>
