Hatena REMOTE INTNERNSHIP 2021 に参加しました！
id:toutounodeです。はてなリモートインターンシップ2021に参加し、非常に充実した3週間を楽しく過ごせました。以降のはてなインターンへの参加を考えている方向けになったらいいなと思いつつリモートならではの話も交えつつ時系列順に参加記を残していけたらなと思います。
サマーインターン応募から面談や準備まで
応募
今年の4月に大学院に進学し、研究室での顔合わせで内定をもらった先輩に夏にインターン行くといいぞと聞いたのがきっかけです。この頃から夏のインターンがチラつき始め、なんとなく自分が気になる分野のインターンを探し始めました。去年dockerコマンドで応募できるインターンシップがあったなと思い出し、まだ4月半ばだけどインターンページあるかなぁ〜って探してたらあったので応募してみました。今年は開発者コンソールでapplyIntern()を実行すると応募用のリンクが表示されるような感じだったと思います。
面談
6月の初旬の面談では、自己紹介用のスライドやWebページを画面共有しながら進めていきました。最初に趣味のVRやWeb開発について軽く話して、研究、Webバイト、これまで作った物、みたいな順番で紹介したと思います。そのあとは、面接担当の方が気になった点を深掘りして話していくという流れでした。研究と趣味のVRに関することばかり話題にしていただいたのでとても楽しい面談だったのですが、Webの話をあんまりしてなくて、ほんとに大丈夫か？みたいな気持ちでした。1時間程で面談が終了し、その3時間後くらいにインターン内定の連絡がきて早すぎて驚きました。
準備
リモートインターンということで、事前準備に色々な工夫がされていました。インターン中の円滑なコミュニケーションのために、nonpiやzoomを利用した事前交流会だったり、はてなTシャツ配布だったり、プロダクトコードを扱うための開発PCの貸し出しだったり、開発についてこれるように事前課題を設定していたりと色々ありました。
scrapboxに自己紹介を書いたり、はてなリモートインターンシップ2021事前課題をやったりして、インターンに備えました。
講義
はてなのインターンは3週間で、初めの1週間はWebに関する講義パート、残りの2週間はプロダクトコードに触れる開発パートという流れでした。 講義パートでは、WebAPIやインフラ、コンテナ、Kubernetes、マイクロサービス、RDBMS、フロントエンド、企画、AWS講義、ブログシステム演習、Perlブートキャンプがあり、どれもレベルが高い&後半の開発に役立つ講義が多くとてもためになりました。
ブログシステムの演習とAWS講義は、今までの講義のまとめ的な位置付けでした。account,blog,renderer,dbなどのpodをminikubeで管理し、アカウントサービス、レンダラーサービス、ブログサービスがgRPCでやりとりするといったアプリケーションを触ることができました。演習では、記法レンダラーが未実装だったので、TypeScriptでmarkdownパーサーとしてunifiedを導入したり、テスト書いたりして、課題を終わらせました。nodeやらyarnのバージョンが違ったり、最新のunifiedをサクッと導入できなかったりして、つまづいてしまったんですが、メンターの id:YaaMaa さんや 同じインターン生の id:KarakasaDcFd さんに助けてもらいながら進めていきました。 最後に、このブログシステムをハンズオン形式でAWSにデプロイし、前半の講義パートは終了しました。
あと、リモートで講義で受けるのって結構疲れます。疲れの原因の一つにノートPCのディスプレイを見続けることというのがあると思うので、大きめのディスプレイや外部Webカメラなどを用意することをお勧めします。
開発
開発パートでは、id:ci7lusさんとともに漫画チームに配属され、新機能の企画から実際のプロダクトコードに触れ新機能を実装、リリースまでを体験しました。開発を進めるにあたって、分からないところはすぐにエンジニアメンターの id:mizdra さん漫画エンジニアの皆さん、仕様面については プランナーの id:byorori さん、デザイン面に関しては、id:tymikii さんに slackやdiscord,meet,scrapboxで相談できる環境で、コミニケーション面でも非常に進めやすかったです。
今回のインターンでは、GigaViewerに新機能を実装したのですが、新機能を紹介する前にGigaViewerについて紹介したいと思います。
GigaViewer
漫画チームではGigaという漫画ビュワーを開発し、様々なメディアに提供しています。おそらく、Webで漫画を見る多くの方が目にするビュワーではないでしょうか。
こんな感じで漫画が読めるめちゃくちゃ見やすいビュワーです。 comic-trail.com
さらに、Viewerの下の方で作品（応援）コメントが投稿できるようになっています。
開発面では、Gigaのバックエンドはクリーンアーキテクチャ（丸いドーナツ）っぽい薄めのフレームワークでできており、新しい機能を追加する際にどこを触れば良いかが分かりやすく実装しやすかったです。
漫画チームではファンレター機能とエピソードコメント機能の二つの新機能をリリースしました。二つについて紹介していきます。
ファンレター機能
これまでのGigaViewerでは、読者が漫画家さんに感想を届ける明確な方法はなかったのですが、個人的に熱いメッセージを送りたいというニーズはがあり、編集部側では送られたファンレターを管理したりフィルタリングしたりしたいという要望がありました。
そこで開発したのがファンレター機能です。ファンレターボタンを押すと、Google Formが開いて、届いたファンレターは編集部で確認できるという仕組みになっています。
こんな感じになりました。
インターン期間中に、コミックトレイルさんとくらげバンチさんでリリースすることができました。
編集部からのリリース記事になります。 comic-trail.com
次にエピソード機能についてです。
エピソードコメント機能
Gigaの読者は基本的にはエピソード単位で漫画を読みます。読んだ後に感想を送りたいと思うこともあるでしょう。これまでのGigaでは作品に対してコメントすることができても、エピソード単位でコメントすることができませんでした。この結果何が起こるかというと、最新話を読んでいない人が、作品コメントを見てしまうとネタバレをくらってしまうという問題があります。これを解決するためにエピソード毎にコメントを投稿できる機能を追加しました。また、エピソード毎にコメントすることで、より深いコメントをしやすくなるという効果も期待できます。
こんな感じになりました！
今回、インターン期間中に、ゼノン編集部さんでリリースすることができました。
編集部からのリリース記事になります。 kuragebunch.com
終わってみて
漫画チームの新機能開発では、たくさんの登場人物が現れます。エンジニアはもちろんのこと、デザイナーや、編集部、漫画家、メディア編集部と漫画チームのやりとりを調整するプランナーなどです。それぞれの立場にそれぞれの考えがあり、様々な視点で新機能案を議論し、実装可能な案に落とし込んでいきました。貴重な体験ができました。また、メンターのid:mizdra さんをはじめとした漫画エンジニアの方々に実装方針の相談やコードレビューを通した手厚いサポートにとても感謝しています。とても楽しかったし、充実していたし、成長できた、最高な夏を過ごせました！！！
