똑같이 따라쳤는데 라이브 서버에서 아무 것도 출력되지 않는데 제가 놓친 부분이 있을까요?

Question

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>구구단</title> <script crossorigin src="https://unpkg.com/react@16/umd/react.development.js" ></script> <script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" ></script> </head> <body> <div id="root"></div>  <script type="text/babel"> class GuGuDan extends React.Component { constructor(props) { super(props); this.state = { first: Math.ceil(Math.random() * 9), second: Math.ceil(Math.randon() * 9), value: "", result: "", }; } render() { return ( <div> <div> {this.state.first}곱하기{this.state.second}는? </div> <form> <input type="number" value={this.state.value} /> <button>입력!</button> </form> <div>{this.state.result}</div> </div> ); } } </script> <script type="text/babel"> ReactDOM.render(<GuGuDan />, document.querySelector("#root")); </script> </body> </html>

황선영 · Answer

콘솔에는 react.development.js:2337 [Deprecation] SharedArrayBuffer will require cross-origin isolation as of M92, around July 2021. See https://developer.chrome.com/blog/enabling-shared-array-buffer/ for more details. 와 같은 에러가 뜹니다.