본문 바로가기

2024/10/222

[SCSS] mixin 사용법 서론mixin과 function은 SCSS를 모듈화 하기 위한 가장 큰 요소라고 생각된다. 잘못 사용하면 정말 가독성이 떨어지고 어려울 수 있지만, 잘만 사용한다면 코드를 훨씬 간결하게 유지할 수 있을 것 같다. 유지 보수 면에서도 훨씬 이점이 많을 거라 생각된다. mixin이란?: 함수와 유사한 개념 단, 함수와 동일하지 않음 (리턴값이 존재 X) 사용법mixin 을 선언할 때에는 @mixin 키워드를 사용한다.사용할 때에는 @include 키워드를 사용한다. 예제 (매개변수가 없는 믹스인)// 매개변수가 없는 믹스인// 선언부@mixin resetList() { margin: 0; padding: 0; list-style: none;}// 사용부ul { background-color: yell.. 2024. 10. 22.
[SCSS] 주석, 변수, 보간법 국비 교육을 들으며 Saas를 처음 배워보았다. 처음 SCSS를 사용해보고 나서 든 생각은 정말 프로그래밍 언어와 다를게 없다고 생각했다. 파일 관리를 모듈 단위로 한다는 점에서 리액트와 뷰랑 사용법이 유사하다고 생각이 드는데 이렇게 코드를 작성하면 바닐라 JS에서도 라이브러리를 쓰듯 코드를 작성하는게 가능할 것 같다는 생각이 들었다.  다음으로는 코드의 가독성이 너무 좋다. 또 if 의 사용으로 인해 정말 프로그래밍 언어처럼 코드를 작성할 수도 있다. CSS에서 해당 기능을 사용할 수 있다는게 신기했다.  그런데 해외 코드를 읽으며 SCSS는 정말 많이 봤지만 국내에서는 인지도가 조금 떨어지는 것 같기도 하다. 리액트나 뷰는 JS 를 쓰는 거의 모든 기업들이 사용을 하고 있지만, SCSS는 지원 자격에.. 2024. 10. 22.