August 2021
Intermediate to advanced
368 pages
5h 16m
Japanese
Content preview from Reactハンズオンラーニング 第2版 ―Webアプリケーション開発のベストプラクティスBecome an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.
5章ReactとJSX
前章ではReactの最小単位であるコンポーネントについて学びました。Reactコンポーネントの実体は、React要素および他のコンポーネントから構成されたツリーを返す関数です。前章ではcreateElementを使って要素を作成していましたが、実際のReactの開発現場ではじつはcreateElementはほとんど使用されません。とくに複数のコンポーネントを合成して複雑なアプリケーションを構築する場合、関数呼び出しがネストするとコードが読めなくなってしまいます。その代わりに使用されるのがJSXです。
JSXの「JS」はもちろんJavaScriptですが「X」はXMLを表します。つまりJSXは、JavaScriptのコードの中に直接、XMLのようなタグベースの構文を記述するための言語拡張です。JSXを使えば、複数のネストしたcreateElementの呼び出しを記述する代わりに、最終的に描画したい要素を宣言的に記述できます。
この章では、JSXを使ってReactのアプリケーションを実装する方法を学びます。
5.1 JSXを使ってReact要素を記述する
FacebookのReact開発チームは、Reactのリリースと同時にJSXをリリースしました。複雑なDOMツリーと属性を簡潔に記述するという目的で導入されたJSXですが、実際にReactのコードはHTMLやXMLと同じぐらい読みやすいものになりました。JSXではタグ名としてReact要素名（type値）を記述します。そして、タグの属性としてプロパティ値を記述します。子要素childrenは、開始タグと終了タグの間に記述されます。
子要素はいくらでもネストして記述できます。以下は<ul>要素をJSXで記述したものです。一見HTMLのように見えますが、これはJSXです。 ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access
More than 5,000 organizations count on O’Reilly
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.Julian F.
I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.Addison B.
I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.Amir M.
I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.