I want to be "I can develop frontend a little"

とあるエンドエンジニアの勉強会や技術系の個人的メモ集。

2019/07/06 Battle Conference Under30に参加してきました。

2019/07/06(土)にBattle Conference Under30 に参加してきました!

bcu30.jp

イベント自体は3回目の開催だそうですが、私は初参加でした。

新宿の芸能花伝舎という小学校をリノベーションしたイベント施設で行われたため、オープニングもチャイムと「こんにちはー!」という挨拶で素敵な演出からスタートです。

開会挨拶

株式会社サイバーエージェント取締役の長瀬 慶重氏

ざっくり内容

  • エンジニア以外の人がプログラムを触る機会が増え、小学生がスマホアプリを作る時代になっ てきて、エンジニアのすそのが広がっていく昨今。

  • エンジニアの像としては、「サービスをつくることに長けている人」「コアな技術を生み出す人」「実装だけをメインとするエンジニアの人」に3つに体系化されていきそう。

  • いろんな像があるけれども、今まで500人くらいエンジニア新卒エンジニアとして採用してきて、エンジニアとして輝くために必要なことは「技術に対する興味関心」。

  • 今年は過去一の出来なので、お楽しみに!

技術にまつわる戦略思考

基調講演株式会社AppBrew代表取締役の深澤 雄太氏

内容

創業期

  • 創業前
    • フリーランス
    • フロントエンドからサーバーサイドの一通りのレイヤーはできるように
  • 創業したきっかけ
    • 社会にインパクト生み出せしたい
    • 自分の向き不向きを感じながら進めることに
  • 起業
    • ユーザーニーズを捉えて、技術でサービスを作る苦労を経験
    • LIPSは5つ目のプロダクト
  • 成長期
    • プロダクトを伸ばすためなら採用、ディレクター、開発、事業計画、資金調達…などなど
    • 技術力も大切だけど、選択や運用も大切
      • 個別に判断してもらえるように

エンジニアが成長するためには?

  • 経営視線を身につけること
  • なぜ必要?
    • 技術と経済発展は両輪で進んでいる
    • 片方かなくして成り立たない=技術だけでは足りない!
  • 経営者側に技術力も足りない?
    • 経営者に技術を伝えられる事業理解のあるエンジニアが足りない
    • グローバルでは技術のバックグラウンドを持った経営者が多めな印象

戦略的

  • 目的→課題設定→仮設検証 =方法論
    • 基礎的なことを高いレベルで継続することが大切
      • 現状把握して、課題を洗い出して、この課題を解決する方法を考えて、実装する

現状把握と課題抽出

  • できるだけ数値で客観的&多角的な把握を
    • 会社の目標や利益、滞在時間とかで考える
  • 乖離がなければ目標と時間軸を見直す
    • 目標の中に落とし込む

解決策を考える=仮設を立てる

  • ポイント
    • 自分のこだわり(特定の技術や機能)はできるだけなくす
    • 解決策として成立しているのか
    • コストパフォーマンスが最も良くなっているか
    • 効果は測定できるか

検証は大切

  • データリテラシーは基本
  • ポイント
    • 実際に数値が改善した
    • 本当に意味のある変化になったか(A/Bテストなどの方法論)
  • 仮説が外れたらどうするの?
    • 仮説を再設定
    • ひたすらこれを繰り返す

とはいえ、マッチョすぎない?

  • プロダクトの方針に決める立場になくても理解と意見を持つことが大切
  • ただ技術が好きなだけなんだけど
    • 技術も世の中のプロダクトも生み出せないと消えていく
    • 経済合理性を前提にどう生かしていくかが大切

より大きなインパクトを出すためのポイント

  • 技術の高度化に順応する
    • 1人でできることは多い
    • 特定の技術にこだわらず
    • 目標に向かった学習&運用
  • 環境を選ぶ
    • 自分の目標やキャリアに対して最適な場所を選び探すことが大切
    • エンジニアとして伸びそう
      • 成長性がある
      • 経営陣が理解
      • 風通しよく議論できる

まとめ

  • 技術より事業を動かせることが大事な局面もある
  • 事業理解ががあれば、必要なときは手や声を上げてみよう
  • 世の中、会社、自分をしっかりメタ認知し、腰が引けないよう積極的に動いていきましょう
  • リアルな課題を理解して、俯瞰的な視点を持てるとよさそう
  • 経営目線を理解し、よりよいエンジニアライフを!

感想

