NaaN日記

やったこと、覚えたことを発信する場

はてなサマーインターン2020に自宅から参加しました!!

はじめに

はてなサマーインターン2020に参加しました。
タイトルの通り、オンラインだったので家インターンです。

オンラインインターンでは、PCなどの環境は自分で用意する必要がありました。
Ubuntu 20.04/CPU 3.60 GHz 8コア Intel Corei7 9700K/メモリ 32GBで参加しました。

参加まで

はてなインターンとの出会い

はてなインターンの存在は、2年前の先輩(id:guni1192)の参加報告で知りました!!
guni1192.hatenablog.com
developer.hatenastaff.com
id:guni1192は、大規模システム開発コースに参加していて、私がやっていることとは分野が違うのですが、当時からはてなはいいぞという布教を受けていました。

そして、今年度自分は学部3年生で、id:guni1192が参加した時と同じ年齢になり、今年は応募するぞーー!!と応募しました。
はてなという会社については、うごメモはてなから始まりはてなダイアリーはてなブログはてなブックマークなど、いつもお世話になっています。
ちなみにブログははてな記法で書く派です。

選考

課題は、dockerコマンドを実行し、表示される問題に回答する、というものでした。

$ docker run --rm -it hatena/apply-for-internship-2020:latest

https://github.com/hatena/apply-for-internship-2020

質問に回答すると、トークンが発行され、そのトークンを応募フォームにペーストすれば、課題達成です!

この後の面接で、id:cockscomb さんとお話したのですが、この課題にはやさしさが詰め込まれていました。面接はGoogle Meetを使ってオンラインでしました。

選考について、詳しくはこちら↓
hatenacorp.jp

事前課題

事前課題は、hatena/Hatena-Intern-2020-Templateのテンプレートリポジトリを基にして、プライベートリポジトリの作成、およびREADMEを参考に環境構築を行うというものでした。
環境構築にとても時間がかかるということはなく、負担はなかったです。

事前交流会

インターン生と、はてなの方で、事前交流会を行いました。
Zoomでid:onishiさんから歓迎の言葉を頂いたり、三つのグループに分かれてテーマに沿った話をしました。
社員の方や他のインターン生と気楽に話すことができ、とても楽しかったです!!
飲み物については、お酒を家で一人で飲む習慣がなく、水を飲んでました。酒を準備している方もいて、酒を飲んでも良かったかなと思いました。社員の方は大体の方が酒を用意していた印象があります(違ったらすみません)。
ちなみに水はすごくおいしいので好きです。
最後には、id:motemenさんから激励の言葉を頂きました。

はてなサマーインターン2020開始!!

コミュニケーションについて

はじめに、インターン期間中のコミュニケーションについて説明しておきます。
メインで使用したツールはDiscordとScrapboxです。講義や交流会ではZoomを使いました。
事前課題やインターン参加中に質問などあればDiscordのチャットで質問をしました。業務連絡や雑談など、連絡はDiscordで行っていました(重要な連絡など一部の連絡は一部メールで)。
ちなみに事前交流会でポケモンGoが好きだという話をしたら、Discordにpokemongoチャンネルができてました。
初日の講義はZoomを用いて行い、二日目以降はDiscordのボイスチャンネルにミュートでイン、会話する時にミュート解除という感じでした。
マイクは、bluetoothイヤホンを使っていたのですが、充電の残量が時々気になりました。結果としては、ミュート中や休憩中に充電をしていたので、充電が切れることはなかったです。
また、常にカメラオンではないという状態は、とても楽でした。
課題に取り組む際は、メンター一人とメンティー二人のグループに分かれて活動するのですが、私のグループでは、質問やミーティングの際は、カメラをオンにしていました。

