React 태그 안에 style 속성 넣기

리액트 테스트 중에 div height 를 늘리고 싶어서 태그에 바로 style 속성 넣었는데 렌더링이 안되었다.ㅠㅠ
내가 한 코드

<div style="height:150px;">"내가 추가한 컴포넌트~"</div>

 
근데 React 는 style 속성을 넣는 방법이 따로 있었다. (2가지 방법)
 
첫번째는 아래와 같이 return 전에 템플릿으로 넣는 방법이 있다.

class Sumni extends Component {
    constructor(props) {
        super(props);
    }

    render() {
        const templateStyle = {
            height: "150px"
        }
        return (
            <Fragment>
                <div style={templateStyle}>
                    <h3>"내가 추가한 컴포넌트!!!"</h3>
                </div>
            </Fragment>
        )
    }
}

하지만 이렇게 템플릿으로 하기 귀찮다면 {} 안에 css 적어주면 된다.
아래와 같이!

class Sumni extends Component {
    constructor(props) {
        super(props);
    }

    render() {
        const templateStyle = {
            height: "150px"
        }
        return (
            <Fragment>
                <div style={{height:'100px'}}>
                    <h3>"내가 추가한 컴포넌트!!!"</h3>
                </div>
            </Fragment>
        )
    }
}

 
주의! style={{height:'100px;'}} -> 세미콜론 넣으면 안먹힘.