소개
기존에 lovable로 제작되어 있던 회사 홈페이지를, Claude Code의 Skill 기능과 apps SDK를 활용하여 ChatGPT 앱으로 빠르게 변환해보았습니다.
새로운 기능을 추가하거나 전혀 다른 구조를 만드는 게 아닌, 이미 존재하던 웹페이지의 기능을 그대로 옮기되, 사용자의 사용 흐름에 맞게 인터페이스를 재설계하는 것이 핵심 목표였습니다.
진행 방법
사용 도구
Claude Code (Skill 기능)
OpenAI apps SDK
기존 lovable 기반 웹사이트
진행 절차
기존 웹페이지에서 주요 기능을 식별
Claude Code에서 Skill 단위로 해당 기능을 구성
ChatGPT 앱 내부에서 각 기능을 호출할 수 있도록 Skill 연결
사용자 인터페이스 흐름을 앱 기준으로 재설계
주의 할 점
작업 요청을 원래 홈페이지가 있는 프로젝트에서 했더니, 앱은 기존에 ChatGPT 앱을 만들어둔 프로젝트에 생성되는 현상 발생
결과와 배운 점
기존 웹사이트도 얼마든지 ChatGPT 앱으로 전환 가능
핵심은 Skill의 구성에 있음
잘 설계된 Skill만 있다면 기존이든 신규든 앱 구현이 수월함
하지만 이 Skill을 만들기 위해선 설계와 구현에 꽤 노력이 들어감
프로젝트 구조 이해도 중요
앱 생성 위치가 예상과 다르게 생성되어 당황할 수 있으니 사전 구조 파악 필요
도움 받은 글 (옵션)
Claude Code 공식 문서
OpenAI apps SDK 가이드
📝 한 줄 메시지:
"스킬 구성이 잘 되어 있다면 기존이든 신규든 앱화가 어렵지 않다. 다만 스킬을 잘 만들려면 그만한 준비가 필요!"