また、Discordと併用してScrapbox(https://scrapbox.io/)に定期的に手動で作業ログを吐くことで交流しました。
この記事も、Scrapboxのログを参考に書きました。記録残しておいてよかった……!!

作業ログ
作業ログ

1日目

講義

初日は講義デーでした。
講義動画は、後々公開されるらしいです。
hatenacorp.jp
↑ こちらのページや、Twitterの@hatenatech、「Hatena Developer Blog」で新着情報を待ちましょう。

45分の講義が講義1から講義5までありました。

  1. Web API
  2. コンテナ
  3. Kubernetes
  4. マイクロサービス
  5. 課題説明

どの回もとても面白い内容でした。
コンテナの回では、Docker Quizがあり、とても面白かったです。
Q6までは解答できたのですが、Q7は解答できませんでした。
後でじっくり解説を見返したいと思います。

Kubernetesの回では、オートスケールの設定などを行いました。
Apache Benchを使って負荷テストを行いました。

$ kubectl autoscale deployment blog --cpu-percent=50 --min=1 --max=10

目標となるPod全体の平均CPU使用率を50%、オートスケールする際のPod数の下限を1、上限を10としていました。
以下の画像のように、大量にリクエストを投げたところ、Pod数の増加を確認できました。
Podが増えたとき、「増えたーー!!」となりましたね。嬉しい😆

f:id:CNaan:20200829210658p:plain
オートスケールの様子

残念ながら、スケールインの様子は確認できませんでした。
もっとたくさんリクエストを投げて、Podを増やしてみるべきだったかなと思っています。

課題

課題説明では、課題内容に加え、テストを書くこと、コミットの粒度を意識することの説明を受けました。
課題は、

  • ブログ記事に記法を実装すること
  • タイトルの自動取得サービスを作成すること

加えて、発展課題がありました。

記法というのは、見出し記法やリンク記法、リスト記法といったもののことです。
タイトルの自動取得サービスについては、ブログに以下のような記法で入力されたとき、

[](https://hatenablog.com) # リンク記法で、[]内のタイトルが省略されている

https://hatenablog.comのページからタイトルを取得し、
[はてなブログ](https://hatenablog.com)となるようにするというものです。

課題開始

講義が終わって17時くらいからは、メンターが一人、メンティーが二人のグループで活動しました。
2日目から4日目は、主にこのグループで活動することになります。
メンターは id:yigarashi さんでした。
id:cordx56 さんと一緒にyigarashi部屋での活動を始めました。
id:cordx56さんはTweet generatorでバズった人です。インターン3日目くらいに知りました。すごい。

歓迎会

夜は歓迎会で、自己紹介をしたりわいわい夕飯を食べました。
id:namachan10777にカレー屋の紹介をされました。今度食べに行こうと思います。

2日目

この日は、見出し記法、リンク記法、リスト記法の実装を行いました。
Go言語を使って実装しました。推奨されていた、goldmarkというMarkdownライブラリを使用しました。何らかのMarkdownライブラリを利用している人がほとんどでしたが、id:cha-shu00さんはパーサモジュールを自作していました。すごい……。記事の最後に他のインターン生の記事を載せているので、気になる方はid:cha-shu00さんの記事を読みましょう。

ちなみにこの日、見出し記法で'##'>'###'>'#'の順にフォントサイズが大きいという問題にぶつかりました。

f:id:CNaan:20200829221256p:plain
見出し記法のフォントサイズ

原因っぽいものは調べると出てきたのですが、h1タグの仕様っぽいです。
h1タグ、articleやsectionでネストされるとフォントサイズが小さくなるらしいです。知らなかった……。
この時、articleやsectionで結構ネストされていたので、h1がh5くらいのサイズになっていたのかなと思いました。
https://stackoverflow.com/questions/6851833/h1-is-smaller-than-h2-in-firefox-and-chrome

3日目

2日目で記法を実装したのですが、これに加えて、独自記法というものを実装していきます。
この日の午前中は、独自記法の途中に改行を入れるとInternal Server Errorとなる問題に取り組んでいました。id:yigarashiさんに手伝っていただきました。比較的直ぐに、Go言語のプログラムで、範囲外参照をしていることがわかりました。
goldmarkのモジュールの拡張方法など、理解するのに時間がかかってしまっていたので、その辺りを理解する力を、もっとつけていきたいなあと思いました。

ランチタイム

ランチ時間(13:00 ~ 14:00)は、Discordのランチルームでわいわいして良いという雰囲気でした。
この日は、id:chris4403さんやid:onishiさんがいらっしゃり、楽しく雑談をしながら食事をしました。
例えば、好きな映画の話をしました。
魔女の宅急便」のどんなシーンが好き?といった話をしました。ちなみにid:cordx56さんは魔女の宅急便が好きです。
私は、昔見たとき、「キキが飛べなくなった」ことが悲しかったという話をしました。昔はデッキブラシの見た目がかっこよくないと思っていたんですね。
社員の方は、「お父さんがキキを見送るシーンが感動する」と言ってました😢

4日目

この日は、タイトルの自動取得をできるようにしました。
Markdown記法をHTMLに変換する作業は、renderer-goというサービスが行うのですが、URLからタイトルを取得するのは、fetcherサービスという別のサービスが行います。今回の課題では、fetcherサービスを作るところから行いました。
タイトルの自動取得は、ASTの各ノードをvisitし、タイトルが未指定の場所に、fetcherサービスで取得したタイトルを差し込むという方法で行いました。
ここで、タイトルを差し込む部分について、どのようにすればテストを書きやすい設計になるかわからず、id:yigarashiさんにテストの書きやすい設計について教わりました……。理解に時間がかかり、自分はテストやプログラムを書きなれていないと感じました。今後の目標は、テストを書き慣れることです。
また、5日目には成果発表を行うので、その資料作りをしました。

プロフィール画像の変更

突然ですがこの日の深夜にプロフィール画像を変更しました。
Amakuchiからcnaan仕様に変更しました。1日目の自己紹介で、インターン中にプロフィール画像を変更する、と言っていたので、無事有言実行できてよかったです。
自己紹介などでモンメンが好きだと、沢山アピールしていたので、モンメンを添えました。
モンメンはもふもふ感とかがとても好きです。ちなみにポケモンのゲームはホワイトを買ってました。つまりモンメンはいません。
最近ポケモンGoにもモンメンが実装されたので、みなさんモンメンと遊んでください。

cnaanのプロフィール画像
cnaanの新しいプロフィール画像

5日目

成果発表会

一人5分以内で、課題について取り組んだ内容をプレゼンテーションする、というものでした。
PCのフロントカメラが前々から調子の悪い時があったのですが、当日再起動しても途中で切れそうだったので、画面共有用のPCと、カメラ用のiPadの2台からZoomにログインさせていただきました。
私は、基本課題である、記法(見出し記法、リンク記法、リスト記法)の実装、独自記法の追加、タイトルの自動取得に取り組んだので、それを発表しました。

Scrapboxで、成果発表会会場が用意されていたので、そちらに発表へのコメントを書き込んだり、はてなスターのように、良かった!!と他の人の発表に自分のアイコン画像を沢山ぺたぺたしました。いっぱいつけるの楽しいですね、もっといっぱいつければよかった(´・ω・`)

ところで、3日目に独自記法を追加したと言ったのですが、どのような記法かは述べていませんでした。
私は、独自記法として、以下略記法を追加しました。
以下略記法は、(ryを使った記法です。
(ry(かっこあーるわい)の説明は、こちらを参考にしてください→(ryとは ウェブの人気・最新記事を集めました - はてな
恐らく、昔うごくメモ帳をやったり、ブログを書いたりしていた人は、言葉の末尾に(ryを付ける文化をご存じなのでは?と思っています。私は(ryを多用してました。

f:id:CNaan:20200829230602p:plain
以下略記法の実装

以下略記法は、detailsタグとsummaryタグを使った表記となっています。次の1文は、detailsタグを使っています。

表示されているよ省略されているよ

以下略記法について、面白いと言っていただけたので嬉しいです!

以下略記法への反応
以下略記法への反応

そういえば発表の時にあまり説明をしなかったなと思ったのですが、「(ryと省略してるけど、実は続きを書いている」という優しさを詰め込んだ表現です。

発表会終わり

発表会が終わった後は、アンケートを書いたり、面談したり、このブログを書いたり、19時から表彰式&送別会に出席したりしました。
面談では、PCのフロントカメラの調子が悪いからとiPadから参加したら、Google Meetに「他のアプリを開いているとカメラ使えません」と言う感じに怒られました。最後の最後に自分の顔を見せられなくて悲しくなりましたね……。
送別会では、初日の歓迎会同様、わいわい楽しんで話すことができました。
ところで無人島って、誰でも上陸できるんですね……。
ちなみに、この日も酒を買い忘れたので水を飲みました。水は美味しい。
主食はどん兵衛きつねうどんです。四国なので多分西です。

5日間を振り返って

はてなの人、褒めるのが上手いなと思いました。
参加前の面接では、id:okikukun さん及び id:cockscomb さんとお話したのですが、
なんでも肯定から入ってくださるという印象があり、素敵な方々だなと思いました……!!
インターンの選考をされるという経験が初めてで、「一体どんな角度から攻めてくるんだ……!?」と若干ドキドキしていたのですが、
面接では、id:okikukunさんとid:cockscombさんの暖かさに包まれました……。
インターンに参加前からとても親切だったので、なんと素敵なんだ……😇と感動しました。
結果も早く伝えていただいたので、結果をドキドキ待つ時間が少なくて心臓にやさしかったですね。

インターン参加中も、メンターのid:yigarashiさんに、「惜しいところまで行ってます!」というように、やる気を削がないアドバイスをたくさん頂いて、凄いなあと思いました……!!人と話すときは、はてなの方々の暖かさを真似していきたいと思いました。

また、お気づきの方もいらっしゃるかと思いますが、はてなブログPROになってます。
インターン参加報酬にいただきました。やったーー!!
最近ブログをあまり書いていなかったので、モチベーションがあがりますね💪

長々と書きましたが、今回のインターンで感じたことを箇条書きすると、次のような感じです。

  • はてなの方々は優しくて暖かい
  • テストをしっかり書こう
  • オンラインランチ会やその他交流会が楽しかった

落ち着いてきたら、オフィスランチを食べてみたいですね……。

他のインターン生の記事にもありましたが、これだけ学ばせていただいて3万円分のAmazonギフト券を頂けるの、すごい。
参加前は、「3万か~~へ~~」くらいに思っていたのですが、インターンが終わった今となっては、お金貰えるとかおかしいのでは????と感じてきました(そのくらい良いインターンでした)。

最後に、
はてなサマーインターン2020最高でした!!!!

その他

id:cordx56さんに広告費を貢いだ。

f:id:CNaan:20200829230313p:plain
我が家のモンメン

久々に家にあるぬいぐるみを出した。かわいい。