클로드는 훌륭한 프로그래밍 과외 선생님

프로젝트 데이비드: 다시 개발을 시작하다

by 안영회 습작

16년 만에 다시 프로그래밍 역량을 회복하려고 합니다

<인공지능과 함께 처음 만들고 배포한 우리 가족용 앱>을 계기로 2010년 겨울 이후 손을 놓았던 개발을 다시 시작합니다.


긴 시간이 흘러 많은 것이 바뀌었는데, 여기 대응하는 가장 중요한 원칙은 <작업할 때 항상 AI를 초대한다>입니다. 오랫동안 이 분야에서 일해 온 저에게는 일종의 <언러닝> 프로젝트이기도 합니다.


아무튼 시작은 <인공지능과 함께 처음 만들고 배포한 우리 가족용 앱>의 코드에서 시작합니다.

index.tsx 는 아주 간단한 파일이지만, 자동화된 테스트 코드를 만들어 주세요.

개발은 동료에게 위임하기는 했지만 프로그래밍 분야에 인공지능이 어떻게 쓰이는지 모니터링을 해 왔습니다. 그 과정에서 사용 경험이 있었던 Cursor를 다시 만나게 됩니다.


소프트웨어도 지속적으로 재구성해야 살아남는다

즉각적으로, 다시 말해 거의 무의식적으로 테스트 코드 추가를 시도했습니다. 제가 만들지 않은 코드로 결과가 나온 것은 좋지만, 향후에 이를 계속 활용할 수 있을지는 미지수입니다. 오랫동안 이 분야에서 일한 경험이 작동한 것이라 할 수 있습니다. 바이브 코딩은 다른 사람이 짠 알 수 없는 코드란 점에서 도처에서 만나는 레거시 코드와 같습니다. 얼마 전에 <소프트웨어도 지속적으로 재구성해야 살아남을 수 있다>를 쓴 일이 있는데요.


견고한 실행 기반으로 코드를 보는 입장은 바이브 코딩을 할 때와는 다른 목표와 관점이 생깁니다.

스크린샷 2026-03-13 오전 8.40.20.png


인공지능 도구들에게 테스트 코드 작성을 위임하다

그래서, 커서에게 블랙박스의 코드에 대해 테스트 코드를 만들어 달라고 요청했습니다.

여러 가지 일이 벌어집니다. 대신 뭔가를 해 준다는 점은 만족스럽지만, 개발자라면 불안한 마음도 있을 거라고 봅니다. 제미나이의 표현을 빌면 '개발자답다면', 확장성(Scalability)제어권(Control)을 확보하기 위해 시스템 제어, 데이터의 흐름 설계, 컴파일과 빌드 파이프라인 같은 요소들을 다룰 수 있어야 합니다.


하지만, 짧은 경험이지만 바이브 코딩을 한다면 선택과 집중을 다르게 해야 합니다. 그래서, 일단 테스트를 실행하는 방법을 제안을 따라 그대로 하고 결과를 확인합니다.


다른 인공지능 도구에게 코드에 대해 묻다

여기서 어디까지 파악을 살펴볼까 결정을 했습니다. 자세히 파지 말고, 당장은 새로 만든 테스트 코드를 이해하는 것으로 목표를 잡았습니다. <언러닝> 영향으로 과거의 방식대로 하지 않고, 클로드와 퍼플렉시티에게 이렇게 요구했습니다.

첨부하는 코드를 테스트 코드와 JEST를 전혀 모르는 개발자를 대상으로 설명해 주세요.

클로드 결과가 마음에 들었습니다. 설명 중에 기억하고 싶은 내용을 추려 봅니다.

Jest는 JavaScript/TypeScript에서 가장 많이 쓰이는 테스트 도구입니다.

Jest의 홈페이지도 살펴보았지만, 자세한 내용을 파악하지는 않기로 합니다. 인공지능은 바이브 코딩 도구로만 쓸 일이 아니네요. 프로그래밍 지식을 알려 주신 선생님으로도 훌륭한 역할을 할 듯합니다.


놀라운 프로그래밍 과외 선생님의 첫인상을 만나다

구조화된 설명의 순서와 더불어 간결한 표로 설명하는 표현력도 훌륭했는데, 거기에 비유까지 해 줍니다.

목Mock[1]에 대해 클로드는 '가짜 부품 만들기'라고 설명합니다.

테스트 환경은 실제 휴대폰이 아니라 컴퓨터 안의 가상 환경입니다. 그래서 실제 기기에서만 동작하는 부품들을 가짜로 대체해야 합니다.

하지만, 순서대로 읽었더니 직관적이지 않아서 테스트 코드부터 보기로 합니다. 제가 만들지도 않은 코드이고, 역시나 다른 주체가 생성한 내용이니 파악이 쉬운 순서로 정보를 접하기로 합니다.


그래서 뒤부터 보니까 또 훌륭한 설명을 마주합니다. 더불어 개발 경험이 살아나 Jest의 작명 방식이 마음에 든다고 느낍니다. it 로 시작하는 코드는 자연어로 작성한 영어 문장처럼 느껴져서 그렇습니다. 그리고, 한글로 주석을 붙인 인공지능이 작성한 코드도 좋은 관례라고 느낍니다.


웹뷰는 앱 껍데기 안에 웹사이트를 넣어두는 기술

학생 입장이 되어서 그냥 따라가다가 질문을 하니 집중도가 높아집니다.

웹뷰Webview가 뭐냐고 물었더니 클로드가 이렇게 답합니다.

앱 안에 웹 브라우저를 내장시켜 주는 컴포넌트입니다. 쉽게 말해, 앱을 나가지 않고도 앱 화면 안에서 웹사이트를 보여주는 창입니다.

클로드도 퍼플렉시티처럼 인터넷 검색 결과도 보여줍니다.

그것도 모자라다고 생각했는지 거의 비슷한 내용이지만 언제 쓰고, 왜 쓰는지를 열거합니다.

그렇게 하고 나서도 결론을 덧붙입니다.

한마디로, "앱 껍데기 안에 웹사이트를 넣어두는 기술" 이라고 보면 됩니다.


이 정도 경험이면 가벼운 한 세션으로 만족합니다. 코드 설명도 나머지는 비슷하거나 당장 몰라도 된다고 판단하여 생략합니다.


주석

[1] <낱말의 뜻을 깊고 넓게 묻고 따지는 일의 소중함> 실천으로 위키피디아 페이지를 찾아봅니다.


작가의 이전글인공지능과 함께 처음 만들고 배포한 우리 가족용 앱