エンジニア×経営視点は大事だなって思っていたのですが、エンジニアは経営は考えなくてよいのでは?な話を聞く機会の方が多かったので、今回のお話で一意見として肯定して頂いた気がしました。(※決して否定されたことがあるわけではないです)
経営者も、エンジニアも、デザイナーもそれぞれの領域を尊重して歩み寄っていきたいです。

事業成長を加速させるフロントエンド改善のお話

ヘイ株式会社 STORES.jpの山下 功介氏

speakerdeck.com

ざっくり内容

  • フロントエンド改善での取り組みをいくつか紹介
    • Rails × AngularJS から Vue.js/Nuxt.jsに移行
    • 長い目で開発スピードを上げるためには基盤構築やルールが必要
      • 3ヶ月間で基盤構築を実行+2ヶ月で実装
    • 見えてきた複数の課題
      • UIコンポーネントのルール
        • Storybookの導入
      • レビュー環境の見直し
        • CircleCI×Lambda@Edgeで1プッシュで1URLを発行し、プレビュー環境を作成
      • テストの効率化
      • 既存とのUIをかんたんに比較できるように REG-SUITを導入
  • いろいろ解決していったけど、課題はたくさんあります

感想

土台がない状態で作り上げた環境を長い目でメンテナンスするシステムに置き換えるのもかんたんではないな、と感じました。 今回この話であったレビュー環境はとてもよさそうだなーと思ったのですが、自社に入れるにはどうしたらよいか思いつかず…。もっと勉強しないとですね。
登壇者の方は入社5日目にしてBCU30に登壇することを決めたとのことで、勇気と行動力に感服でした…!

大規模フロントエンドの技術的負債に戦う

サイボウズ株式会社の外松 俊尚氏

speakerdeck.com

ざっくり内容

  • サイボウズのKintoneプロダクトに関わるフロントエンドエンジニアの方のお話
    • 技術的負債と向き合うためにやってきたこと、なぜ技術的負債に向き合って、向き合ったことのメリットについて
      • チームで「開発系の改善」をテーマにワークショップ
        • ワークショップでわかったこと
          • 必ずしも皆が同じ感覚でいるわけじゃない
          • デファクトだから、は導入するきっかけにはならないので、なぜよいのか、の価値を伝える 必要がある
          • 開発に関するつらみ(課題)からツールを提案すると理解してもらいやすい
      • 最新技術を共有する勉強会を週に1回開催
  • 技術的負債は専門性を高めて時間をかけて向き合う必要がある
    • 小さな問題からコツコツと解決
    • モブプログラミングを活用

感想

自分も長年運用されているシステムを担当しているので、同じ悩みを抱える会社はあるんだなーと改めて思ったのと、小さな問題から片付けていく大切さを改めて実感しました。
社内で月に1度技術共有会をやっていて、学びが多いなーと感じているので、もっと小さな単位でライトに共有できる勉強会もよさそうだな、と思いました。

インフラエンジニアの為のソフトウェア開発手法入門

GMOインターネット株式会社の元内 柊也氏

speakerdeck.com

ざっくり内容

  • なぜ自動化が必要か?
    • 属人的に解決してたけど、そのままでうまくまわっていかない
      • ナレッジやオペレーションでかいけつ
        • SRE
        • noOps
  • なぜ良きコードが必要か?
    • 自動化したコードは作りたてが一番動く
      • 改修のために、解読して、運用する必要がある
        • これをうまくやるためには?
          • CleanCode
  • なぜアーキテクチャが必要か?
    • なにかをただ1度だけ動かすことは難しくない
      • インフラシステムは劣化していく
      • アーキテクチャを整える
        • システムを構築、保守するために必要な人材を最低限に抑えられる

感想

お仕事の領域がフロントエンドなので、内容がわからないかな?と思ったのですが、フロントでもインフラでも開発時に考えることや悩むポイント(設計ちゃんとやっとけばよかった)は同じなんだな、と思いました。
「料理は作りたてが美味しいようにコードも作りたてが一番動きます」という言葉がよい例えすぎたので、今後も引用させて頂きたいです。

東京という海と、コミュニティという島と、私

株式会社いい生活の平尾 元紀氏 speakerdeck.com

ざっくり内容

  • 社会人になるまで考えもしなかったところにいる
    • 今まで
      • 狭い視野で充実していた
    • 勉強会に参加して、コミニティに触れる
      • いろんなエンジニアがいることを理解
      • なりたいエンジニア像を見直し
    • 様々なコミュニティに参加
      • モチベーションが上がる
      • すごいひとがいるけど、自分がすごいひとかどうかは別なお話なので注意
    • 好きなものをやってるところに参加していこう
    • 東京という海に漂うだけでなく自分で島を回って成長していこう!

