(내가 쓰려고 만든) 팟캐스트 iOS앱 제작기 #1 - 웹앱 마이그레이션

웹앱 제작기 3편에 이어 4편을 쓸 차례지만 갑작스럽게 앱 제작기 1편을 쓰고 있다. 아무래도 웹앱은 사용성에 한계가 있고 뽀대(?)가 안 나서 언젠가 앱으로 다시 만들 생각은 했었다.

https://bongman.tistory.com/1197

(내가 쓰려고 만드는) 간단한 팟캐스트 웹앱 제작기 #3

어제 노트북을 집에 두고 학교에 갔다. 책 한 권 들고 도서관에 앉아 있는데 문득 Claude Code 웹 버전이 생각났다.

 

Claude Code on the web 소개

https://claude.com/blog/claude-code-on-the-web

Claude Code on the web | Claude

팟캐스트 웹앱 코드는 github 저장소에 모두 올려놨는데 Claude Code 웹 버전은 github 저장소 기반으로 작동한다. 그렇다면 (로컬에 소스 코드가 저장된) 노트북 없이 스마트폰 브라우저로 '해줘'만 하면 앱 제작이 얼추 가능하지 않을까 하는 데에까지 생각이 미쳤다. 참고로 Claude Code 웹 버전은 다음과 같이 방법으로 접근할 수 있다.

친숙한 Claude 페이지(https://claude.ai/) 또는 데스크탑 앱에서 왼쪽 사이드바의 '</>코드' 메뉴를 클릭하면 아래와 같은 모습의 페이지(https://claude.ai/code)로 전환된다.

반응형

대략 이런 느낌이다. 채팅창 바로 아래에 github 저장소를 선택하는 메뉴가 보인다. Claude Code 웹 버전은 Pro와 Max 유저한테만 리서치 프리뷰 형태로 제공된다고 하니 아직 못 보신 분들도 있을 듯하다. 나도 실제 사용한 것은 이번이 처음이었다.

 

모바일 브라우저(Chrome)에서 Xcode 프로젝트 생성 및 구현

아이폰의 Chrome 앱에서 작업을 요청했고 대략 10분 정도 걸린 것 같다. 계획만 세우라고 했는데 구현까지 쭉쭉 진행되더니 브랜치를 생성해고 github 저장소에 푸시까지 해버려서 살짝 당황했다. Xcode 프로젝트까지 생성된 것은 확인했지만 실제 빌드나 실행도 잘 될 거라는 확신은 없었다.

 

Claude Code Web으로 만든 Xcode 프로젝트 빌드 성공

수업이 끝나고 집에 와서 Xcode 상에서 프로젝트가 잘 열어서 빌드를 진행했다. 오류 없이 성공했다. 잠시나마 Claude님을 의심하고 불경스러운 마음을 품은 미천한 소인을 용서하소서.

프로그래스 바, 재생/일시정지 버튼 등에 자잘한 오류가 있어서 핑퐁을 몇 번 하긴 했지만 주요 기능이 별다른 문제없이 잘 동작했다. 결과적으로 기존 웹앱 프로젝트가 매끄럽게 iOS 앱 프로젝트로 마이그레이션 됐다. 여기서 끝내기는 아까워서 살짝 다듬은 뒤에 앱스토어에도 올릴 생각이다. 아, 그리고 기존 저장소 이름 뒤에  'ios-app'을 붙인 새 저장소를 만들어서 옮겼다.

https://github.com/Hamjoon/simple-podcast-ios-app

GitHub - Hamjoon/simple-podcast-ios-app

README에도 써놨지만 서버 쪽 코드를 별도 프로젝트로 분리할 예정이다. 끝.