일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- useState
- vanillaJS
- 리액트 훅
- 장고
- react firebase
- 프로그래머스 자바
- react hook
- 디자인 패턴
- React JS
- websocket
- 데이터모델링과마이닝
- 컴퓨터 네트워크
- 자바스크립트
- 프로그래머스
- 코딩테스트 고득점 Kit
- 백준
- design pattern
- 프로그래밍 언어론
- 리액트
- JavaScript
- 코틀린
- 자바 공부
- useEffect
- react
- 자바
- 프로그래머스 완전탐색
- codesandbox
- 코딩테스트 고득점 Kit 완전탐색
- NextJS
- Java
- Today
- Total
목록css 전처리기 (2)
기록하는 개발자
내가 지금까지 무심코 써왔던 CSS 스타일링 방법이 사실은 CSS 방법론이라는 이름하에 여러 개로 나눠지고 있었다. 가장 유명한 BEM, OOCSS, SCACSS 세 가지 중 무엇을 쓰는 것이 효율적인가에 대해 많은 이야기가 있는데 알고 보니 나는 이 3가지를 모두 섞어서 쓰고 있었다🫢 더 놀라운 점은 실제로 한 가지만 쓰는 것보다는 두 가지 이상을 섞어 쓰면서 개별적인 단점을 보완하는 것이 더 유리하다는 것이다🫢🫢🫢 그렇다면 세 가지 방법론에 대해 알아보자 1. BEM 블록(Block), 요소(Element), 상태(Modifier)로 구분하여 클래스 이름을 작성하는 방법론이다. 각 부분을 __와 --로 구분하여 클래스명을 짓게 된다. Ex) Block__Element—Modifier 1. Block ..
CSS(Cascading Style Sheets) css는 문서의 스타일을 구현하는 스타일 시트 언어이다. 프로그램의 크키가 커질수록 css 파일들이 지저분해지고, 유지보수가 힘들어지는 경험을 해본 적이 있다. 불필요한 선택자(Selector)의 과도한 사용과 연산 기능의 한계, 구문(Statement)의 부재 등이 그 이유이다. CSS 전처리기는 그러한 CSS 작업을 보다 쉽게 해주며 가독성과 재사용성을 높여 유지보수가 용이해지도록 도와준다. CSS 전처리기 위에서 설명한 CSS의 부족한 점들을 해결하기 위해 만들어졌다. 종류 : SASS(SCSS), Less, Stylus, PostCss 장점 - 재사용성 : 공통 요소 또는 반복적인 항목을 변수, 함수로 대체 가능하다. - 시간적 비용 감소 : 임의..