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
52
0
Share
Reactの紹介
Reactについて簡単に紹介するスライドを作成しました.
hiroto333
April 14, 2025
More Decks by hiroto333
See All by hiroto333
Rustの紹介
hiroto333
0
42
Goの紹介
hiroto333
0
69
Runwayの紹介
hiroto333
0
41
Other Decks in Education
See All in Education
SL AMIGOS 教育格差と私たちの取り組み - スリランカの支援学校への支援プロジェクト:リシンドゥ リオ 氏 (別府溝部学園短期大学 ビジネス観光コース 留学生):2720 Japan O.K. ロータリーEクラブ2026年4月6日卓話
2720japanoke
0
530
Data Physicalisation - Lecture 9 - Next Generation User Interfaces (4018166FNR)
signer
PRO
1
870
Adobe Express
matleenalaakso
2
8.2k
GitHubによるWebアプリケーションのデプロイ / 07-github-deploy
kaityo256
PRO
1
240
Highest and Best Use: Development Considerations for Land Sites
rmccaic
0
220
OSINT入門-CTF for GIRLS_SECCON14電脳会議
nomizone
1
1.3k
Investigating Changes in Self-Assessed Spoken English Proficiency in a Three-Week Study-Abroad Program
uranoken
0
110
Data Presentation - Lecture 5 - Information Visualisation (4019538FNR)
signer
PRO
1
3.1k
P3NFEST 2026 Spring ハンズオン「ハッキング・ラブ!はじめてのハッキングをやってみよう」資料
nomizone
0
410
反応する前に「受容する」力を鍛える。 自分の安全地帯🌱 を育てよう / Cultivating and sharing ventral vagal safety.
spring_aki
0
130
コマンドラインの使い方 / 01-d-cli
kaityo256
PRO
0
140
Google AI Studio 開発者向け完全ガイド プロトタイピ まで ングからReactアプリ 構築・マルチモーダル活用
mickey_kubo
1
120
Featured
See All Featured
Building AI with AI
inesmontani
PRO
1
880
A Modern Web Designer's Workflow
chriscoyier
698
190k
More Than Pixels: Becoming A User Experience Designer
marktimemedia
3
380
The Cult of Friendly URLs
andyhume
79
6.8k
Automating Front-end Workflow
addyosmani
1370
200k
The agentic SEO stack - context over prompts
schlessera
0
740
Why You Should Never Use an ORM
jnunemaker
PRO
61
9.8k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.9k
Raft: Consensus for Rubyists
vanstee
141
7.4k
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
aleyda
1
2k
sira's awesome portfolio website redesign presentation
elsirapls
0
210
Designing Experiences People Love
moore
143
24k
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とは、フロントエンド開発で大人気のツール」 結論
ご清聴ありがとうございました