はてなサマーインターン2019に参加してきました

はてなサマーインターンに参加しました。はてなIDid:tomato3713 です. インターン期間中にこのIDに統一することに決めたので、実は期間中は他のIDで呼ばれていました. アイコン同じだから大丈夫でしょうという感じ.*1

応募から京都オフィスに行くまで

学部三年生になって、今年はインターンに行ってみたいなーと考えていました. インターン参加のため, 他の企業のインターン情報も調べましたが次の3点が鍵となってはてなのサマーインターンに応募することを決めました.

  • 全体が4週間と長く開発をガッツリやれるのははてなだけだったこと
  • Go言語が使えること
  • 大学の信頼できる先輩が最高だったとブログに書いていたこと

とはいっても、応募を決めたのは二次募集のそれも締切ぎりぎりでしたので、これは無理かなと思いながら応募をしました.*2 その後、面接の連絡が来て、せっかくなのでオフィスに行ってみたいと考え、東京オフィスでの面接を選びました. *3 面接では、私が個人的に取り組んできた活動について話したり、サークルの VPS / ウェブサイト管理でのやらかし*4と対処の話を丁寧に聞いていただけました. はてなの面接はエンジニアが行うので, この辺の話もしやすく比較的落ち着いてできました.

しばらくして合格の連絡が来ました.

その後、実際にインターンに行くまでは大学の課題をなんとかこなし, その合間にインターン課題を終わらせるだけで時間が過ぎて行きました.

インターンの開催場所は京都と自宅から遠かったのでインターン期間中はホテルに宿泊することになりました.

前半2週間のまとめ

今年は、Go言語*5 と TypeScript を使って、日記のウェブアプリケーションを作るものでした. 午前中は講義、午後はそこででた課題にそって機能を実装していきます.

インターンのガイダンスでの説明で PC のスペックが心配になったので Mac を貸与していただきました. 関与して頂いた Mac のキー配列がUSで, 普段使用している配列がJISだったため記号の位置を覚えるのに若干苦戦しましたがすぐ慣れました.*6 次に買うときはおそらくUS配列のキーボードを買うことになると思います.

React, TypeScript が無限にわからんと言いながら課題のダイアリーに機能を追加していきました. 講義パートが終わる頃には、もともとあるものに機能を足していくことはできるかなと思えるぐらいまでは書けるようになったかなと思います. 講義パート最終日の発表では、「みんなで作る日記」として改造しました.

ちなみに前半の初めの方は Vim でコードを書いていたのですが設定が悪いのか補完が効かないシンタックスハイライトがうまく動かないわで辛かったです. 発表が近づいてきたタイミングで, しんどくなって VS code に移行したのですが凄まじかったです. ぽちぽちやっていたらいい感じにフォーマットしてくれたり色をつけてくれたりでなんかもうすごい. 気軽.

kyoto.なんか

インターン期間中に開催されていたIT勉強会に参加しました. 飛び込みの登壇もあったので, 勢いで Vim のヘルプファイルを翻訳したときの話をしました.*7

後半2週間まとめ

後半は、Mackerel チームに配属されました. 顔合わせの後、導入として Issue*8 を一つ解決して PR を作るところまでをモブプログラミングを行ないました. Issueの内容を把握, 該当箇所のコードを特定して変更を加えていくのですが, 人がどういうところに目をつけてコードを読んでいくのか, エイリアスの設定を見れて参考になりました.

例年の Mackerel チームはリリース数が多いのですが、今年は若干少なく目玉機能一つといくつかの修正のリリースになりました.

今回作成した目玉機能は アラートステータスウィジェットダッシュボードへの追加です. 一緒に Mackerel チームに配属された id:noy72 と役割分担をして作業を進めていきました. 自分はフロントエンド側を担当していたので、主に TypeScript を使って画面の作成を行いました.

Mackerel のような規模の大きなサービスでの開発は初めてだったことと Issue と Pull Request を駆使した開発に慣れていなかったので苦労しました. 一人で開発をやっているとどうしてもこういう点に疎くなってしまってせっかくの Git / GitHub の機能を生かしてこれなかったなあというのを実感していました.

実際の開発では, コードの規模が大きく変更箇所を探し当てられず, またどう変更したらいいかわからず id:lufiabb さんや id:side_tana さん, id:susisu さんによく聞いていました. Pull Request 後のコードレビューで確かにこういう書き方は良くなかったなあと反省したりしました.

なんとか最終日までにリリースできてよかったです.

インターン期間中に実装できた機能はまだまだ基本的な部分だけであり, アラートステータスウィジェットはいくつもの改善が行われ, より洗練されたウィジェットになっていくはずです. インターン最終日の社内発表会「ほたて」では惜しくも3位と入賞はできませんでしたが, このような基礎となる雛形の機能を作ることができたことは嬉しく思います.

