바이브 코딩/Cursor AI

나만의 QR 코드 생성기 쉽게 만들기

· 코딩마이데이

01 먼저 빈 폴더를 자유롭게 커서로 엽니다. 그리고 QR 코드에 삽입할 로고 이미지도 준비합니다. 이 이미지는 커서가 인식할 수 있도록 커서로 열어둔 폴더 안에 함께 넣어두어야 합니다. 다음과 같은 상태면 준비 완료입니다.

 

02 이제 본격적으로 QR 코드 생성 프로그램을 만들어 봅시다.

UI가 친절한 QR 코드 제작 프로그램을 만들려고 할 때 가장 추천하는 방법은 뭐야?

 

03 커서는 여러 개발  방식과 함께 최적의 방법을 추천해줍니다. 커서가 최종적으로 추천한 기술을 이용해서 개발해보라고 하하겠습니다.

최종으로 추천해준 기술로 사용자가 넣은 이미지를 중앙에 배치해서 QR 코드를 생성하는 프로그램을 만들어줘. 이미지는 QR 코드 중앙에 넣고, 뒷 배경에 QR 코드가 보이지 않도록 하얗게 배경 처리를 해줘, 링크는 복붙이 가능해야 하고, 처음에 1개만 입력하는 상태여야 해. [+추가] 버튼을 누르면 최대 10개까지 추가할 수 있고 [생성]을 누르면 한꺼번에 QR 코드를 만들어서 사용자가 지정한 폴더에 저장할 수 있어야 해.

 

그러면 커서는 기본적으로 코드를 작성하면서 불필요한 파일은 삭재하고, 필요한 패키지는 설치해주며 작업에 필요한 설명까지 함께 제공하며 진행합니다.

 

04 프로그램 작성을 마치면, 서버를 구동하고 웹 브라우저를 통해 접속합니다.

 

05 각 기능을 사용해보면 문재없이 잘 동작하는 것을 확인할 수 있습니다. 로고도 잘 삽입되었고, 생성된 QR 코드를 카매라로 스캔하면 정상적으로 잘 연결됩니다.