Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Reactの紹介
Search
hiroto333
April 14, 2025
Education
0
43
Reactの紹介
Reactについて簡単に紹介するスライドを作成しました.
hiroto333
April 14, 2025
Tweet
Share
More Decks by hiroto333
See All by hiroto333
Rustの紹介
hiroto333
0
29
Goの紹介
hiroto333
0
51
Runwayの紹介
hiroto333
0
25
Other Decks in Education
See All in Education
渡辺研Slackの使い方 / Slack Local Rule
kaityo256
PRO
10
11k
卒論の書き方 / Happy Writing
kaityo256
PRO
54
28k
Introdución ás redes
irocho
0
530
2025-10-30 社会と情報2025 #05 CC+の代わり
mapconcierge4agu
0
110
都市の形成要因と 「都市の余白」のあり方
sakamon
0
150
あなたの言葉に力を与える、演繹的なアプローチ
logica0419
1
270
滑空スポーツ講習会2025(実技講習)EMFT学科講習資料/JSA EMFT 2025
jsaseminar
0
220
CSS3 and Responsive Web Design - Lecture 5 - Web Technologies (1019888BNR)
signer
PRO
1
3.1k
0121
cbtlibrary
0
120
令和エンジニアの学習法 〜 生成AIを使って挫折を回避する 〜
moriga_yuduru
0
230
IHLヘルスケアリーダーシップ研究会17期説明資料
ihlhealthcareleadership
0
830
悩める リーダー達に 届けたい書籍|レジリエントマネジメント 書籍イントロダクション-260126
mimoza60
0
160
Featured
See All Featured
Google's AI Overviews - The New Search
badams
0
900
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
2k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.3k
Building a A Zero-Code AI SEO Workflow
portentint
PRO
0
300
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.7k
Accessibility Awareness
sabderemane
0
49
Un-Boring Meetings
codingconduct
0
200
The Director’s Chair: Orchestrating AI for Truly Effective Learning
tmiket
1
96
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
133
19k
Designing for humans not robots
tammielis
254
26k
Groundhog Day: Seeking Process in Gaming for Health
codingconduct
0
90
Leading Effective Engineering Teams in the AI Era
addyosmani
9
1.6k
Transcript
Reactの紹介
目次 Reactって何? はじめに
「Reactとは、フロントエンド開発で大人気のツール」 結論
React 概要 WebサイトやWebアプリのUI部分を開発する際に活用する JavaScriptライブラリ React.jsとも呼ばれる Facebook社が開発し、2013年にオープンソース化
Declarative (宣言的である) Component-Based (コンポーネント指向) Learn Once, Write Anywhere (一度学習すれば、 どこでも使える)
特徴 出典:https://ja.react.dev/reference/rules
宣言的である 特徴 宣言的:条件と結果が明確にコードに示されている状態 誰がコードを見ても理解しやすい デバックやテストがしやすい
特徴 アプリケーションの構成要素をコンポーネント(小さい部 品)に分け、機能を分割する 一部分の変更が可能 改修や管理・再利用がしやすい コンポーネント指向
特徴 Webアプリケーションだけでなく様々な分野で応用可能 例)React Nativeでモバイルアプリ開発 React Native:iOSやAndroidのJavaScriptエンジンを活用 できるフレームワーク React360:VRコンテンツを開発できるフレームワーク
一度学習すれば、どこでも使える
メリット レンダリングが高速 コードを再利用しやすい(コンポーネント指向) JavaScriptベースで、比較的学びやすい レンダリング:プログラムやデータを人間が認識できる表示形式 (画像やWebページなど)に変換する処理 特徴
デメリット 不向きな場合がある 例)地図アプリ〇 ニュースアプリ× JSXの記述方式に慣れが必要 特徴 JSX(JavaScript XML): JavaScriptの拡張構文で、JavaScriptファイル内にHTMLの ようなコードを記述できるよ うにするもの
Slack Netflix 事例 Facebook Instagram
ランキング 出典: https://www.publickey1.jp/blog/23/state_of_javascrip t_20221reactnextjsjest4.html https://techmania.jp/blog/javascript0011/ 利用率 Google検索数
「Reactとは、フロントエンド開発で大人気のツール」 結論
ご清聴ありがとうございました