scss 주요 문법-2
scss 주요 문법-2 scss의 주요 문법을 정리해봅니다. 이번 글에서는 scss에서 @를 붙여 사용하는 주요 문법들을 살펴볼 계획입니다. 1. @mixin, @include scss에서 가장 많이 쓰이고 가장 중요한 기능이라고 생각되는 mixin 입니다....
scss 주요 문법-1
scss 주요 문법-1 scss의 주요 문법을 정리해봅니다. 1. 변수 scss는 변수를 사용할 수 있습니다. 사실 사용해본적은 없지만 css에서도 변수 사용이 가능 합니다. 하지만 IE에서 지원을 하고 있지 않아서 크로스브라우징에 문제가...
css 방법론 - BEM 방법론
css 방법론의 필요성 프로젝트의 규모가 커지면서 다수의 작업자들이 많은 컴포넌트를 작업하는 일이 많아지면 css를 작성함에 있어서 혼란이 생기기 시작한다. 각자가 자신만의 설계 방법을 가지고 한 프로젝트를 개발해 가다보면 css명이 불규칙하게...
scss architecture - 7-1 패턴 폴더구조
scss Architecture 디자인 시스템을 제작하면서 scss를 다루게 되었다. styled-components만 다루다가 scss를 다루게 되면서 scss 폴더 구조를 어떻게 가져가야 할 지 고민을 했는 데 scss 아키텍쳐 방식 중 제일 많이 사용되고...
storybook에서 scss 사용하기
storybook에 scss 적용하는 방법 nextjs + storybook 환경에서 scss를 설정해서 사용하려면 4가지 패키지 설치가 필요하다. style-loader css-loader sass-loader @storybook/preset-scss 위 3가지는 webpack에서 필요한 loader, 아래 1가지는 storybook에서 필요한 addon 패키지다....