反応基材1


ラベルにclassをあげたいなら?

<div className="클래스명">

反応を使う理由は?データバインドが簡単だからです。


*データ{変数名、関数など}を簡単にバインドする方法
import './App.css';

function App() {

  let posts = '강남 고기 맛집';
  function 함수(){
  	return 100
   }

  return (
    <div className="App">
      <div className="black-nav">
        <div>개발 Blog</div>
      </div>
      <h4> { posts }</h4>
      <h4> { 함수() }</h4>
    </div>
  );
}

export default App;

画像を読み込むとき


使用
import './App.css';
import logo from './logo.svg';

function App() {

  let posts = '강남 고기 맛집';

  return (
    <div className="App">
      <div className="black-nav">
        <div>개발 Blog</div>
      </div>
      <img src= {logo} />
      <h4> { posts }</h4>
    </div>
  );
}

export default App;

JSXにstyle属性を挿入する場合


style={objectデータ型}
<div style ={ { color : 'blue', fontSize : '30px'} }>개발 Blog</div>
{属性名:「属性値」}右側に文字と数値が含まれます.
font-sizeはjsから減算されるため使用できません.
属性名=>fontSizeはcamelCase命名規則に従って変更する必要があります
!cssが長くなる可能性があるので、できるだけclassNameを使うことをお勧めします!