강의

멘토링

커뮤니티

인프런 커뮤니티 질문&답변

작성자 없음

작성자 정보가 삭제된 글입니다.

[VOD] 6주 완성! 개발 실무를 위한 고농축 바이브코딩 (Cursor AI, Figma)

[2-5] 공통 UI 컴포넌트 생성

컴포넌트 생성 or 스토리북 생성 후 잘 만들어졌는지 확인하는 중간과정이 필요해요.

작성

·

2

·

수정됨

0

좋은 강의 해주셔서 너무 감사드립니다.

 

바이브 코딩 과정 너무 신기하고 재밌는데, 다만 컴포넌트 생성, provider, 스토리북 등 잘 만들어지긴 하던데 중간에 잘 만들어진건지 확인하는 과정이 없다보니 문제 생겼을때 어디서부터 어디까지 잘못 되었는지 잘 모르겠더라구요. 중간과정 확인 방법이 궁금합니다.

 

현재는 스토리북에서 버튼 스토리 생성했는데, 완성은 했는데 컴포넌트가 안보이고 빈 페이지로만 나옵니다.

기능은 스토리에 보입니다. page.tsx에서 컴포넌트 불러서 보면 잘 보이구요.

답변 1

0

안녕하세요, 인프런 AI 인턴입니다. Graham 님.

바이브 코딩 과정에서 컴포넌트 생성이나 프로바이더 관련 이슈를 이해하시고자 하시는군요. 프로젝트 진행 중에 각 단계에서 결과를 검증하는 것은 매우 중요합니다. 이를 통해 정확하게 코드가 구현되었는지 확인하고, 나중에 발생할 수 있는 문제를 사전에 예방할 수 있습니다. 중간 검증 과정이 필요하다는 의견은 매우 유용한 피드백입니다.

이와 관련된 방법으로는 다음을 고려해볼 수 있습니다:

  1. 단위 테스트 작성: 각 컴포넌트나 프로바이더가 예상대로 동작하는지 확인하는 테스트 케이스를 작성해보세요. 이를 통해 변화가 발생할 때 코드의 신뢰성을 유지할 수 있습니다.

  2. 로그와 콘솔 활용: 개발 환경에서 콘솔을 통해 중간 결과를 확인해보세요. 개발 중 문제의 원인을 추적하는 데 유용할 수 있습니다.

  3. Storybook 사용: 프론트엔드 컴포넌트의 경우 Storybook 같은 도구를 활용하면, 각 컴포넌트를 독립적으로 테스트하고 확인할 수 있습니다.

참고할 수 있는 유사한 질문이 있습니다:

각 단계를 수시로 검증하는 과정을 통해 프로젝트의 진행 상황을 명확히 이해할 수 있으며, 발생할 수 있는 문제를 빠르게 진단할 수 있습니다. 강의 진행 중 궁금한 점이 생기신다면 지식공유자님과의 소통을 통해 더 많은 도움을 받을 수 있습니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.

현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

작성자 없음

작성자 정보가 삭제된 글입니다.

질문하기