JSXとは
JSX構文とは
Reactで使われる記法の一つ(Reactが発祥)。
JavaScript XMLの略
JSXを使った書き方
code: .js
// こんな感じで、HTMLのような構文を使ってUIを書く
function Greeting({ name }) {
return <h1>Hello, {name}!</h1>;
}
逆に使わないとこんな書き方になる
code: .js
function Greeting({ name }) {
return React.createElement(
'h1', // 作成する要素のタグ名
null, // props（ここでは特に必要ないのでnull）
Hello, ${name}! // 子要素としての内容
);
}
主な特徴
1. HTMLに似た見た目
2. JavaScriptと連携可能：JavaScriptの式を {} を使って埋め込める
3. React.createElementのシンプル化 ：JSXを使わない場合、↑みたいにReact.createElementを直接書かないといけない
4. コンパイルが必要：ブラウザでそのまま実行できないのでコンパイルが必要