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
JavaScriptのセンターピン
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
yosi
August 08, 2022
Programming
0
150
JavaScriptのセンターピン
yosi
August 08, 2022
Tweet
Share
More Decks by yosi
See All by yosi
自社開発のエンジニアの私が 大事にしてること(n=1)
yoshisan
1
73
なるほどGit講座 (追跡ブランチが理解できます!)
yoshisan
0
190
「自分の時間を生きる」キャリア論
yoshisan
1
100
小学生でもわかる SlackAPI×GAS
yoshisan
0
110
達人プログラマーになろう!
yoshisan
0
120
認証認可
yoshisan
1
140
オブジェクト指向が"チョットワカル"スライド
yoshisan
0
120
Linuxについて"ほんのチョットワカル"スライド
yoshisan
1
120
Let's React!! "チョットワカル"の第一歩
yoshisan
1
210
Other Decks in Programming
See All in Programming
高速開発のためのコード整理術
sutetotanuki
1
390
AI巻き込み型コードレビューのススメ
nealle
1
150
余白を設計しフロントエンド開発を 加速させる
tsukuha
7
2.1k
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
540
フルサイクルエンジニアリングをAI Agentで全自動化したい 〜構想と現在地〜
kamina_zzz
0
400
Grafana:建立系統全知視角的捷徑
blueswen
0
330
AI時代の認知負荷との向き合い方
optfit
0
150
16年目のピクシブ百科事典を支える最新の技術基盤 / The Modern Tech Stack Powering Pixiv Encyclopedia in its 16th Year
ahuglajbclajep
5
1k
Fluid Templating in TYPO3 14
s2b
0
130
なるべく楽してバックエンドに型をつけたい!(楽とは言ってない)
hibiki_cube
0
140
登壇資料を作る時に意識していること #登壇資料_findy
konifar
4
1k
【卒業研究】会話ログ分析によるユーザーごとの関心に応じた話題提案手法
momok47
0
190
Featured
See All Featured
The Curse of the Amulet
leimatthew05
1
8.4k
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
110
Designing Experiences People Love
moore
144
24k
A better future with KSS
kneath
240
18k
How to Grow Your eCommerce with AI & Automation
katarinadahlin
PRO
0
110
Building a A Zero-Code AI SEO Workflow
portentint
PRO
0
300
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
konakalab
0
350
30 Presentation Tips
portentint
PRO
1
210
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
200
The SEO identity crisis: Don't let AI make you average
varn
0
67
Documentation Writing (for coders)
carmenintech
77
5.2k
Bioeconomy Workshop: Dr. Julius Ecuru, Opportunities for a Bioeconomy in West Africa
akademiya2063
PRO
1
54
Transcript
P r e s e n t e d b
y y o s h i チーム開発。 JavaScriptで いかがでしょう👀??
None
None
センターピンとは?? ところで,,,,
一番効果が望める力点
一番効果が望める力点
プログラミング言語にも センターピンはございます。
範囲を先取りする。
視点 1.HTMLの主要のタグ
JSはHTMLのtagu内のidを基点にしている! →パターンはある程度決まってる! どういう時に使われる? ・フォームの送信(生成・新規作成) ・link移動(非同期通信) ・テーブル(表示一覧) なぜHTML??
視点 2.イベントハンドラ
ある特定の操作をトリガー(基点)として動きます。 →この基点がイベントハンドラ! ・clickした時 ・ボタン状をホバーした時 ・LINKに飛んだ時 etc イベントハンドラ
ある特定の操作を基点として動きます。 →この基点がイベントハンドラ! JSの主要な要素は全てHTMLのタグが発火箇所にな ります! イベントハンドラ一覧(抜粋)
視点 3.関数表記
JSの記述は関数型言語に近い思想になります! 知っておきたいこと ・オブジェクト指向 ・関数指向 書き方 ・無名関数 ・コールバック関数 なぜ関数??
視点 4.DOM操作
ブラウザ側がブラウザAPIは使用する際に JavaScriptをデファクトスタンダードで扱えるように してるから。 JavaScriptでブラウザAPIを動かしています。 その際にブラウザAPI側で書くドキュメントの各要素をオ ブジェクト的に動かせるようになってる。 →これがDOM操作! なぜJSがフロントで必要??
ブラウザ側がブラウザAPIは使用する際に JavaScriptをデファクトスタンダードで扱えるように してるから。 JavaScriptでブラウザAPIを動かしています。 その際にブラウザAPI側で書くドキュメントの各要素をオ ブジェクト的に動かせるようになってる。 →これがDOM操作! なぜJSがフロントで必要??
範囲を先取りする。
御清聴ありがとうございました