[React 숙련] Css-in-JS (styled-components) 조건부 스타일링 가능

1.Css-in-JS ▶ 자바스크립트로 css코드를 작성하는 방식 2.Styled Components * 패키지 : 리액트는 없지만, 추가로 외부에서 가져와서 사용하는 외부 라이브러리 (3rd party => npm에 모여있음) (1) VS 코드에서 plug-in 설치필요 ( vscode-styled-components ) (2) 터미널에서 (yarn create react-app CRA 실행 후 (3) 터미널에서 yarn add styled-components 실행 (마켓에서 해당 패키지 가져옴)(4) 파일 package.json에서 확인 가능 import './App.css'; import styled from 'styled-components'; function App() { const StBox ..

• format_list_bulleted React
• · 2023. 11. 7.
• textsms

[React 입문] Props의 개요

1. props 개념 - 컴포넌트 간의 정보 교류 방법 - 부모 컴포넌트에서 자식에게 넘겨준 데이터들의 묶음 (객체) 2, props를 통해 부모->자식으로 값 전달 - ★부모에서 자식으로만 가능 ★ - ★읽기전용 + 변경 불가능 ★ 3 자식 컴포넌트에서 부모에게 받은 값 렌더링 가능 import React from 'react'; function App(){ function Child(props){ return {props.grandFatherName} //"엄마" } function Mother(props){ return ; // props로 name전달함 } function GrandFather(){ const papaName ="홍길동"; return ; // props로 name전달함 } ret..

• format_list_bulleted React
• · 2023. 11. 1.
• textsms