[노트장] 적으며 정리해 보는 이론/Style & StoryBook2 [Storybook] React(Vite) + tailwind + ui shadcn + storybook + typescript 연결하기 최근에 알게 된 ui shadcn을 사용해 보았는데, 너무 좋아서 계속해서 사용하고 있다.ui를 작은 모듈로 쪼개서 만들어놓은 ui라이브러리이다.components/ui에 자동으로 만들어져서 들어가진다.이미지를 보면 button, input처럼 작은 atomic 단위로 쪼개져있는 것을 볼 수가 있다. 이거 정말 편하다.페이지에 여러 디자인 컴포넌트를 만들어 놓고 협업하는 과정에서 다른 팀원에게 디자인 변경 방식을 계속해서 설명하는 것, 디자인을 확인하기 위해 매번 찾아것 등 비효율적이기에 누구나 보고싶을때 편하게 볼수 있는 ui컴포넌트 개발을 위한 도구인 storybook 라이브러리 를 사용해보려고 한다 설치 방법은 여기 사이트를 참고하였다! [참고자료]Part 4. Turborepo + Shadcn-.. 2024. 7. 10. [Style] Style 유형과 종류 Style 유형 다양한 CSS 스타일링 방법론들을 크게 두 가지 유형으로 나뉩니다. CSS-in-JS: 이 방법론은 JavaScript 안에서 CSS를 작성하는 것입니다. 이러한 방식은 컴포넌트 기반의 웹 개발에 매우 적합하며, 주로 리액트(React)와 같은 라이브러리와 프레임워크에서 사용됩니다. CSS-in-JS의 대표적인 예로는 Styled-components, Emotion 등이 있습니다. 이 방법론은 스타일을 컴포넌트에 지역적으로 적용하여 스타일 충돌을 방지하고, 동적 스타일링을 쉽게 처리할 수 있도록 도와줍니다. CSS-in-CSS: 이 방법론은 기존의 CSS 파일을 사용하여 스타일을 관리하는 것입니다. 이 방법론은 CSS 전처리기를 포함하여 일반적인 CSS 스타일 시트 작성에 대한 방법론을 .. 2024. 4. 2. 이전 1 다음
