jsx { } 안에는 숫자 or 문자만 올 수 있다!

return (
    <div style={style.App}>
      <MyHeader />
        <h2 style={style.h2}>안녕 리액트 {name}</h2>
        <b style={style.bold_text} id="bold_text">
          {number}는 : {number % 2 === 0 ? "짝수": "홀수"}
        </b>
          
    </div>
  );

App.js

import React from 'react';
// import './App.css'; 외부스타일 주

import MyHeader from './MyHeader';

// 이러식으로 CSS 객체 만들고
function App() {
  let name = "박정수";

  const style = {
    App : {
      backgroundColor : "black",
    },
    h2 : {
      color: "red",
    },
    bold_text : {
      color : "green",
    }
  }

const number = 5;

  return (
    <div style={style.App}>
      <MyHeader />
        <h2 style={style.h2}>안녕 리액트 {name}</h2>
        <b style={style.bold_text} id="bold_text">
          {number}는 : {number % 2 === 0 ? "짝수": "홀수"}  // 조건부 랜더
        </b>
          
    </div>
  );
}

export default App;

Untitled