One Button 프로그램 개발기 - 19

계획대로라면, 오늘 OnB를 공개할 예정이였지만 
계획되지 않았던 기능오류를 발견하였다.

무엇이 문제일까?

 
처음에 창 크기 조절에 대해 의도한 바는 다음과 같다.
열의 버튼 개수 설정값(2)과 생성된 버튼 수(4)에 맞춰 창의 크기가 적절하게 공백 없이 조절되는 것.
(위의  값인 2와 4는 예시로 설정한 값이다.)
 
아래의 사진을 참조해 보면, 열과 버튼 수에 맞게 프로그램 창의 크기가 적절하게 조절되어있다.

버튼 크기에 맞게 창 크기가 조절되어있다

 
이렇게 된 원인은 주로 '버튼 크기 조절' 기능 추가 때문이였다. (다른 원인들도 있을 것이다.)
OnB의 기본 버튼 크기가 큰 관계로, 버튼 크기 조절 기능이 필요하여서 추가하였는데
버튼 크기 조절 시 버튼 사이의 간격이 서로 겹치는 현상이 발생하였었다.

이렇게 말이다.

솔직히, '버튼 간격 조절' 기능 또한 있어서 사용자가 적절히 조절하면 되지만
프로그램이 어느정도는 정렬해주는것이 맞다고 판단하여 수정을 진행하였었다.
 
개인적으로 Cursor사용 시 어려움을 겪는 구간은 
프론트엔드, 디자인 및 인터페이스 조정이다.
(물론 백엔드도 쉬운 편은 아니다)
 
이전에(Ai 프로그래밍에 대한 생각)언급한 것 처럼.
추상적인 것을 표현하기가 쉬운 것이 아니다.
 
물론 사람끼리는 어느정도 통하긴 하지만,
아직 Ai는 시각적인 표현에 대한 대응을 잘 못 하는것 같다.
(데이터가 많으면 가능하겠지만..)
 
마치 Cursor를 가지고 디자인을 하는것은,
클라이언트(나)가 되어 디자이너(Cursor)에게 요청을 하는 것 같은 느낌이다.
(클라이언트-디자이너 관계 참조  https://brunch.co.kr/@roysday/84)
 
그렇기에 프로그래밍 공부가 필요하다. 
아니면 Cursor에게 요청 할 프롬프트의 개선이 필요했다.
왜냐하면, 기존의 방법으로 한 시간동안 진행을 하여도 해결이 되지 않았기 때문이다.
 
이번에 사용 할 방법은 Reddit에서 제안한 방법이다.

영어 알러지가 있다면 미안하다. 나도 있다.

 
번역하자면 다음과 같다. 영어 알러지 보유자(나)를 위해

팁: Cursor의 코딩을 향상시키고 싶나요? 질문하도록 요청하세요.
Cursor는 코딩을 하지 않는 것보다 코딩을 선호하는 경향이 있으며, 
이는 불완전한 프롬프트에서도 마찬가지입니다.

예를 들어, "코드 작성해줘"와 같은 모호한 프롬프트를 입력하면, 
Cursor는 이해하지 못한다고 인정하는 대신 여러 파일에 걸쳐 
무작위이거나 비논리적인 코드를 생성하는 경향이 있습니다.

하지만 모든 프롬프트에 다음과 같은 요청을 추가하거나 cursorrules 
파일에 규칙으로 추가하면 좋습니다: "명령을 더 명확하게 하기 위해 필요한 질문이 있다면 물어봐줘." 
이렇게 하면 Cursor는 매우 관련성 있고 심도 있는 질문을 할 것이며, 
때로는 사용자가 처음에 놓쳤을지도 모르는 중요한 세부 사항을 지적하기도 합니다.

이러한 질문에 답변함으로써 코드 품질은 질문 없이 코드만 생성했을 때보다 크게 향상됩니다.

 
 
그래서 비슷하게 요청을 하여 진행을 해 보았다.

이 코드가 생성된 버튼 열과 수에 기반해서 창 크기를 결정하는 기능이 어디에 있는지 알려줘. 
만약 명확히 하는게 필요하다면 나에게 어떤 질문이라도 해줘.

 
 
그러자 상당히 논리를 요구하는 답변이 나왔다.

몇 가지 질문을 드리고 싶습니다:
1.현재 창 크기가 의도하신 대로 조절되고 있나요?
2.특정한 문제가 발생하고 있다면 어떤 상황에서 발생하나요?
3.버튼이 없을 때와 있을 때의 창 크기 동작이 어떻게 되기를 원하시나요?
이러한 정보를 알려주시면 더 구체적인 도움을 드릴 수 있습니다.

 
 
답변한 프롬프트는 다음과 같다.
약간 모호 할 수도 있지만, 나름대로 최선을 다했다.

1. 아니 내가 의도한 것은 버튼이 설정된 프로그램을 다시 시작 시, 
창 크기가 버튼의 가로/세로로 가장 먼 쪽의 기준으로 창 크기가 최소화 되어서 
공백 또한 최소화 해서 창 크기가 자동으로 조절되어야 하는데, 
불필요하게 가로/세로에 존재하는 버튼보다 공백이 더 크게 나와. 

2. 기존에 버튼이 생성된 상태에서 프로그램을 새로 시작할 때. 

3. 버튼이 없을때는 기본 창 크기 (300,200) 유지하다가, 
버튼을 생성하기 시작하면 열 버튼 수에 맞춰서 창 크기가 결정되어있고, 
설정된 만큼 열을 다 채우면 다음줄 버튼을 만들때, 버튼 세로 크기만큼 창이 커져야 해. 

만약 명확히 하는게 필요하다면 나에게 어떤 질문이라도 해줘.

 
그리고 Cursor(Claude-3-5-sonnet-20241022) 의 답변 내용대로
코드를 수정해 보니 이럴수가.
 
두 번의 프롬프트에 60% 이상의 이슈가 해결되었다.

두 번에 이정도면 제법 잘 한 것이다.

 
어제는 순수한 프롬프트로 약 1시간 걸리던 기능오류를
논리적으로 질답하게 하여, 약 15분 만에 효과적으로 해결하였다.
 
앞으로도 이렇게 해 봐야겠다.
 
 
 
계속...

One Button 프로그램 개발기 - 20

처음 이야기

One Button 프로그램 개발기 - 1