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.4k
サーバサイドエンジニアがフロントエンドを始めた時の試行錯誤
d9magai
August 07, 2019
Tweet
Share
More Decks by d9magai
See All by d9magai
20200122_Amazon_Rekognition.pdf
d9magai
0
250
20191211_JAWS-UG_TOHOKU_Amazon_Rekognition.pdf
d9magai
0
260
チーム開発のコードレビューにおける些末なコードレビューを避けるための提案
d9magai
0
410
20190212.pdf
d9magai
0
120
Amazon Rekognitionを使って親御さんの写真探しのお手伝いができた話
d9magai
0
2k
Minami Aoyama Night#5 sen-corporation
d9magai
0
710
Other Decks in Programming
See All in Programming
第9回 情シス転職ミートアップ 株式会社IVRy(アイブリー)の紹介
ivry_presentationmaterials
1
240
Is Xcode slowly dying out in 2025?
uetyo
1
210
Create a website using Spatial Web
akkeylab
0
310
C++20 射影変換
faithandbrave
0
540
Team operations that are not burdened by SRE
kazatohiei
1
260
『自分のデータだけ見せたい!』を叶える──Laravel × Casbin で複雑権限をスッキリ解きほぐす 25 分
akitotsukahara
1
570
ASP.NETアプリケーションのモダナイズ インフラ編
tomokusaba
1
420
DroidKnights 2025 - 다양한 스크롤 뷰에서의 영상 재생
gaeun5744
3
330
Enterprise Web App. Development (2): Version Control Tool Training Ver. 5.1
knakagawa
1
120
地方に住むエンジニアの残酷な現実とキャリア論
ichimichi
5
1.4k
CursorはMCPを使った方が良いぞ
taigakono
1
190
関数型まつり2025登壇資料「関数プログラミングと再帰」
taisontsukada
2
850
Featured
See All Featured
Fireside Chat
paigeccino
37
3.5k
Building Applications with DynamoDB
mza
95
6.5k
The World Runs on Bad Software
bkeepers
PRO
69
11k
KATA
mclloyd
29
14k
How to Ace a Technical Interview
jacobian
277
23k
Why Our Code Smells
bkeepers
PRO
337
57k
What's in a price? How to price your products and services
michaelherold
246
12k
A designer walks into a library…
pauljervisheath
207
24k
For a Future-Friendly Web
brad_frost
179
9.8k
Designing Experiences People Love
moore
142
24k
Java REST API Framework Comparison - PWX 2021
mraible
31
8.6k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
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