自分でもアラートステータスウィジェットを使いたいのでプランをアップグレードするしかないかなと考えています.*9

なんと Mackerel アンバサダーを拝命できることになりました! id:daiksy さんを初め Mackerel チームの皆様に感謝です. *10

アラートステータスウィジェットについて

この記事がでた時点ではドキュメントが反映されていないかもしれないので簡単な説明を書いておきます.

カスタムダッシュボードを利用する - Mackerel ヘルプ

アラートステータスウィジェットは, サービスとロールで絞り込んだホスト群のアラートの状態を見るためのウィジェットです.

カスタムダッシュボードの作成画面にでてくるドットが並んだアイコンをドラッグアンドドロップすることで作成できます.

f:id:tomato3713:20190916145552p:plain
アラートステータスウィジェットのアイコン

f:id:tomato3713:20190916151644p:plain
アラートステータスウィジェットのイメージ

ドット1つ1つがそれぞれのホストに対応していて, ドットにマウスを合わせることでホスト名が表示されます. ホスト群のアラートの概略を掴むことを目的としているためこのウィジェット内では現時点では詳細なアラート状態はみることができませんが、ドットをクリックすることで該当ホストの詳細ページに移動することができます. アラート状態でソートされ Unknown, Critical, Warning, OKの順番で表示されます.*11

上記でかけなかったことをいくつか

  • はてなインターンの同期生は仲良くなるようなので Twitter とかで声かけてほしい.
  • ボードゲーム楽しかったのでまたやりたい.
  • たまこまーけっと聖地巡礼に行きました. みんな予習してきていてさすが.
  • インターン中に社員に相談して, サークルの Web サイトでリダイレクトの設定をしていても証明書エラーが起こってサイトが見れないという問題が解決できました.
  • OSS の mackerel agent に PR *12 をだしました.
  • Org内検索の文字数制限が改善されたので s3 等で検索できるようになりました. *13
  • 最後に Mackerel のグッズをもらってめっちゃ嬉しかった.
    f:id:tomato3713:20190915010449j:plain
    Mackerelチームで行った焼き肉であったアラートステータスウィジェットに似ていると話題になったナス

他のインターン生のブログ記事

はてなサマーインターン2019 に参加していました - ふるつき さだまさしの印象が強すぎました. CTF やりたいと思っていてやれていなかったので次は CTF の話したい.

はてなサマーインターン 皇紀2679年の夏 - かすのブログ id:ergofriend と自分との出会いの描写がかっこいいのでぜひ読んでほしい.

はてなインターン2019で優勝した - 私が歌川です 後半の何日目かで Perl の Language Server を Docker 内で立ち上がるようにしたのが楽しかった. Language Server のファイルの読み込みが意外と早くてびっくりした.

はてなインターン2019攻略記事 / 参加してきました - lunastera’s diary 最終日に Scala のかっこよさを教えてもらいました*14. 1週間もかからずに独自のマークアップ言語を作っていてすごかった. 前半でメンターが一緒だったインターン生.

はてなのインターンに参加したお話 - 十を聞いて一を知る カメラ滅茶好きそうだったという印象. 話しているときにまとっている空気が結構すきでした.

はてなサマーインターン2019に参加してきました - 鯰の住処 よくホテルの朝食で一緒になりました. いつか金髪にすることを期待してます.*15

*1:インターン中のはてなIDは, id:jj1hgp でした.

*2:後に GitHub をコミット単位まで見られていたという話を聞いて, ちゃんと書こうと意識していてよかったとなりました...

*3:東京オフィスの社員と話した後, 京都オフィスのエンジニアととリモート面接になります

*4:PHP のアップグレードした際に HP が表示されなくなってしまうということがありました.

*5:後半過程で Go言語を使ったのは自分だけだったらしい. ほかは TypeScript, ScalaPerl が多かった印象

*6:US配列じゃないと違和感を感じる体にされてしまいました...

*7:その時の発表資料: Vim ドキュメントの翻訳への誘い

*8:アラート一覧に作成時刻, 更新時刻を表示するようにするという Issue でした.

*9:カスタムダッシュボードがフリープランだと使用できないため

*10:Mackerel 駆動学習ができそう.

*11:アラートがでているホストがあっても, これくらいの割合なら大丈夫といえるようになって便利

*12:https://github.com/mackerelio/mackerel-agent/pull/592

*13:2文字以上のキーワードの組み合わせで検索可能になりました.

*14:for, Implisitの書き方がかっこいいこととプログラムの雛形が作れるのがよかった

*15:はてなIDが blondnamazu なので