感想

もともと勉強会やカンファレンスの多さから東京にでたい!と思っていたので、社会人1年目は闇雲にいろんな勉強会に参加してたなーということを思い出しました。 
勉強会で人と話すことで、社内の悩みが意外とあるあるな悩みだと知れたり、いろおな考えを知れたり、学び多い時間が多いなと思います。
これからも成長のためにやっていきたいな、と思いました。

4歳からプログラミングに夢中な"テックキッズ"が開発したアプリ「今日の洋服何着てく?」の紹介

Tech Kids Schoolに通う澁谷 知希氏

内容

経歴

  • 4歳からプログラムにふれる
  • 今まで使ってきた言語
    • HTML/JavaScript/CSS
    • PHP
    • MySQL
    • Unity
    • C#(一番ややこしかった)

      朝、服が決められない小学生のために天気からおすすめの服装を提案するアプリ「今日の洋服何着てく?」を開発

  • 使い方
    • 郵便番号と性別を選ぶだけ
  • 頑張ったところ
    • 2D
    • APIを使って緯度経度を取得
      • 定期的に情報を取得
    • 熱中症予防のための水筒を表示するポイントの検討
  • こだわりポイント
    • UI
    • Unityで背景の設定

      今後の展望

  • GPSを取得して、アプリを立ち上げるだけで確認できるように
  • 服を登録して、コーディネートを提案

感想

「小学生エンジニア」として今回登壇されていたのですが、「小学生」ではなくて、本当に普通に「エンジニア」だな、と感じました。 自分の思う課題に対して、技術で応えることを自然にできてて本当にかっこいいな、と思いました。 彼らのような優秀なエンジニアと共存できるように、頑張っていこうと前向きになれました!元気をもらえましたー!

パラレルキャリアがもたらす相乗効果

ヘイ株式会社 Coineyの内立 良介氏

speakerdeck.com

ざっくり概要

  • パラレルキャリアってなに?
    • 将来への自己投資が目的
      • はじめやすくなった
    • エンジニアの幅を広げるためのキャリア
  • なぜ始めたのか
    • 前提
      • いまの会社で満足している
        • サービス目線で開発できるエンジニアが多い
        • テックとビジネスのバランスが取れている
    • キャリアの悩みがある
      • 転職したくないけど、スキルアップしたい
      • 複数の環境でキャリア積んじゃえ!
  • 各キャリアの相互作用も生み出せている
  • パラレルキャリアで身についたスキルもたくさん
  • 時間に追われることやコミュニケーションコストがかかるのはデメリット

    感想

    カンファレンススタッフもキャリアとして上げられていて、個人的には目からウロコでした。
    イベント運用は好きでやっていることですが、仕事でも趣味でもない宙ぶらりんだなーと個人的に思っていたので、「キャリアの1つ」として見る考えはとてもよいな、と思いました。

Atomic Components

フリーランスの翁 華宏氏のお話。

slides.com

ざっくり内容

  • 昨今話されている「AtomicDesign」って誤解があるのでは?という問題提唱のお話
    • フロントエンド界隈で「AtomicDesign」で解決しようとしている課題は「コンポーネントシステム設計」の話
    • 「AtomicDesign」は、「デザインシステム」であって、「コンポーネントシステム設計」を直接的に解決できるわけではない
    • 根本の考え方が違うため
  • フロントエンド界隈の課題を解決するには「Atomic Components inspired by Atomic Design」の方がよさそう
  • まとめ
    • ある考えから影響を受けた考えには別の名前をつけるべき
    • 現代のコンポーネントシステムを上手く乗りこなしていこう

感想

AtomiDesignの提唱者の方がデザイナーさんだったことやAtomicDesignが「デザインシステム」として提唱されていたことも知らなかったので、びっくりでした。 スライド内であった「molecules?」「Organization?」な会話は見に覚えがあって、笑ってしまいました。 解決したい根本が違えば、なんか合わないな、が発生するのは当然だなーと思いました。やっぱり原著や一次情報源を確認するって大事ですね。
今回話しにあった「Atomic Components」もちゃんと読んで、理解したいです。

エンジニアキャリアにおける焦燥感との向き合いかた

LINE株式会社/ElevenBackの花谷 拓磨氏

speakerdeck.com

