| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 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 |
Tags
- usemutation custom hook
- app.listen
- css module classNames
- type reference cannot be named error
- components as formulas
- dynamic metadata
- 이미지 업로드 과정
- 리액트로 채팅 기능 구현하기
- trigger additional callbacks
- 특정 dom node만 노출시키고 싶을 때
- 티스토리챌린지
- 오블완
- next.js
- CSS module 장점
- 리액트 19 useref
- pure functions
- 코드잇 스프린트 FE 1기
- express react
- useimperativehandle 사용할때
- 프리렌더링
- 리스티웨이브
- useimperativehandle 사용법
- React
- 회고
- http.createserver
- node.js(express) + ws(websocket) + react
- 스프린트 여정 마침
- useref 타입
- express로 채팅 기능 구현하기
- inferred type error
Archives
- Today
- Total
목록css module classNames (1)
Life is connecting the dots .
Next.js에서 CSS module, Styled-components 사용하기
최근에 React와 Next.js 프로젝트에서 CSS module과 styled-components를 사용해 보았다. 어느 방법이던 스타일 코드를 작성할 때 비슷한 부분이 많았지만 설정이 필요한 부분이나, 조건에 따른 스타일링을 적용방법, 주의할 점 등에 대해 새롭게 알게 된 점이 있어서 나중에 필요할 때 꺼내보고자 정리해 두려고 한다. CSS module 기본 사용법 CSS module의 기본 사용법은 다음과 같다. module.css 확장자를 사용하여 CSS 스타일 파일을 만들어 주고, 사용처에서는 해당 파일을 import해와서 사용하면 된다. import로 불러온 styles 객체 안에 있는 값인 CSS 파일에서 선언한 클래스 이름을 참조해서 className을 지정해 준다. 클래스이름이 .card..
Programming/Next.js
2023. 12. 2. 19:18