03. ChatGPT와 Codex는 다른 자아를 가졌다

플랜트샤워를 만들 때(2023년 봄, GPT-3.5) 웹을 열어서 ChatGPT에게 코드를 만들어달라고 하거나, 현재 있는 코드 단위별로 던진 다음에 수정해달라고 하는 식으로 약간 복사 -> 붙여넣기 -> 복사 -> 붙여넣기 무간지옥에 빠지곤 했었다. 그 과정에 대해서는 다음 시리즈에 서술되어 있다.

https://www.postype.com/@plantshower/series/1148372

하지만 이번에는 Codex라는 전용 에이전트를 이용했고, 후반에는 ChatGPT 앱(모델은 5.0~5.2로 석 달동안 참 열심히 업데이트하더라)도 이용해서 개발했는데, 얘네들에게는 코드를 직접 스캔하고 수정할 권한을 줄 수 있다. 물론 설정에 따라 내 코드 손대지 말라도 가능하다. 그런데 놀랍게도 얘네들은 다른 자아를 가지고 있으며, 성격도 좀 다르고, 남이 짠 코드에 대해 비난도 한다(.....) 이전 버전의 방법과 비교해 달라진 점과 약간의 사용 요령에 대해 쓰려고 한다.

VS code에서 코덱스 설치하기 / 기본 사용법

코덱스는 일단 자신이 사용하는 코드 에디터(IDE라고 하는데 모른다고 반려인에게 놀림받았음)에 설치할 수 있는 플러그인 형태로도 나온다. 웹에서도 직접 할 수 있는데 이상하게 좀 더 멍청해지는 느낌이 드는 건 기분탓인가... 나는 터미널과 친하지 않은 편이라서 실행해보지 않았지만 아마도 전문 개발자 여러분은 터미널 환경을 선호할 것이다. 발자님들은 다들 클로드 코딩이 최고라고 했었는데 나한테는 너무 터미널로 개발까지 해야 한다는 자체가 너무 장벽이었음을 고백하며...

ChatGPT에서 코덱스 메뉴로 들어가서 IDE에서 시도해 보기를 눌러보면 플러그인 형태로 설치된다는 것을 알 수 있다. 물론 플러그인 메뉴에서 Extentions 탭에서 Codex를 설치하고 로그인하는 형태로도 가능하다.

Visual Studio Code의 플러그인 탭에서도 Codex를 설치할 수 있다.

아무튼 얘의 장점은 전체 코드 프로젝트를 스캔해서 그 맥락에 맞게 개발한다는 거다. 스캔하고자 하면 비밀번호니 보안이니 뭐 이런건 골룸이지만 - 보통 코드가 아니라도 .env 이런데 모여있으니까 - ChatGPT에게 열심히 물어보다보면 조심해도 가끔 노출될 때가 있다. 자기는 그런 정보는 눈감고 이용하지 않겠지만 다른 애들한테는 보여주거나 특히 github에 노출하면 안된다고 신신당부를 하기도 한다. 정말일까? 아~ 결국 귀찮음이 승리한다.

그럼 맨 밑에 탭에 ChatGPT 로고 모양의 탭이 생기면 얘한테 이런 문제가 있다, 이렇게 해라 채팅창으로 지시하면 된다.

오늘도 자잘한 버그를 고쳤는데 보통은 이런 식이다.

아 이제 const만 봐도 머리아프다

어떤 코드가 바뀌었는지도 매번 화살표 버튼을 누르면 확인할 수 있다. 디버깅에 있어 가장 큰 장점은 역시 캡쳐한 이미지를 편하게 집어넣을 수 있다는 점이다. 채팅창의 +를 눌러도 이미지를 추가할 수 있고 shft를 누르고 캡쳐샷을 드래그앤드롭해도 넣어진다.

그 외에 쓸만한 옵션은 봇에게 얼만큼의 권한을 줄것이냐와 어느 정도 고도의 생각을 하게 할 것이냐도 있다. Chat을 선택하면 코드를 건드리지 않는다. Agent를 하면 코드를 스스로 수정할 수 있는 권한을 갖는다. 풀 억세스는 무서워서 못해봤다. 또 어느정도의 기능/지능으로 답변을 할거냐도 있는데 올라가면 올라갈수록 한번에 토큰은 더 많이 쓴다. 더 좋은 코드가 나오는지는.... 나는 잘 모르겠다. 내가 코드를 뭘 알겠슈....

그리고 하단 맨 오른쪽 원형 그래프는 토큰 사용량인데 실제 토큰 사용량과 동기화되진 않는 것 같다. 저 그래프와 상관없이 토큰이 다 소진되면 몇시간은 Codex를 사용할 수 없다는 에러메시지가 나오게 된다. 나는 두 번인가 세 번 봤다. Codex 토큰보다 모자른 내 허리 토큰 때문에... 그래서 풀타임 개발이 아닌 경우라면 토큰은 넉넉하다고 볼 수 있다.

장점

일단 하나하나 쪼개서 물어볼 때보다 더 고맥락으로 다른 코드를 훑어가면서 생각할 수 있다는 것이다. 그래서 중간중간 디버깅 작업을 거의 안해도 되어서 너무 신났다. A를 모듈화해서 공통으로 써달라는 요구사항도 잘 들어준다. 그리고 생각보다 한 번에 복잡한 요구사항도 잘 들어준다. 그런데 내가 개발에 대한 지식도 없는 데다 PRD라고 하는 소프트웨어 요구사항 문서를 안 써본 건 아니지만 이런 문서를 쓰는 데는 머리를 써야 된다. 나는 이게 한달짜리 소품이라고 생각했기 때문에 대략적인 개요만 생각하고 진짜 바이브대로 개발했다....

단점

성능이나 코딩 컨벤션 관련해서 제대로 된 요구사항이 없이 이거 만들어줘 저거 만들어줘 하고 코알못식으로 개발하면 로컬호스트(내 컴퓨터 서버)에 올리든 실서버에 올리든 한번 터지게 되어 있다. 이 친구는 성능이나 최적화에 대한 고려가 없는 과묵한 녀석이다. 여기에도 실서버에 올려서 터졌던 얘기는 구구절절 써놨다.

사실 서버에 올려서만 터진 게 아니고 로컬호스트에서도 성능 문제로 한번 터졌다. 새로 산 컴퓨터의 localhost 브라우저에서 한 500권쯤 등록하니 버벅거리기 시작한 것이다. 처음에는 무한 스크롤이니까 무한으로 한 페이지에서 1200권 볼 수 있다고 생각했는데, 각각 다른 사양의 기기에서 웹브라우저로 보여주는 페이지는 실제로 그렇지 못하다. 바카라장과 바카라의 효과적인 모든 것을 css로 그려서(피그마 devmode 꺼져.... 내가 수제로 만든다.) 내려받을 이미지와 표지이미지 뿐이지만 javascript가 통제해야 하는 요소(DOM이라고 하는 것 같다) 갯수가 장난아닌 것이다. 통상 타블렛이나 휴대폰은 새 컴퓨터보다 사양이 떨어지며, 심지어 요즘은 휴대폰 버전 자체에 혁신이 있어서 새 휴대폰을 사는 것은 아니라서 굉장히 오래된 휴대폰을 쓰는 사람도 있다.