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
JSことはじめ
Search
YO
November 30, 2018
Programming
0
34
JSことはじめ
YO
November 30, 2018
Tweet
Share
More Decks by YO
See All by YO
Gitおしえるやつ
uyo
0
45
How to become to friends with Vim
uyo
0
51
Other Decks in Programming
See All in Programming
CSC509 Lecture 08
javiergs
PRO
0
260
CSC305 Lecture 08
javiergs
PRO
0
280
3年ぶりにコードを書いた元CTOが Claude Codeと30分でMVPを作った話
maikokojima
0
650
PHPに関数型の魂を宿す〜PHP 8.5 で実現する堅牢なコードとは〜 #phpcon_hiroshima / phpcon-hiroshima-2025
shogogg
1
340
Devvox Belgium - Agentic AI Patterns
kdubois
1
150
はじめてのDSPy - 言語モデルを『プロンプト』ではなく『プログラミング』するための仕組み
masahiro_nishimi
4
16k
Cursorハンズオン実践!
eltociear
2
1.2k
技術的負債の正体を知って向き合う
irof
0
270
AkarengaLT vol.38
hashimoto_kei
1
130
Six and a half ridiculous things to do with Quarkus
hollycummins
0
220
CSC509 Lecture 07
javiergs
PRO
0
250
Things You Thought You Didn’t Need To Care About That Have a Big Impact On Your Job
hollycummins
0
260
Featured
See All Featured
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
How STYLIGHT went responsive
nonsquared
100
5.9k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Rails Girls Zürich Keynote
gr2m
95
14k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
37
2.6k
Art, The Web, and Tiny UX
lynnandtonic
303
21k
It's Worth the Effort
3n
187
28k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.1k
Optimising Largest Contentful Paint
csswizardry
37
3.5k
Rebuilding a faster, lazier Slack
samanthasiow
84
9.2k
Music & Morning Musume
bryan
46
6.9k
Transcript
JavaScript ざっくり 18/11/30
Contents 1. JSの歴史 2. Alt JS ~ JSの派生 ~ 3.
フレームワーク 4. その他
1.JSの歴史
ECMAScript ってなんなのよさ?
標準化されたJS = EcmaScript
EcmaScript • Mozillaが仕様を策定し実装しているスクリプト言語 • Ecma Internationalによって標準化されている • European Computer Manufactures
Association • 仕様書ここ • 毎年更新されている Mozillaの公式サイトにJSについてのってるから 詳しく知りたいときはそこで
ES6が主流っぽい
ES6について 教えてよ!!
ES6とは? • ECMASCriptの6th Editionのこと • ES2015ともいう • なぜES6で書くのか ◦ 便利な機能、構文が追加され、従来より
簡潔かつ明瞭な構文で記述できる ◦ 主要な機能、構文を覚える程度なら学習コストはそこまで高くないから。 • とりあえずES6はマストで抑えよう!?
2.AltJS ~ JSの派生 ~ ♻
Java Scriptの苦手って何? • 動的型付けがいやだ • 暗黙の型変換がいやだ • 人によって記述の幅が広すぎてよみづらい
Alt JS あるやん
Alt JS JavaScriptの代替言語 JSの痒い所に手が届く JSへとコンパイルされる言語
TypeScript • マイクロソフトによって開発されメンテナンスされているプログ ラミング言語 • JSに対して省略も可能な静的型付けとクラスベースオブジェ クト指向を加えた • 大規模なアプリケーション開発のために設計されている
TypeScriptのソースコードをコンパイルするとJSのコードになる
CoffeeScript • コードはJSのコードに変換される • JSに比べ簡潔さと可読性の向上 • Rubyコミュニティでよくつかわれる • Rubyライクに記述できる •
Railsで使われる
他のやつ • PureScript • Dart etc……...
3.フレームワーク
今ナウいフロントエンドフレームワーク • React • Vue.js 以下はスルー • Angular • Preact
• Ember • Polymer
None
React • JSで書かれたライブラリ • Viewを担当 • 今の段階だとVueかReactかどちらかという感じ • プロパティや状態に応じて画面を描画する •
この記事読めばいいんじゃない?
None
Vue.js • 中国でかなりさかん • 初心者でも楽しく使えるらしい • 日本語書籍もいっぱい • 図がいっぱいあってわかりやすい •
とりあえずはじめてみれば? • 公式
4.その他
Node.js • npm: Node.js製ツールのバージョン管理ソフト • スケーラブルなネットワークアプリケーションを構築するために設計された非同期型 のイベント駆動の JavaScript 環境 •
サーバサイドで動くJavaScript • PHPやJavaと同じような使い方ができるってこと • クライアントもサーバサイドも同じ言語で書けばええやんって作られたらしい • Expressってフレームワークがある あとは触ってみろ
トランスパイラ • Babelとかが有名 • ブラウザが対応していない記述もなんかいい感じにしてくれる • イケてる書き方してもどっかのブラウザでは使用できないってなったら困るからその ためのもの
テストツール • jestとかmochaとか • その名の通りテストツール
データレイヤー • ReduxとかGraphQlとか • 正直いまいちわからんからググったほうがいい
ビルドツール • webpackとかgulpとかgruntとか • 開発時のコードと実際に使用されるコードが異なるそれらを変換して効果的にデプ ロイしてブラウザが理解できる形にするのがビルドツール • 依存関係とかそういうのまとめる • ファイルの圧縮とか
• なんかいろいろできる • 色々しらべてみてね
これで君もスタート地点だね (⋈◍>◡<◍)。✧♡