ざっくり内容

  • 焦燥感
    • エンジニアのキャリアを考える上で重要
    • プラスにもマイナスにもなる
  • プラスになるとき
  • マイナスになるとき
    • 上の立場になったとき
        - 余裕がないリーダーって頼りたいと思えない
      
  • 正しい焦燥感
      - キャリアアップを目指す
      - キャリアチェンジしたい
    

    今、どちらにいますか?

感想

資料も内容も盛りだくさんなのですが、すっと入ってくる内容でした。
「今、どちらにいますか?」という問いかけだったので、自分なりに考えてみると今は「キャリアアップ」を考える時期だな、と思いました。
エンジニア経験が長いひとたちに囲まれているので、 一足飛びには何事もできるようにならないので、コツコツと頑張っていこうと思います。

30代のキャリアを意識した20代のキャリア戦略

サイボウズ株式会社の向井 咲人氏のお話。

speakerdeck.com

ざっくり内容

  • こんな経験ありませんか?
    • 3年後、5年後どうなっていたいとか聞かれたり、将来への投資したらいいよ、とか言われる
  • 正直、5年後、1年後すら不明確
    • 使っている技術もデバイスも違うし、会社の状況や働き方だって変わる
  • どうすればいいの?→あえて30代を予測しない
    • 会社依存ではなくて、個人にフォーカスした時代がくる
    • 個人のちからを磨き、不確定な未来を対応していこう
  • 不確定な未来に向けて土台を作る
    • 経験を掛け合わせよう
    • そのための戦略
  • 好きなこと、ワクワクすることに素直になって、未来に向けて楽しんでいこう

感想

「不確定な未来に向けて土台を作る」という目標を持って、将来へ確実に向かっていく考えが素敵だな、と思いました。 登壇者の方が 「Y社の前取締役の方が「自分株式会社を常に運用していこう」とおっしゃってて、そのとおりだと感じた」とお話を聞いて、私も確かにそうだな、と感じました。
自分をドライブできるのは自分だけですもんね!

サービスメッシュを導入してよかった話

株式会社サイバーエージェントの江頭 宏亮氏のお話。

内容

インフラ

  • マイクロサービスのアンバサダーパターンを採用
  • アンバサダーパターン
    • Envoyのプロキシを採用
      • 昨今ではIstioが話題だが、 2018年4月にはあまり知見がなかった
    • 目的

感想

「サービスメッシュってよくわからないけど、おもしろそう」ベースで参加。 知らない言葉や用語が多くて、理解力が乏しくメを断念…。インフラの知識が乏しすぎます…。 周りの方々はよさそう!とおっしゃっていたので、よいんだなーと感じました。

「グノシー」の新規サービス事情

株式会社Gunosyの山本 舜氏

内容

グノシースポーツ

  • スポーツ特価版
    • 好きなチームの情報をリアルタイムに届けるサービス
    • リコメンドとかいろんな機能があるよ

      新規事業のあるある

  • プロダクトの本質的な改善に時間をかけたくない

    AppSync

  • よさ
    • コード無しでクエリが掛ける
    • フルマネージドGraphQLサービス

      やりかた

  • リアルタイム更新
    • サーバーサイド
      • だけで技術がいろいろ必要そう
      • 負荷試験
      • 同時接続大変
    • アプリサイド
      • 接続不良時どうするよ的な問題もあり
    • AppSync+リアルタイム更新
      • Webソケットの部分

        つらみ

    • APIの仕様と実際のレスポンスとずれている
    • リアルタイムデータのスキーマの共有大変
    • スキーマファースト
      • スキーマ定義 → データスースとの結合の流れしかできない
        • この流れしか作れないのでむしろ便利
    • 複雑なデータ構造
      • RESTだと辛いネストデータ
        • エンドポイントでいろいろ考えられるよね
    • フロントエンドが必要な情報を選択可能
      • UIの細かい改善をフロントだけで完結できる

感想

AppSyncを知らなかったのですが、「フロントエンドが必要な情報を選択可能」で「 UIの細かい改善をフロントだけで完結できる」点はとても魅力的だなーと感じました!技術面白い。

全体の感想

同世代のエンジニアの方の登壇を1日でぎゅっと聞けて、学び多い一日でした。 懇親会でも同世代エンジニアと交流ができて、刺激をもらえました! なりたいエンジニア像に近づけるようやっていきます!
来年は登壇したいので、とりあえず登壇者応募します!(何を登壇するかは考えていませんが…)

おまけ

スポンサーブースでTシャツやパン、お菓子を頂き、最後の懇親会の抽選会で本をいただきました✨
勉強します…!

f:id:matsumana07384:20190710001834j:plain