inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

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

프로젝트 생성 1 - Next.js, ShadcnUI

shadcn 설치 관련

35

블랑

작성한 질문수 3

0

npx shadcn@latest init

 

명령어 실행시 선택 옵션들이 더 생긴것 같습니다.

해당 옵션 선택에 대해서도 강의 내용이 업데이트 되면 좋겠습니다.

 

옵션 선택이 잘못된건지,

설치한다고 했는데도 강의 내용처럼 소스 업데이트가 발생하지 않아서 정상적으로 설치가 된건지 알수가 없습니다.

 

감사합니다.

react 인공지능(ai) claude

답변 2

1

짐코딩

안녕하세요 🙂

우선 어떤 옵션이 나왔는지 자세히 알려주시면 알맞은 답변을 드릴 수 있어요.

우선 현재 기준으로 답변드릴게요


1) npx shadcn@latest init - 컴포넌트 라이브러리 선택

image.png

shadcn 초기화 시 어떤 헤드리스 라이브러리를 기반으로 쓸지 선택하는 단계입니다. 화살표 키로 이동, Enter로 선택합니다.

  • Radix: 안정성과 풍부한 자료가 필요할 때 추천. 기존 shadcn/ui의 기본 선택지로 예제와 커뮤니티 레퍼런스가 가장 많습니다.

  • Base: 새 프로젝트에서 최신 스택을 써보고 싶을 때 추천. Radix 팀의 후속작 Base UI 기반으로 API가 더 현대적입니다.

선택 후에는 베이스 컬러, CSS 변수 등 추가 질문이 이어지고 components.json이 생성됩니다.

2) npx shadcn@latest init - Preset 선택

image.png

Radix를 선택한 뒤 나타나는 화면으로, 프로젝트의 기본 디자인 스타일(컬러·폰트·아이콘 조합) 을 선택하는 단계입니다. 화살표 키로 이동, Enter로 선택합니다.

각 프리셋은 별 이름을 따서 만들어졌으며, 서로 다른 분위기의 디자인 토큰 세트를 제공합니다.

  • Nova (Lucide / Geist): 깔끔하고 모던한 기본 스타일. shadcn의 대표적인 룩으로 가장 무난합니다.

  • Vega: 또렷하고 대비가 강한 스타일.

  • Maia: 부드럽고 따뜻한 톤의 스타일.

  • Lyra: 우아하고 정제된 느낌의 스타일.

  • Mira: 차분하고 미니멀한 스타일.

  • Luma: 밝고 가벼운 분위기의 스타일.

  • Sera: 세련되고 차가운 톤의 스타일.

  • Custom: 직접 컬러·폰트·아이콘을 골라 커스터마이징할 때 선택.

처음이거나 일반적인 프로젝트라면 Nova를 추천합니다. shadcn 공식 문서의 기본 스타일과 가장 가까워서 예제 코드를 그대로 적용하기 쉽습니다. 특정 브랜드 컬러나 분위기가 정해져 있다면 미리보기를 참고해 선택하시거나 Custom으로 진행하세요.

3) 초기화 완료

image.png

그리고 더 중요한 사항을 추가로 답변드릴게요.

npx shadcn@latest init 실행 시 나오는 선택 옵션은 라이브러리 측에서 언제든 변경될 수 있는 마이너한 부분이에요. shadcn뿐 아니라 Next.js, Tailwind 등 거의 모든 도구들이 버전 업데이트 때마다 설치 옵션 문구나 순서가 자주 바뀝니다. 그래서 강의 영상의 옵션 구성과 현재 시점의 옵션이 다른 건 매우 자연스러운 일이에요. 강의를 매번 재촬영하는 방식으로는 따라잡을 수 없는 영역이고요.

이런 옵션이 생소하실 때 가장 빠른 해결책은 클로드 코드에게 직접 물어보시는 거예요. "shadcn init 실행했더니 이런 옵션들이 나왔는데 뭘 선택해야 해?"라고 화면 그대로 붙여서 질문하시면, 본인 프로젝트 상황에 맞게 안내받으실 수 있어요. 강의에서도 반복해서 말씀드린 부분이고, 이게 사실 본 강의의 핵심 메시지 중 하나이기도 해요. 그래도 해결이 안되시면 강의 Q&A로 남겨주시면돼요

