inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

클로드 코드 완벽 마스터: AI 개발 워크플로우 기초부터 실전까지

개발 워크플로우: UI/UX 개선하기

선생님 강의토대로 개발중인데 질문이 하나있습니다 급함

80

info

작성한 질문수 15

0

현재 정산 에이전트웹을 개발중인데,

제가 원하는 방향의 html미리보기는 제대로 랜더링이 되는데

 

로컬호스트의 next.js 개발환경에서는 계속 원하는 값을 넣어주고해도
밑에 그림상처럼 이 같은 화면으로만 계속 나타나는 현상이 있습니다.

image.png

제가 원하는 화면은 이런화면인데말이죠

image.png


근데, 로컬호스트 개발환경으로 불러올때는 이런식으로 불러오지를 못해서 어떻게 해결해야하는지 고민입니다.. 방법이 있을까요

react 인공지능(ai) claude

답변 2

0

짐코딩

안녕하세요! 🙂

아래 세 군데를 봐주세요.

  • 서버 로그 — npm run dev 실행한 터미널에 빨간색 에러나 경고가 있는지

  • 개발자 도구 콘솔 로그 — F12 → Console 탭에 에러가 있는지

  • 개발자 도구 네트워크 탭 — 새로고침 후 못 가져온 리소스(빨간색, 404 등)가 있는지

여기서 나온 로그나 캡처를 컨텍스트로 제공하고 다시 프롬프팅해보세요~! 클로드 코드는 단서를 많이 줄수록 정확히 잡아줘요.

그리고 같은 로그로 2~3번 시도해도 안 되면, 같은 컨텍스트를 반복하기보다 다른 컨텍스트를 제공해주시는 게 돌파구가 돼요. 이 케이스라면 이런 것들이요.

  • 원하는 화면(다크 테마·사이드바)의 미리보기/목업 코드

  • 지금 이 화면을 그리는 컴포넌트 파일

  • 스타일을 넣은 방식(Tailwind인지 CSS 파일인지 등)

미리보기 디자인이 프로젝트 컴포넌트로 옮겨지지 않았거나, 다른 컴포넌트가 그 자리에 렌더링되고 있을 수 있어서, 위 컨텍스트를 함께 주시면 원인이 훨씬 빨리 좁혀집니다.

일단 개발자도구로 디버깅을 해봐야 정확히 알 수 있을 거 같아요~!


감사합니다 🙏

0

info

css파일이 누락된문제인가요? 한 10번째 오류해결해달라고햇는데... 전혀 해결을 하지못하는상황입니다.. 클로드코드가..

서브에이전트 생성시 레퍼런스 및 스킬 생성

0

19

2

Git, Github 기초부터 실전까지 중 질문드립니다.

0

19

3

재생이 안됩니다.

0

23

1

클로드 설치 및 강의 미션 관련

0

32

1

/config Thinking mode 설정

0

26

2

rules 폴더나 CLAUDE.md 파일 관리 관련 질문

0

30

2

cursor 안에서 다운로드 안되는 게 많은데 대체가 필요할까요

0

49

2

업데이트로 인한 에이전트 생성 변경

0

54

2

starter kit 프로젝트에 prd 문서 만들기

0

61

2

명령어 여러줄 입력방법?

0

60

2

ctrl + 't' 단축어가 안먹어요

0

44

1

클로드코드 계획 보고 방법 알고싶어요.

0

63

2

실무 버전 출시는 언제?

0

55

1

예시 1, 2, 3에서 질문있습니다.

0

52

2

Cursor 프로젝트 목록 및 작업 환경 동기화 문의

0

38

1

파워쉘, 터미널

0

56

2

스킬과 서브에이전트 병행 사용 질문

0

64

2

터미널에서 커서 AI 직접 실행

0

45

2

이런 경우는 어떤 조치를 취해야할까요?

0

52

2

outputStyles, rules

0

50

2

hooks 설정이 안되요

0

52

2

영상 최신으로 엡데이트 요청

0

73

2

소스 코드가 회사 보안 프로그램에 막혀서 안 보여요.

0

65

2

claude code 상태표시줄 궁금합니다!

0

56

2