僕はどうしてAngular2をテーマに登壇することになってしまったのか

僕はどうして
Angular2をテーマに
登壇することに
なってしまったのか
2016/9/9
ng-mtg#8 Angular勉強会
at 日本マイクロソフト株式会社品川本社
by @ovrmrw
1

ちきさん
(Tomohiro Noguchi)
Twitter/GitHub/Qiita: @ovrmrw
ただのSIer
Macで開発したことない
※Web関係で仕事していません。
※Webアプリ開発したことありません。
自己紹介
2

では、
Angular2を始める前の
僕のスキルから見ていきましょう。
3

HTML
↓
点滅させたり
横にスクロールさせたりするやつ
Angular2(alpha)を始める前のスキル
4

Angular1, React
↓
知らない
5

Git, GitHub
↓
知らない
6

ソースコード
↓
読めない
7

SPA
↓
週刊誌
8

・HTML … 点滅させたり横にスクロールさせたりするやつ
・JavaScript … まあ少しくらいは
・CSS … 関わりたくない
・jQuery … $で始まるやつ
・Angular1 … 知らない
・React … 知らない
・SPA … 週刊誌
・Git, GitHub … 知らない
・ソースコード … 読めない
・英語の記事 … 読みたくない
9
とにかく何も
わからないし、
知らない。

10

ジオシティーズなら
知ってるよ
11

ここで一つ疑問が…
13

なんでAngular2を始めたのか
14

簡単だった
15

・TypeScriptが好きだった。(型があるのが好き)
・Angular2がTypeScriptを採用した。
・Angularという人気ブランドを知っていた。
・人気のないライブラリはいずれ消えゆく運命。
(YUI…)
16

その心は…
YUIといえば、
17

どちらも引退しております。
18

