Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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
- css
- next.js
- project
- 다음은 메인페이지
- wescanner
- toy project
- react-hook-form
- React-native
- React
- 구조분해할당
- javascript
- 다중map
- teamproject
- 처음부터 배포까지
- 문제
- html
- ToyProject
- 리액트네이티브
- TIL
- JS
- mini
- useEffect
- 이중map
- miniproject
- Threppa
- wecode
- 일본 우편번호 api
- Tanstack Query
- 팀프로젝트
- useForm
Archives
- Today
- Total
목록components (1)
블로그 이름을 입력해주세요

스타일드 컴포넌트를 사용하기 전 알고 있어야 하는 개념이 있다 CSS in JS 스타일을 정의 할 때 CSS파일이 아닌 Javascript로 작성된 컴포넌트에 삽입하는 스타일 기법이다 Sass와 같은 CSS 전처리기가 등장했음에도 자바스크립트의 상태 값을 공유할 수 없어서 동적으로 스타일링을 하기 위해서는 인라인 스타일을 이용하거나 css 클래스 명으로 조건부 스타일링을 이용하는 방식으로 사용하였다 이러한 문제를 해결 하기 위해 등장한 패러다임이 CSS in JS이다 설치 $ npm install styled-components 스타일드 컴포넌트는 스타일링을 할 때 ES6 템플릿 리터럴 문법을 이용하여 JS파일 안에 선언해서 사용한다 import React from 'react'; import style..
javaScript
2022. 7. 5. 01:10