サーバサイドエンジニアがフロントエンドを始めた時の試行錯誤Sendai Frontend Meetup #12019年08月07日熊谷大地千株式会社1
View Slide
© 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 CORPORATIONAさん「何かわからないことがあったら聞いてね」自分が何がわからないのかわからない状態で聞くに聞けない何がわからないのかわからない状態JS?Vue?Vuex?9
© SEN CORPORATIONAさん「何かわからないことがあったら聞いてね」自分が何がわからないのかわからない状態で聞くに聞けない何がわからないのかわからない状態なんとかして分からないところを特定するために、● JSは構文を覚える○ 参考にする情報の鮮度に注意● Vue, Vuexはチュートリアルで学ぶ○ これは効果的だった● 迷っていないで聞いてしまう○ 何が分からないか分からない人を相手にするのは高コストなのでそこは注意10
© SEN CORPORATIONVueのチュートリアルは初心者向けに丁寧に書かれている早い段階でよく目を通しておけばよかったVueのチュートリアルの重要性「俺、初心者じゃねーし」とイキった結果→\(^o^)/また、注意書きを素直に受け止めておけばよかった11
© SEN CORPORATIONconsole.log()デバッグは限界があった初期の段階で効率のいい開発環境を用意するべき効率よくデバッグできる開発環境例:VS Code+Debugger for Chrome Extension+Vue.js devtools12
© SEN CORPORATION「出てもどうせ分かんねーし」なんて言わずに出ればよかった正直、勉強会は刺激にはなるが短期的に役立つ何かを得られるわけではない、という考えがあるしかし刺激がないよりはあったほうがずっと良い、と思うSendai Frontend Meetup とかいい感じですよねフロントエンド勉強会への参加13
© SEN CORPORATION最後に● フロントエンド、サーバサイドの役割分担を否定する意図はない○ 規模が大きくなって複雑化してくると一人で全部やるとか無理● 私にとっては苦手意識を持って避けてきたことはマイナスだった○ 自身の選択肢が狭まる○ やってみたら面白かったかもしれない仕事が出来なかった● 退っ引きならない状況になってから始めたフロントエンド開発○ とてもDX(開発者体験)の良い世界○ とはいえまだまだ分からないことが多いので勉強頑張りますエンジニア募集中です 14