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
サーバサイドエンジニアがフロントエンドを始めた時の試行錯誤
Search
d9magai
August 07, 2019
Programming
6
3.2k
サーバサイドエンジニアがフロントエンドを始めた時の試行錯誤
d9magai
August 07, 2019
Tweet
Share
More Decks by d9magai
See All by d9magai
20200122_Amazon_Rekognition.pdf
d9magai
0
220
20191211_JAWS-UG_TOHOKU_Amazon_Rekognition.pdf
d9magai
0
200
チーム開発のコードレビューにおける些末なコードレビューを避けるための提案
d9magai
0
320
20190212.pdf
d9magai
0
80
Amazon Rekognitionを使って親御さんの写真探しのお手伝いができた話
d9magai
0
1.8k
Minami Aoyama Night#5 sen-corporation
d9magai
0
640
Other Decks in Programming
See All in Programming
Droid Knights 2024 Github Actions 효율적인 배포 환경 만들기
kts6056
0
130
ABEMA 画像配信基盤における Cloudflare Workers の活用
peaceiris
7
640
Google I/O 2024 Android 開発ツールの新機能
tonionagauzzi
0
160
Towards Structured Data: LLMs from Prototype to Production
inesmontani
PRO
1
150
CSC307 Lecture 01
javiergs
PRO
0
200
Get started with Compose Multiplatform!
ogi2ogi
0
410
プログラミングスクールのつながりがキャリアにつながるのかもしれない話 / Connections at programming schools may lead to a career
aiandrox
0
280
技術サポートでよく見かけるパターンと便利な活用方法
tamai_63
0
150
Gobra で見る形式検証 (mercari.go #26)
artoy
0
390
JJUG CCC 2024 Spring自動アップグレードを夢見て、Amazon Q Developer使ってみた
toricky6
2
170
Web 開発における Deno Fresh の活用例:ペアプロタイマー timer.team の開発
lef237
1
550
エンジニア向け 株式会社バックテック 会社紹介資料 / for Engineers
backtech
1
550
Featured
See All Featured
WebSockets: Embracing the real-time Web
robhawkes
59
7.1k
Building Applications with DynamoDB
mza
89
5.8k
Being A Developer After 40
akosma
68
580k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
23
1.5k
Put a Button on it: Removing Barriers to Going Fast.
kastner
58
3.2k
Music & Morning Musume
bryan
42
5.8k
Building Your Own Lightsaber
phodgson
101
5.8k
How to name files
jennybc
66
95k
Keith and Marios Guide to Fast Websites
keithpitt
408
22k
Creatively Recalculating Your Daily Design Routine
revolveconf
213
11k
A designer walks into a library…
pauljervisheath
201
24k
The Mythical Team-Month
searls
217
42k
Transcript
サーバサイドエンジニアがフロント エンドを始めた時の試行錯誤 Sendai Frontend Meetup #1 2019年08月07日 熊谷大地 千株式会社 1
© SEN CORPORATION 今日の発表内容 • サーバサイドに専念していてフロントエンド開発の変遷につ いていけてなかったエンジニアがフロントエンドを担当する ことになった際の試行錯誤と悪戦苦闘の話です • 自分の体験に基づいた内容なので誰にでも当てはまるもので
はないかもしれないです • これはやるべきではなかった、こうしておけばよかった、と いった話をしたいと思うので他山の石になれれば幸いです 2
© SEN CORPORATION 自己紹介と会社紹介 • 名前:熊谷大地 ◦ 宮城出身 ◦ 一児の父
• 所属: 千株式会社 ◦ ものづくり部 2013年 千株式会社入社 ↓ 2018年9月 仙台オフィス開設 ↓ 東京から仙台に引っ越してこちらで働くことに←イマココ 3
© SEN CORPORATION 」の海外進出 海外では「スクールフォト」の文化があまりない→保護者に子供達の写真を! 海外版はいチーズ開発の体制 Aさん:フロントエンド Webデザイン、UI/UX等フロントの開発 私:サーバサイド DB設計やAPIの実装等のサーバの開発
写真サービス「 4
© SEN CORPORATION サービスをリリースして営業が顧客を取り始めた頃・・・ リリースまでこぎつけた 偉い人 実質一人で開発頑張れ 私 マ? 開発の体制の変化
私:フロントエンドとサーバサイド 5
© SEN CORPORATION • 自身選択肢を狭める ◦ フロントエンドの技術を避けてきたことは自身にとってマイナスだった • 退っ引きならない状況になったらそんなこと言ってられない ◦
ポン・デ・ライオンだとかどうとか関係ない この時の私の思い 「自分はサーバサイドのエンジニアだから・・・」と考えて フロントエンドと向き合わないでいると・・・ そんな事言われても ウチ ポン・デ・ライオンやし 6
© SEN CORPORATION • 同じリポジトリのコードではあるが、まずは腰を据えて読み込む • コードを読む→少し書き換える→どう変わったか確かめる • この繰り返しで感覚をつかんだらなんとかなると思っていた まず取り掛かったこと
7
© SEN CORPORATION • 同じリポジトリのコードではあるが、まずは腰を据えて読み込む • コードを読む→少し書き換える→どう変わったか確かめる • この繰り返しで感覚をつかんだらなんとかなると思っていた まず取り掛かったこと
結果的にはコードをひたすら読むことは効果があった しかしそれで十分だと思ってしまったところはよくなかった 8
© SEN CORPORATION Aさん「何かわからないことがあったら聞いてね」 自分が何がわからないのかわからない状態で聞くに聞けない 何がわからないのかわからない状態 JS? Vue? Vuex? 9
© SEN CORPORATION Aさん「何かわからないことがあったら聞いてね」 自分が何がわからないのかわからない状態で聞くに聞けない 何がわからないのかわからない状態 なんとかして分からないところを特定するために、 • JSは構文を覚える ◦
参考にする情報の鮮度に注意 • Vue, Vuexはチュートリアルで学ぶ ◦ これは効果的だった • 迷っていないで聞いてしまう ◦ 何が分からないか分からない人を相手にするのは高コストなのでそこは注意 10
© SEN CORPORATION Vueのチュートリアルは初心者向けに丁寧に書かれている 早い段階でよく目を通しておけばよかった Vueのチュートリアルの重要性 「俺、初心者じゃねーし」とイキった結果→\(^o^)/ また、注意書きを素直に受け止めておけばよかった 11
© SEN CORPORATION console.log()デバッグは限界があった 初期の段階で効率のいい開発環境を用意するべき 効率よくデバッグできる開発環境 例: VS Code +
Debugger for Chrome Extension + Vue.js devtools 12
© SEN CORPORATION 「出てもどうせ分かんねーし」なんて言わずに出ればよかった 正直、勉強会は刺激にはなるが短期的に役立つ何かを得られるわけではない、 という考えがある しかし刺激がないよりはあったほうがずっと良い、と思う Sendai Frontend Meetup
とかいい感じですよね フロントエンド勉強会への参加 13
© SEN CORPORATION 最後に • フロントエンド、サーバサイドの役割分担を否定する意図はない ◦ 規模が大きくなって複雑化してくると一人で全部やるとか無理 • 私にとっては苦手意識を持って避けてきたことはマイナスだった
◦ 自身の選択肢が狭まる ◦ やってみたら面白かったかもしれない仕事が出来なかった • 退っ引きならない状況になってから始めたフロントエンド開発 ◦ とてもDX(開発者体験)の良い世界 ◦ とはいえまだまだ分からないことが多いので勉強頑張ります エンジニア募集中です 14