[챌린지] 인프런 혼자 공부하는 바이브 코딩(5주차)
·
강의&프로젝트
🚶기본 미션(필수)PROJECT 9. 냉장고를 부탁해 앱 만들고 캡처하기Chapter6 # 프롬프트1OpenRouter에서 받은 API 키를 .env 파일로 저장했어. 이 키를 안전하게 사용할 수 있도록 준비해 줘.#프롬프트2이제 준비된 API가 실제로 작동하는지 테스트해 줘.이미지 인식은 google/gemma-3-27b-it:free 모델을 이용하고,텍스트 인식은 deepseek/deepseek-chat -v3.1:free 모델을 이용할 거야.API를 통한 텍스트와 이미지 인식을 각각 테스트해서 실행 결과를 알려줘.# 프롬프트3앞서 만든 OpenRouter API를 이용해서, 냉장고 사진에서 재료를 인식하고 레시피를 추천하는 웹 애플리케이션을 만들고 싶어. 다음과 같이 3단계로 나누어서 PRD를 만..
[챌린지] 인프런 혼자 공부하는 바이브 코딩(4주차)
·
강의&프로젝트
기본 미션(필수)PROJECT 5. 할 일 관리 앱 만들고 캡처하기 데스크톱 버전🏃추가 미션(선택)PROJECT 7. 상식 퀴즈 게임 앱 만들고 캡처하기 # PRD 작성 요청할 일 관리 앱을 만들고 싶어. PRD를 작성해줘.매일 10-20개 정도의 할 일을 관리하는 개인용 앱이야.주요 기능은:- 할 일 추가, 수정, 삭제- 완료 체크 기능- 카테고리 분류 (업무/개인/공부)- 진행률 보기브라우저에서 바로 실행되고, 새로고침해도 데이터가 사라지지 않았으면 좋겠어.기술적으로 복잡하지 않게 순수 자바스크립트로 만들고 싶어.# 단계별 프롬프트 생성이 PRD를 클로드 코드에서 사용할 단계별 프롬프트로 변환해 줘.5개의 핵심 단계로 정리해서 각 단계마다 명확한 지시 사항을 만들어 줘. Chapter5/memory..
[챌린지] 인프런 혼자 공부하는 바이브 코딩(3주차)
·
강의&프로젝트
기본 미션(필수)PROJECT 3. 손글씨 인식 프로그램 만들고 캡처하기손글씨로 숫자를 입력하면 이것을 인식하는 코드를 만들어서 실행해 줘. 모든 코드와 주석을 영어로 작성해 줘.숫자 인식 프로그램을 윈도우 탐색기에서 클릭해서 실행할 수 있게 해 줘. 책에서는 .bat로 만들었는데, 제가 클로드코드에게 요청했을 때는 .exe를 추천해줘서 그렇게 진행했습니다. 추가 미션(선택)PROJECT 4. 손글씨 인식 프로그램 웹 버전으로 확장하고 캡처하기 내용 정리p113CLAUDE.md에는 프로젝트 구조, 목표, 개발 규칙 등을 저장해 두면 클로드 코드가 언제든지 프로젝트 맥락을 이해하고 이어서 작업할 수 있습니다. 또한 여러 하위 프로젝트가 있을 경우, 각각에 맞는 설정 파일을 만들어 특성에 맞게 관리할..
[챌린지] 인프런 혼자 공부하는 바이브 코딩(2주차)
·
강의&프로젝트
도서 내 중요부분 정리 P62개발자들은 코딩에 앞서 PRD라는 제품 기획서를 작성합니다.주목할 점은 바이브 코딩에 있어서 제품 기획서가 매우 효과적인 프롬프트로 기능한다는 것입니다. 좋은 프롬프트는 해야 할 일을 명확히 제시하고 맥락을 제공하며, 구체적인 요구사항을 담아야 합니다. 마찬가지로 기획서는 무엇을 만들지, 왜 필요한지, 어떻게 작동해야 하는지를 체계적으로 정리하는 문서이므로, 본질적인 목적이 같습니다.PRD : 1)무엇을 만들지 명확히 정의, 2)프로젝트 목적과 배경 제시, 3)요구사항, 구현방법 구체화좋은 프롬프트 : 해야 할 일을 구체적으로 지시, 왜 필요한지, 어떤 상황인지 설명, 필요한 기능과 조건 세부 명시 기획의 핵심요소5W1HWhy, Who, What, When, Where, Ho..
[챌린지] 인프런 혼자 공부하는 바이브 코딩(1주차)
·
강의&프로젝트
p.33문제1웹기반 챗봇 : 클로드, 챗GPT, 제미나이모델선택형: 커서, 리플릿, 윈드서프전용 모델형: 클로드코드, 제미나이 CLI 문제21) 바이브코딩, 2)AI어시스턴트, 3)모델 선택형 도구 4)전용 모델형 도구 p54,55문1. 답2문2. 답4문3. 아티팩트문4. 게시문5. Customize PROJECT 1. 나의 첫 웹페이지 만들고 캡처하기https://claude.ai/public/artifacts/a72c440b-b467-4838-b359-21a0e26c2ce7 커스터마이즈1. 현재 오늘의 날씨가 계속 로딩 중... 으로 표시됩니다. 제대로 현재 서울의 날씨가 제대로 표시될 수 있도록 코드를 수정해주세요. https://claude.ai/public/artifacts/352b71cc-..
[인프런 챌린지] Claude Code Context 관리 (5일차)
·
강의&프로젝트
context를 사용했들 때 의문점왜 새로운 프로젝트로 연다음 /context를 입력했을 때 아래와 같이 나타납니다. context 많이 차지해서 mcp도 다 비활성화하고, 아무 것도 안했는데 무려 40%의 컨텍스트가 채워져 있는데요... 아래 상세한 내용들이 많이 있는데요. 그래서 claude code에게 물어봤습니다. Memory files · /memory └ ~\.claude\CLAUDE.md: 124 tokens └ ~\.claude\BUSINESS_PANEL_EXAMPLES.md: 2.2k tokens └ ~\.claude\BUSINESS_SYMBOLS.md: 2.1k tokens └ ~\.claude\FLAGS.md: 1.3k tokens └ ..
[인프런 챌린지] 클로드 코드 수업 복습 및 Skill 만들기 (3일차)
·
강의&프로젝트
오늘은 간단히 지난 주 온라인 강의 복습과 skill-creator 스킬을 사용해서 간단한 스킬을 만들어 보는 것을 연습했습니다. - 바이브코딩이 되면서 비개발자도 개발자만큼 개발 능력을 발휘할 수 있게 되었다. 보다 도메인 중심의 기획 능력 및 전체 아키텍처 중심으로 보는 능력이 중요하게 된 것 같습니다.- 다른 툴을 붙여서 클로드코드의 기능을 확장할 수 있음. 예를 들어서 코드보안을 검수하고 싶으면 Snyk CLI 이라는 것이 있음 2. 클로드의 내장 스킬인 skill-creator로 스킬 만들기어제는 너무 주먹구구로 만들어서 SKILL.md 조차 제대로 만들어주지 않았습니다. 오늘은 클로드코드에서 클로드 내장 스킬인 skill-creator 스킬을 사용해서 만들어보고자 합니다. skill-crea..
[인프런 챌린지] 클로드 Skills 사용하기(2일차)
·
강의&프로젝트
보호되어 있는 글입니다.
[인프런 챌린지] 클로드 Skills 사용하기(1일차)
·
강의&프로젝트
오늘 공부할 내용은 Claude코드 Agent Skills입니다. 1. Agent skills 뭐고, 왜, 언제 사용해야 하는가?2. 기존에 claude에 구축된 에이전트 스킬 사용해보기3. 타인이 만든 에인전트 스킬 가져와서 사용해보기(다음)4. 내가 직접 스킬을 만들어서 테스트하기(다음) 1. Agent skills 뭐고, 왜, 언제 사용해야 하는가? Skills의 강점으로 기존 MCP와 Subagent의 과도한 토큰 사용 문제를 해결기존 MCP에서 수행했던 대부분의 기능을 skills로 수행할 수 있으며 1) 필요한 부분만 참조하는 방식이라 토큰을 아낄 수 있고, 2) 필요시 프로그램을 수행해서 일관된 결과물을 도출할 수 있음 2. 기존에 수축된 에이전트 스킬 사용해보기클로드 코드에서 설치..
[인프런] 이지스퍼블리싱 Do it! LLM을 활용한 AI 에이전트 개발 입문 챌린지(4주차)
·
강의&프로젝트
마지막주 랭그래프 관련 내용을 학습했다. 랭그래프는 처음 노드가 몇개 안 될 때는 그다지 어렵지 않는데, 노드가 늘어나고, 라우터를 달고 멀티 에이전트 구조가 복잡해지면 난이도가 높아지는 것 같다. 아무래도 랭체인에 비해 랭그래프로 제대로 프로젝트를 해본 경험히 없기 때문인거 같기도 하다. 어려워 지는 곳은 14-2 슈퍼바이저 에이전트 부분과 15-1 목표를 점검하는 비즈니스 분석가 에이전트 부분이 추가되면서 복잡해지는 느낌을 받았다. 랭체인에서 자주 사용하는 단순히 워크플로우 형태로 코드를 작성하면 디버깅도 편하고 직관적으로 흐름을 하나씩 따라가기 쉬운데, 에이전트가 분석하고 판단하고 과정이 들어가면 워크플로우가 고정되지 않고 결과가 어떻게 변하는지 예측하기 어렵다. 그렇다고 에이전트가 분석하고 판단..