・人気のないライブラリはいずれ消えゆく運命。(YUI…)
・Aureliaを知っていた。(http://aurelia.io/)
・Aureliaの Rob Eisenberg はAngular2チームに居た。
・Aurelia ≠ Angular2 (考え方はかなり似ている)
・英語がそこそこ読めた。
(話を戻します)
19

・人気のないライブラリはいずれ消えゆく運命。(YUI…)
・Aureliaを知っていた。(http://aurelia.io/)
・Aureliaの Rob Eisenberg はAngular2チームに居た。
20

・Angularという人気ブラ
・人気のないライブラリは
・Aureliaを知っていた。(
・Aureliaの Rob Eisenber。
ドヤア
実際これのおかげで思いのほか習熟できた。
21

(本音を言えば)
正式リリース前からAngular2を使いこなせれば
僕でもワンチャンあるんじゃないか。
…ぐらいの腹黒さは多分ありました。
(デスクトップアプリのUIをWeb系でやりたいとか
そういう真面目な理由も少しはあった)
22

今日僕が一番話したいのは、
Angular2の技術的な話ではありません。
24

英語力大事
学生はマジでちゃんと
勉強しておいた方がいいよ
技術的な話などどうでもいい。
25

英語力がAngular2力を決める!
・チュートリアル … 英語のみ
・ドキュメント … 〃
・APIリファレンス … 〃
・ブログ記事 … ほぼ英語のみ
(alpha, beta時代)
・チュートリアル … 英語のみ (いずれ日本語版が…)
・ドキュメント … 〃
・APIリファレンス … 〃
・ブログ記事 … 日本語増えてきたが
全体では英語が圧倒的
(RC時代)
26

(英語力が要求される決定的存在)
GitHub, StackOverflow 英
語
WHATWG, W3C
27

・日本語情報が充実する前にガチ勢になっている
人達はみんな英語の壁を突破している。
・それはAngular2に限らない。
・それはフロントエンドに限らない。
・それはWeb業界に限らない。
・翻訳記事を待っているのでは遅い。
英語力がキャッチアップ力を決める!
28

英語力はもちろん大事。
でもその一方で…
29

(ここから読み取れること)
・コンポーネントという一つの塊である。
・<my-app>タグで配置される。
・templateとclassの実装が対である。
・app.component.scssという外部ファイルを読み込んでいる。
Angular2は初心者にわかりやすい
30

(ここから読み取れること)
・コンポーネントクラスにheroesという配列変数が定義されている。
・heroesを展開して表示しようとしている。
・コンポーネントクラスにgoToDetail()という関数がある。
・クリックすると引数にheroを代入して発火する。
・heroes配列の要素(hero)にはnameというプロパティがある。
・<hero-search>タグで別のコンポーネントを表示しようとしている。
よくできたソースコードはまるでドキュメントのようだ。
Angular2は初心者にわかりやすい
31

少しだけ学ばないといけないことがある
・TypeScript
・ES2015
・rxjs
・zone.js
・webpack
・ComponentとServiceの分離
・DIの概念
・Routing
・Forms
・Testingの書き方
・その他諸々
(ただし)
なんだ
たいしたことないね
32

少しだけ慣れないといけないことがある
(英語力が要求される決定的存在)
GitHub, StackOverflow 英
語
(Issueや会話に参加できるのが理想)
33

そして
プログラミングをやる僕等が
避けて通れないもの。
それは
エラーとの終わりなき戦い。
34

エラー討伐はスピード感が大事
・エラーメッセージを見たらとりあえずそのままググる。(Bingる)
↓
・最新の情報を得るためにGoogle検索の期間指定を使う。(Bingもｲｲﾈ)
↓
・GitHubのIssueを一気に読み通す。パっと検索してパっと見る。
↓
・解決！
あっちもこっちも沼だらけだ！
35

・エラーメッセージを見たらとりあえずそのままググる。(Bingる)
(大体検索上位にはGitHubかStackOverflowがくる)
(検索上位の英語情報から逃げない←これ重要)
・最新の情報を得るためにGoogle検索の期間指定を使う。(Bingもｲｲﾈ)
(1週間以内とか1か月以内とか)
(古い情報を掴んでしまうとさらに沼に落ちる)
・GitHubのIssueを一気に読み通す。パっと検索してパっと見る。
(検索しても解決しなければソースコードを読んで自力で倒す)
(必要ならContribute!)
・解決！
エラー討伐はスピード感が大事
あっちもこっちも沼だらけだ！
36

エンジニアの世界ではスピード感が大事
・英語ができると世界が広がる。
・情報の広がりは英語が圧倒的に速い。
・ほとんどの事は知ってるか知らないかの差でしかない。
・Angular2の次まで見据えよう。
(エラー討伐に限らず)
37

僕はどうして登壇することになってしまったのか
・公式チュートリアル、ドキュメント、ソースコード、
StackOverflow、英語のブログ記事をとにかく読み抜いた。
・2015年Qiitaアドベンドカレンダーで3本書かせてもらった。
(このときの追い詰められた感がかなりの経験になった)
・ツイッターで周りの人達がすごかった。
・恐れずにクソコードでもなんでもGitHubにpushした。
・自分がある程度のスキルに達したところで
イベントに参加する勇気を持てた。
・ng-sakeを皮切りに色々なイベントに参加して
たくさんの人達に良くしていただいた。
※Web関係で仕事していません。
(ここでようやく本題に戻ります)
38

そして声をかけられた。
39
「ちきさん、登壇…

金井さんごめんなさい
40

安心してください。
(写真使用の)許可は取ってます。
41

人のつながりは宝物です。大切にしよう。
僕にとってそのきっかけは英語力だったかもしれない。
そんなお話でした。
少しぐらいは
ng2の技術的な話も
しないとね…
(結論)
人の縁。人に恵まれた。
THE END
僕はどうして登壇することになってしまったのか
42

Angular2の技術的な話も少し (1/3)
・こんなの書いてます。
(ここからは時間が余ったら話す感じで)
43

・個人的に一番オススメの記事。
・Firebaseは非同期DB。仕組みがとても勉強になる。
未経験の人は是非遊んでみるべき。
・WebAppチュートリアルをAngular2 Wayに
書き換えることでAngular2がよくわかる！
44

・Angular2でFluxやったらこんな感じ。
・rxjsのSubjectを使ってデータが単方向に流れます。
・Storeをrxjsで作ると流れがスッキリします。
45

Angular2やるなら避けて通れないもの
・TypeScript
素直にTypeScriptに慣れた方が良い。型で守るの本当に大事。
プロジェクトが大きくなればなるほどポテンシャルを発揮する。
・rxjs
脇役っぽいんだけどかなり重要。
rxjsの威力は自分で書いてみないと腑に落ちない。
使いこなせるようになるとその便利さが病みつきになる。
いわゆる時空を制することのできる魔法のライブラリ。
・zone.js
気にしなくても良さそうなんだけど何回もソースコードを
読むはめになった、Angular2の根っこに位置する存在。
RC6ではmochaでテストを組んでいたためにこれで沼に落ちた。
(最後です)
46

Webエンジニアやるなら避けて通れないもの
・英語力。
TOEIC目標860点ぐらいでがんばって欲しい。
映画のヒアリングは無謀。
でも海外カンファレンス動画ぐらいは聞き取りたい。
英字新聞は無謀。
でもブログ記事ぐらいは難なく読みこなしたい。
・ソースコード読む力。
ドキュメントは案外当てにならない。
当然コメントも全部英語で書いてある。
OSSは原則ソースコードを読んで使うもの。
47

(一般的に)学習量は
1,000～1,500時間である一定のレベルに達し、
10,000時間で熟達者になると言われています。
誰かが出来ることなら
自分だって出来るはず。
何かを始めるのに遅すぎる
ということはない！
色
々
48

ご清聴ありがとうございました。
49

僕はどうしてAngular2をテーマに登壇することになってしまったのか

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (20)

Ähnlich wie 僕はどうしてAngular2をテーマに登壇することになってしまったのか

Ähnlich wie 僕はどうしてAngular2をテーマに登壇することになってしまったのか (20)

僕はどうしてAngular2をテーマに登壇することになってしまったのか