- 전체보기 (251)
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 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 |
Tags
- AWS
- kubernetes
- 이더리움
- 가상화
- TypeScript
- 이슈
- CSS
- 컴퓨터공학
- k8s
- docker
- 쿠버네티스
- 알고리즘
- 자바스크립트
- 솔리디티
- BFS
- HTML
- 웹
- 블록체인
- JavaScript
- 프론트엔드
- es6
- next.js
- 백준
- 파이썬
- react
- 클라우드
- 타입스크립트
- 백엔드
- VUE
- 리액트
Archives
- Today
- Total
목록📖 jsx (1)
즐겁게, 코드
넥스트를 꾸며줘 : styled-jsx 활용하기
기존 리액트 어플리케이션은 크게 두 가지 방법으로 스타일을 꾸밀 수 있었습니다. 하나는 CSS나 SASS 등 별도의 스타일 파일을 생성해 관리하는 방식이고, 다른 하나는 컴포넌트 안에서 스타일을 작성하는 CSS-in-Js 라는 방식입니다. 이중 넥스트(Next.js)에서는 CSS-in-js 방식을 권장하며, styled-component와 유사한 styled-jsx 라는 도구를 활용합니다. styled-jsx styled-jsx는 넥스트 프로젝트에 기본적으로 포함되어 있습니다. 이를 활용하기 위해서는 jsx 라는 값을 속성으로 갖는 style 태그를 컴포넌트 본문에 위치시킨 후, 적용할 CSS 스타일을 *문자열로 작성하면 됩니다. (* 상태에 따른 조건부 스타일을 활용할 수 있다는 장점을 살리기 위해 주..
🎨 프론트엔드/Next.js
2021. 2. 23. 23:02
소소한 팁 : 광고를 눌러주시면, 제가 뮤지컬을 마음껏 보러다닐 수 있어요!
와!! 바로 눌러야겠네요! 😆