inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

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

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

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

56

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번째 오류해결해달라고햇는데... 전혀 해결을 하지못하는상황입니다.. 클로드코드가..

outputStyle 설정하는데 어디서 문제일까요?

0

10

2

test.txt파일 삭제시 rm명령어이니 클로드의 질문이 있어야 한다고 하셨는데

0

7

1

검은화면

0

13

2

강의교환링크안열려요.....

0

14

1

영상재생에러 [확인부탁드려요!!!]

0

13

1

클로드 채팅에서 코드로 넘어가기

0

16

1

110강부터 따라가기가 힘듭니다...

0

39

1

커서에서 붙여넣기

0

22

1

깃허브 사용시 폴더경로 관련질문

0

18

1

/output-style 명령어는 폐기 되었다고 나오네요.

0

37

1

프롬프트 작성시 html, css, javascript

0

31

1

Cursor 창이 수업 내용과 달라요.

0

35

2

Supabase MCP 관련 질문입니다

0

36

1

클로드 로그인 후 승인창이 안떠요

0

34

1

61강 claude.local.md 변경사항 관련 질문

0

40

3

github

0

44

2

Claude에서 Bash, PowerShell 커맨드 묻기

0

55

2

mission 4 실행중 같은 질분 반복

0

38

2

sequential thinking mcp 사용 유용성에 대하여 질문있습니다.

0

57

2

VS Code? Cursor?

0

66

1

터미널과 클로드코드의 차이

0

63

2

서브 에이전트 불러오질 못함

0

61

2

미션2 노드js, npm 설치 안되어있음

0

38

1

/permission > workspace 등록 내용 settings.local.json에 누락

0

46

2