shadcn/ui와 v0로 알아보는 역사와 흐름

shadcn이 vercel팀에 Design Engineer로 합류하며 근시일 내 놀라운 무언가를 출시하겠다 말한대로 얼마전 v0를 공개하며 많은 사람들을 놀라게 했습니다. 앞으로도 오픈 소스 커뮤니티를 위한 커스터마이징 가능한 UI 컴포넌트를 계속 만들어낼 것이라고 하니 많은 기대가 됩니다. - 역사와 함께 알아보는 흐름 shadcn/ui는 눈에 띄지 않는 이름에도 지난 몇 달 동안 인기를 끌었습니다. 모든 Component는 복사/붙여넣기 방식이며, npm 패키지로 게시되지 않습니다. 이 접근 방식이 “코드에 대한 소유권과 제어권을 제공하여 구성 요소의 빌드 및 스타일을 결정할 수 있게 해준다“고 설명합니다. 이러한 접근 방식은 2012년 전 세계를 강타한 또 다른 UI 컴포넌트 세트를 떠올리게 합니다. 바로 부트스트랩입니다. (필요한 컴포넌트의 코드를 간단히 복사/붙여넣기할 수 있다는 점이 가장 큰 장점 중 하나였습니다) 부트스트랩은 사용자 정의 오버라이드가 어렵다는 이유와 사이트가 모두 똑같아 보인다는 문제로, 동적 스타일링과 더 나은 스타일 범위 지정이 가능한 CSS-in-JS 방식(mui, chakra-ui 등)이 등장과 함께 인기를 끌었죠. 하지만 React가 SPA에서 SSR과 RSC로 전환하기 시작하며 CSS-in-JS는 선호도가 떨어지기 시작했습니다. 이 지점에서 shadcn/ui가 등장합니다. 부트스트랩의 복사/붙여넣기 기능과 CSS-in-JS의 쉬운 커스터마이징 기능을 동시에 제공합니다. shadcn/ui는 Tailwind CSS를 기반으로 구축되었기 때문에(Tailwind가 잠시 주춤했던것으로 기억하는데 RSC의 등장과 함께 다시 인기를 끌었나요.. ? ㅎㅎ) 합리적인 기본값을 제공하여 필요에 맞게 사용자 정의를 쉽게 할 수 있고, 최신의 React와 훨씬 더 잘 어울린다고 평가받고 있습니다. 현재는 수많은 개발자가 shadcn/ui를 사용해 자신만의 UI 또는 본격적으로 컴포넌트 라이브러리를 구축하고 있습니다. 이제 shadcn이 vercel에서 풀타임으로 작업할 수 있게 되었으니 이 컴포넌트 라이브러리 컬렉션이 앞으로 어떤 방향으로 나아갈지 지켜보는 것은 재미있는 일일 것입니다. - v0 https://v0.dev shadcn/ui https://ui.shadcn.com

v0.dev by Vercel

V0

v0.dev by Vercel

다음 내용이 궁금하다면?

또는

이미 회원이신가요?

2023년 9월 28일 오후 1:34

조회 603

댓글 0

    함께 읽은 게시물

    알뜰폰으로 변경하고 싶어도 통신사 서비스에 무언가 묶인게 있어서 바꾸지 못했는데,


    생각해보니 기존 통신사는 최저 요금제로 변경하고, 알뜰폰으로 신규 가입을 한 뒤 eSIM으로 추가 등록해서 사용하도록하는 방법이 떠올라 그렇게 함!


    ... 더 보기




    면접 질문: 같이 일해본 동료 중에 가장 힘들었던 사람은 누구였나요?

    면접관으로 들어가면 행동양식 질문으로 물어보는 두 가지 질문이 있다. 하나는 임팩트(Impact)에 관한 것이고 다른 하나는 협업(Collaboration)에 관한 것이다. 임팩트에는 관한 것으로 "커리어에서 가장 임팩트있는 프로젝트에 대해 이야기해달라"는 질

    ... 더 보기

     • 

    저장 65 • 조회 7,379


    고기 먹었는데 연탄만 찍었네. 퐈이어!! 🔥

    조회 1,793