그리고 한 가지 꼭 짚고 싶은 부분이 있어요. 강의 소스 코드와 동일한 결과물을 만들려고 하실 필요가 전혀 없어요. AI는 확률적 특성을 가지고 있어서 같은 프롬프트라도 결과가 다르게 나오고, 라이브러리 버전이 다르면 출력물도 달라져요. 강의 영상과 똑같이 나올 수도 없고, 똑같이 만드는 게 학습 목표도 아닙니다.

본 강의의 학습 목표는 클로드 코드의 스펙과 워크플로우(탐색 → 계획 → 구현)를 익히는 것이에요. 어떤 도구든, 어떤 버전이든, 어떤 옵션이 새로 생기든 대응할 수 있는 사고 방식을 익히시는 게 진짜 핵심이에요. 도구는 1년만 지나도 바뀌지만, 워크플로우는 바뀌지 않거든요.

지금 막히신 옵션 부분은 클로드 코드에게 한 번만 물어보시면 바로 풀리는 사항이니, 편하게 적용해보세요.

감사합니다 🙂

0

인프런 AI 인턴

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

ShadcnUI 설치 과정에서 변경된 명령어 옵션 때문에 혼란스러우셨을 것 같습니다. 현재 npx shadcn@latest init 명령어 실행 시 추가 옵션들이 보인다면, 이는 새로운 설치 방법이나 설정 변경을 의미할 수 있습니다.

추가 옵션 선택의 이해

  1. 옵션의 의미: 설치 도중 제공되는 옵션은 보통 프로젝트의 초기 설정을 위해 필요합니다. 이 옵션들이 프로젝트의 테마, 스타일, 혹은 기능을 미리 결정지어주는 역할을 합니다.

  2. 설치 후 변화 확인: 만약 설치 후 강의 내용과 다르게 파일이나 구조가 변경되지 않았다면, 몇 가지 확인할 부분이 있습니다:

    • CLI 로그 확인: 설치 시 터미널에 출력되는 로그를 확인하여 옵션들이 어떻게 반영되었는지 살펴보세요.

    • 파일 및 디렉토리 구조: 지정한 옵션에 따라 소스 파일이나 설정 파일들이 추가되었는지 확인해 보시기 바랍니다.

해결을 위한 팁

  • 오류 메시지 확인: 설치 과정에서 발생한 오류 메시지가 없는지 확인하세요. 옵션이 제대로 반영되지 않을 경우 알림이 표시될 수 있습니다.

  • 공식 문서 참조: ShadcnUI 공식 문서를 통해 변경 사항이나 새로운 옵션에 대한 구체적인 정보를 확인할 수 있습니다.

기존 커뮤니티에서 유사한 문제를 다룬 답변을 보시고 참고하시면 좋을 것 같습니다:

이러한 자료들이 문제 해결에 도움이 되길 바랍니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

기술스택 버전까지 입력할 경우 참고할 만한 사이트

0

4

1

안녕하세요 문의남깁니다

0

5

1

안녕하세요 문의드립니다

0

7

1

Shrimp Task Manager 설치 관련 문의

0

10

1

github에 저장한 브랜치 삭제하는법

0

18

1

클로드 verification code

0

10

1

리포지토리 초기화 실수

0

18

0

강의 동영상이 중간중간 버벅거리면서 멈추네요.

0

23

1

151강 클로드 스킬 관련 질문

0

21

2

.md 파일명 대소문자 구분 문의

0

28

1

/output-style 이 안뜹니다

0

39

3

프로젝트 초기화 문제

0

25

2

섹션8,9부터는 진짜 못따라가겠어요...ㅠㅠ

0

56

5

파워쉘에서 이미지 복붙이 안됩니다.

0

31

1

160 강의 ppt-maker에 대해

0

38

2

이벤트 관리 앱 프로젝트 개발 순서

0

29

1

supabase next.js와 mcp

0

25

1

스테이징 10000개

0

27

2

160. Claude Code로 PPT 만들기 관련 질문

0

30

2

task master 관련질문입니다.

0

32

2

터미널 시작폴더가 달라요

0

37

2

my-profile-site 404 error

0

34

2

노션 .env.local

0

40

1

shrimp_data - WebGUI.md

0

32

2