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
Evaluation Methods - Lecture 6 - Human-Computer Interaction (1023841ANR)
signer
PRO
0
1.3k
Security, Privacy and Trust - Lecture 11 - Web Technologies (1019888BNR)
signer
PRO
0
3.2k
都市の形成要因と 「都市の余白」のあり方
sakamon
0
150
多様なメンター、多様な基準
yasulab
PRO
5
19k
The browser strikes back
jonoalderson
0
360
あなたの言葉に力を与える、演繹的なアプローチ
logica0419
1
270
The World That Saved Me: A Story of Community and Gratitude
_hashimo2
3
510
Web Search and SEO - Lecture 10 - Web Technologies (1019888BNR)
signer
PRO
2
3.1k
Human Perception and Cognition - Lecture 4 - Human-Computer Interaction (1023841ANR)
signer
PRO
0
1.3k
卒論の書き方 / Happy Writing
kaityo256
PRO
54
28k
自己紹介 / who-am-i
yasulab
PRO
5
6.3k
Linguaxes de programación
irocho
0
530
Featured
See All Featured
How to make the Groovebox
asonas
2
1.9k
Self-Hosted WebAssembly Runtime for Runtime-Neutral Checkpoint/Restore in Edge–Cloud Continuum
chikuwait
0
320
SEO Brein meetup: CTRL+C is not how to scale international SEO
lindahogenes
0
2.3k
So, you think you're a good person
axbom
PRO
2
1.9k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
128
55k
Kristin Tynski - Automating Marketing Tasks With AI
techseoconnect
PRO
0
130
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
100
How STYLIGHT went responsive
nonsquared
100
6k
Claude Code のすすめ
schroneko
67
210k
My Coaching Mixtape
mlcsv
0
46
Color Theory Basics | Prateek | Gurzu
gurzu
0
190
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
200
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とは、フロントエンド開発で大人気のツール」 結論
ご清聴ありがとうございました