shadcn/ui의 해부

오늘 소개해드릴 글은 두나무의 조영제님이 번역해주신 글입니다.


shadcn/ui는 출시된 이후부터 최근까지도 가장 주목받는 프로젝트 중 하나입니다. GitHub 스타 수의 증가세나 Vercel의 채팅 인터페이스 v0에서 이 프로젝트를 화면 구성의 기반으로 채택한 점만 봐도 알 수 있습니다. 또한, 최근 발표된 Chakra UI 3버전에서도 shadcn/ui와 비슷한 구조로 컴포넌트를 생성하고 관리하는 것을 보면, 여러 프로젝트에 영향을 준 것이 분명해 보입니다.

저는 처음 shadcn/ui를 접했을 때 기존에 쓰던 디자인 라이브러리와 다른 점이 흥미로웠습니다. 패키지를 단순히 import해서 사용하는 대신, 프로젝트내에 코드를 복사해 붙여넣는 방식이라 신선하게 느껴졌습니다. 왜 이런 방식을 택했는지, 또 shadcn/ui가 어떻게 구성되어 있는지 궁금해졌고, 그러다 이 글을 발견하게 되었습니다.

개인적으로, shadcn/ui의 아키텍처를 가장 잘 설명한 글이라고 생각합니다. 이 프로젝트를 기반으로 자신만의 디자인 시스템을 구축하고자 하는 프론트엔드 개발자들에게 큰 도움이 될 것 같습니다.


> https://bit.ly/4edDLQb

[번역] shadcn/ui 의 해부

Medium

[번역] shadcn/ui 의 해부

다음 내용이 궁금하다면?

또는

이미 회원이신가요?

2024년 11월 4일 오후 11:33

 • 

저장 42조회 4,064

댓글 1

  • Bong99 là nhà cái cá cược thể thoa và casino hàng đầu châu Á. Bong99 có các trò chơi trứ danh như: cá cược thể thao CMD, BTi, esport, live casino trực tiếp mỗi ngày với dealer xinh đẹp. Bong99 luôn có dịch vụ hỗ trợ khách hàng 24/7, nạp rút an toàn, nhanh chóng chỉ trong 5 phút. Công Ty: Địa Chỉ: 151 Phường 14, Quận 5, Hồ Chí Minh, Vietnam Phone : 0965432996 Tags: #bong99 #bong99k #casinobong99 #thethaobong99 Website: https://bong99k.com/

함께 읽은 게시물

[패스트캠퍼스] Kernel360 프론트 3기 취업 완성 세미나

... 더 보기

최근에 코딩 IDE와 AI 에이전트들이 우후죽순 출시되면서, AI에게 프로젝트에 대한 중요한 정보와 규칙들을 알려주기 위한 방식들도 난립하고 있었는데요. 이것들이 이제 AGENTS.md 로 통일될 것 같습니다.

... 더 보기

AGENTS.md

agents.md

AGENTS.md

요 며칠 GPT-5 Reasoning - High 를 사용해서 진지한 개발을 몇가지 해보고 있는데 진짜 레벨이 다르네요.

... 더 보기

 • 

저장 11 • 조회 1,841


프론트엔드 개발자 로드맵

✅ 프론트엔드 개발자라면 누구나 하는 커리어 고민: 1. 대부분의 스타트업에서 프론트엔드에 요구하는 기술 수준이 높지 않음 > 구현은 다 할 수 있는데, 무엇을 더 공부해야 하는가에 대한 막막함 2. 프론트엔드 엔지니어 출신의 좋은 롤모델이 주변에 많지 않음 3. 시니어 프론트엔드의 부재로 조직 내 미들급에게 요구되는 더 많은 리더십 ✅ 탁월한 시니어 프론트엔드 개발자가 되려면: ▪️ 탁월한 시니어 프론트엔드 '개발자' 되기: 기본기에 충실 (좋은 코드, 데이터 기반 의사결정, 꾸준한 학습 등) ▪️ 탁월한 '시니어' ... 더 보기

프론트엔드 엔지니어 커리어 로드맵: 주니어를 위한 3가지 전문성 트랙

프론트엔드 엔지니어 커리어 로드맵: 주니어를 위한 3가지 전문성 트랙

프론트엔드 엔지니어 커리어 로드맵: 주니어를 위한 3가지 전문성 트랙

“와 코딩 때려치우고 싶다”라는 생각 들 때

적성에 안 맞아서 때려치우고 싶다는 생각이 든다면 한 번 읽어보세요. 전공 공부 시절 아무도 알려 주지 않은 적성에 대해 한 번 생각해봐야 했던 때가 있었다. 중학생 시절 검색으로 html / JavaScript 코드 복붙하며 이게 코딩인지도 몰랐고 (무지하게도 그래픽 디자인인 줄…) 그래서 대학생이 되어서야 본격적으로 코딩 공부를 시작했다. 대학 시절 사이드 프로젝트와 인턴십을 통해 백엔드를 할지 프론트엔드를 할지 결정했다. 백엔드 인턴십 경험이 그다지 긍정적이지 않았고 사이드 프로젝트를 하며 프론트... 더 보기

"와 코딩 때려치우고 싶다"라는 생각 들 때

velog.io

"와 코딩 때려치우고 싶다"라는 생각 들 때

 • 

저장 32 • 조회 4,724


프론트엔드 엔지니어 커리어 로드맵: 주니어를 위한 3가지 전문성 트랙

앞으로의 커리어에 대해서 한번 생각해볼수 있는 좋은 글이 있어 공유 드립니다 😉

... 더 보기

프론트엔드 엔지니어 커리어 로드맵: 주니어를 위한 3가지 전문성 트랙

프론트엔드 엔지니어 커리어 로드맵: 주니어를 위한 3가지 전문성 트랙

프론트엔드 엔지니어 커리어 로드맵: 주니어를 위한 3가지 전문성 트랙

 • 

저장 261 • 조회 8,092