미션: 앱광고 미니게임 바이브코딩소요시간: ~3시간사용 AI: Google Flash Preview, Pro Preview, Build​Step 1 Gemini Flash Preview를 이용해 앱 PRD를 생성해 Build에 넣어보자! internal error"...????안돼????? -->새로운 대화 생성해도 똑같은 에러만 30분 소요이슈 (빡치는건 스샷 따려고 다시 해보니깐 PRD로 게임 생성해줌 나쁜ㅅㅋ) 선생님 소환 -->서버문제? 너무 길다? =결론 너무 길다. 미니게임 바이브코딩 첫 프롬프트는 1~3줄로 해야함 (simple 바이브게임'>바이브게임'>바이브게임'>바이브게임'>바이브게임 is better) Q) 전에 웹사이트 대시보드를 짤때는 PRD생성할때는 PRD가 됐는데 왜 지금은 안되냐? A) 사이트는 앱보다 훨씬 가벼움, 특히 모션이 들어가는건 무거움. 약간의 서버/인터넷 이슈도 있었던걸로 추정 ​Step 2생성된 앱에 기능을 추가하려고 프롬프팅을 했더니 갑자기 모든걸 다 지워버림 ???? Gemini / Claude Code 문제점: 맘에 안들면 코드를 막무가내로 지워버림 ​Troubleshooting 여기서 index, tsx 는 코드 확장 파일 gameboard/app 파일은 전체 코드라고 생각하면 됨 ​Backtrack. 지워지기 바이브게임'>바이브게임'>바이브게임'>바이브게임'>바이브게임 전 처음 생산된 앱 코드를 전체 긁어와서 Gemini Pro (고급추론할때이용)에다 복붙 코드를 내가 알아들을수 있는 언어로 번역하게 한다: 코드의 역할/로직이 뭐야? 설명해줘"2. 여기서 고치거나 추가하고 싶은 부분을 자연어로 프롬프팅해서 app.tsx를 새로 짜달라고함사진 바이브게임'>바이브게임'>바이브게임'>바이브게임 레퍼런스 효과가 딱히 좋지는 않음3. Build로 돌아가 (2)에서 생성된 코드 복붙 ​​Step 3Build 안에서 자연어로 계속 프롬프팅하다가 안돼면 Gemini Pro Mode 대화로 돌아가 코드 변경해 복붙 반복(다음에는 과정을 녹음하거나 여러 단계에서 스샷을 찍어서 과정을 바이브게임'>바이브게임'>바이브게임'>바이브게임'>바이브게임 시각적으로 보여주자!) 벤치마킹 할 게임 유튜브 영상을 넣어 분석해서 내 코드에 추가할 부분을 알려줘"라고 하니 고급 기능들 좀 추가해줌​​Learning하면된다쌩초보도 하면 당신도 가넝가너 잘 모르겠는거는 로직을 설명해줘"하면 working backwards 가능 생각보다 build/pro를 둘 다 사용하면서 에러 troubleshoot/prompt iteration을 해야한다 더 쪼갤수록 더 좋은 결과 나옴, 벤치마킹할 이미지/영상을 설명하라고 하고 그걸 복붙하는것도 방법!! you REALLY need to dumb things down a 바이브게임'>바이브게임'>바이브게임'>바이브게임'>바이브게임 lot more than you think =>treat it like a 5th grader who takes instructions very literally 에러가 나면 왜 에러가 났는지 보자..짜증난다고 그냥 똑같은짓하지말고 .. ㅜerror troubleshooting: ctrl+A로 다 긁어와서 playground에서 왜 에러난거야?"라고 물어보면 보통 답을 알 수 있음​Game QA Tip 최종 레벨까지 해보고 개선해야할 점 셀프 QA해보면 고쳐야할게 보인다 Gemini Pro로 만든 게임의 문제점들을 분석하게 한다?