ゴリにゃのブログ

徒然なるままに

VOYAGE GROUPのサマーインターン「Treasure」が最高だった話。

こんにちは、ゴリにゃです。

VOYAGE GROUPが開催するサマーインターンシップ「Treasure」が最高過ぎたので、その時の話を書いていきます

 

 

はじめに

結論から言うと、最高のインターンでした!!!!

具体的な部分は後で説明していきますが、技術的な成長は勿論のこと、サービス開発する上での考え方、チーム開発の進め方、人間的な成長など、短い期間でしたが、様々な部分で大きく成長できました!!

今後、インターンシップへの参加を検討している方はもう脳死でエントリーしちゃいましょう!絶対に後悔はしないです!

Treasureとは

「Treasure」は株式会社VOYAGE GROUPが開催するエンジニア向けのサマーインターンシップです。

今年はオンライン開催ということもあり、以下のように少し変則的な日程となっています。

  • 期間:8/1, 8/8, 8/15, 8/17~28
  • 参加人数:25人位
  • 報酬:12万円
  • 場所:オンライン

参加した経緯

とある日に、僕のツイートに対してVOYAGE GROUPの社員であり、学校のOBでもあるぺいさんから

「お、頑張ってんじゃん。面談しない?」

みたいな感じでリプが飛んできて、

はい!お願いします!」

っていう感じで、次の日に面談 → エントリーしたのがきっかけです(急展開)

面談に関しては、同じくOB兼インフラ講師でもあるしょーたさんもいらっしゃって、3人でざっくばらんに話してた気がします。

その後、オンラインでエンジニア面接2回、人事面接1回を経て無事合格を頂きました!

切っ掛けを与えて下さったぺいさんとしょーたさんにはホント感謝してます!ありがとうございます🙇‍♂️

前半の講義について

前半の講義は、事前課題を元にしたJavaScript → Go → DB → インフラ → アイデア講義の順で進んで行きました。

各講義の詳細はここでは書きませんが、内容自体は基礎プラスα的な部分が多かったと思います。ただ、とてつもないインプット量とスピード感で、毎日付いて行くのに必死でした…。色々ととても勉強になりましたが、個人的には、講師が出したお題に対して、他のTreasure生と議論をする時間がとても貴重でした(そんな環境が普段はない)

因みに、お題を抜粋すると以下のような感じです。

  • REST APIにおけるエンドポイントの設計
  • 分散処理する場合のWebSocketサーバーの構成
  • 事前課題を元にしたデータモデリング
  • etc.

後半のチーム開発について

さあ、Treasureの醍醐味と言っても過言ではないチーム開発の時間です。

チーム開発は4人1組で行いました。

チーム名決め

チーム名はメンバーが滋賀と埼玉の出身であることと、滋賀と埼玉が内陸県であることから、「サイファー滋賀埼玉a.k.a内陸」になりました。

長過ぎるので、みんなからは「サイファー」とか「内陸」とか略して呼ばれていました。(因みに、なみさんが「a.k.a」を「あか」と読んでいたのがずっと面白かった。)

イデア出し

サービス開発をする上では、アイデアがないと何も始まりません。アイデア出しについては、前半のアイデア講義で進めたフレームワークmiroを使って議論していきました。

時流によって発生した社会の揺らぎに対するソリューションを見つけ、それを元にアイデアを決定していく、というプロセスになるのですが、これが本当にしんどかった。

結局、1つ目のアイデアがポシャったりして、3日間くらい朝から晩までずっと議論した結果、「オンラインでオフィスツアーができるサービス」を開発することになりました。因みに、ポシャった話は今では笑い話です😊(ラジオ体操にしなくてよかったね🤣)

また、この辺りで議論を高い精度でスピーディーに進める方法を学びました。

↓マジむっちゃ付箋出した(miro神)

https://i.gyazo.com/3c0f579164b5ebcfe91d18a57132ee92.png

 ↓ 青春してるな〜

https://i.gyazo.com/13bf4af1ac2225be4e30817f970008a1.jpg

設計

イデアも決まったことなので、早速実装に入りたいところですが、これはチーム開発なのでそうはいきません。要件定義や画面設計、データモデリングだけでなく、タスク管理の方法やGitの運用方針など、チーム開発が円滑に進むための作業をしていきました。ここで1.5日くらいかな?この辺りをしっかり固めていたので、後々にそれが効いてきます(詳細は後述)

実装

やっとこさ実装です。因みにこの段階で発表まで残り3日とかでした😊(死)

僕の担当はメインがインフラでしたが、アプリケーション側のヘルプにも入っていました。 

フロントエンドはcreate-react-appを使って環境構築を行っていたのですが、その影響もあってCI/CDがこけるようになりました。インフラ担当としてそこの修正作業をまず始めたのですが、エラーの詳細を中々特定できず、こっすーさん(アプリケーション講師兼、自チームのサポーター)としょーたさん(インフラ講師)にもサポートして頂き、無事CI/CDを通すことができました。結構苦戦していたので、通った時は本気でガッツポーズしてました😂

原因としては、react-scriptsのログを吐き出すデフォルトの挙動と、Dockerの相性が悪くて、ECSにデプロイした際にこけていたっぽいです(ぶっちゃけよく分かってません。すみません。)

これでインフラは整ったので、あとはコードを書いていくだけや!やった!

開発手法として、僕たちはドッグフーディングなるものを行っていました。ドッグフーディングとは、簡単に言うと、システムやサービスを開発者自身が利用して、問題点や改善点を自ら発見していく開発手法 のことです(なるほどね🤔)。僕のチームは、小さく機能を作っていき、ある程度まで作った段階でチームで実際に使用してみて、改善点を発見 → 修正というサイクルを細かく回していました。

僕のチームが開発するサービスは、対象ユーザーが学生と企業(主に人事)ということもあり、自分たちだけでなく、サポーターズの関係者や、人事のなみさんやさとみんさんにもフィードバックを貰ったりと、ドッグフーディングがうまくハマっていた印象がありました。

そして、結局前日は徹夜して最終日を迎えました。僕のチームは基本8時過ぎの退社がデフォでしたが、過去には最後まで定時退社を守り切ったチームもいるらしいです。すごい…。

プレゼン

さあ、最後のフェーズです。

3日間(もなかったかも)という短い期間でしたので、全ての機能を実装することはできませんでしたが、取り敢えず満足がいくところまでは作り込むことができました。

プレゼンに関しては、「デモとして近くの公園をツアーしてくれ」とチームメンバーたちに無茶振りをされ、僕はデモ担当としてプレゼンに参加しました。

もうボケにボケまくった公園ツアーでしたが、#onairチャンネルを見る限りでは、盛り上がっててくれたようでよかった!

因みに、どのチームも一つはボケを入れてきてたの最高だった🤣

結果発表

そして結果発表です!

結果としてはDevOps賞でした!

グランプリを取れなかったのは正直無茶苦茶悔しい…。ただ、グランプリ取ったヱビスチームの作品はホント凄かったし、それ以外のチームもホント凄かった…!

DevOps賞の受賞に関しては、

  • MVPを意識した開発
  • ドッグフーディングを行い、適切なフィードバックを得ていた
  • タスク管理などを含めてmiroという1つのサービスに集約し、シンプルに運用していたこと

などが評価されたようです。チームとしてもこの辺りは拘っていたところでもあったので、この賞はシンプルに嬉しいですね!ありがとうございます!

講義や開発以外の部分

恐らく、Treasureに参加するに当たって、他のTreasure生の雰囲気やレベル感も気になってくるのではないでしょうか…?

正直、Treasure生の技術力に関してはバラバラです!界隈で有名な人もいれば、Webを殆ど触ったことがない人たちもいました。

ただ、全員に共通していたこととして、

  • なにかしら熱中した経験がある人
  • 議論ができる人
  • アウトプットをしており、それを自信を持って話せる人
  • いいやつ ← これ大事

が挙げられると思います。最後の「いいやつ」っていうのは、ガチで、本当にいいやつしかいなかった…。(俺は知らん)

今回、僕のチームのサポーターさんはこっすーさんのざさんさとみんさんでした!サポーターさんも全員が熱くて、それでいてフランクで、技術力もバチバチで、完璧超人ばかりだった印象です(ゴマスリスリ)

僕たちが間違った方向に行っている時は、今なにをしているのか?、何がしたいのか?、何をするべきなのか? を正しく助言していただきました。また、いつも遅くまで付き合っていただいて本当に感謝感激あめあられです🙇‍♂️

また、僕たちのメンタル管理もバッチリで、僕がチーム内でやった締めの挨拶が大滑りした時もサポーター陣で一瞬議論が巻き起こったそうです🤣(この話ホント好き)

僕のメンタルは鬼レベルなので安心してください🤣

また、Treasure(VOYAGE GROUP)内では全員があだ名で呼ばれることになるので、僕の新しいあだ名をみんなに考えてもらったり(みんなふざけ過ぎ)、ハピバ🎉 してもらったり、昼休みや休憩時間、Ajitingでもわちゃわちゃと会話していました😊

因みに、Ajitingっていうのは、VOYAGE GROUP内にある社内バー「AJITO」でお酒を飲みながらお話をすることです。 今回は、オンラインでしたので、Discord内で仮想的にAjitingを行っていました🍺

↓モノホンの「AJITO」

https://i.gyazo.com/0e026c7a5500e3b1a65ef9be0c7f55dc.jpg

↓「OASIS」っていうライブラリーもある。技術書だけでなく、漫画も置いてるみたい。

https://i.gyazo.com/76a55d86117618ff5124548f687ddbac.jpg

オフィスの詳細は公式ページを参考にしていただけるとよきかと👍

VOYAGE  GROUPの社内は本当にオシャンティであげぽよですね(生で見たい)

↓こんな感じでお菓子の支給品も届いてました。

https://i.gyazo.com/3d5899347c441deb4816547ed90b2d6e.jpg 

今年はオンライン開催ということもあり、少し不安なところもありましたが、その辺りのサポートもしっかりしており、始まってしまえば画面越しでも非日常的な毎日で、いつもワクワクしながら出社していました😊

まとめ

改めて振り返ってみても、Treasureは本当に最&高でした!

このブログを読んで少しでも気になった方がいたら直ぐに応募しよう!絶対に後悔しないこと、圧倒的に成長できることをお約束します👍

 

そして最後に、

サイファー滋賀埼玉a.k.a内陸」のりゅーや、あやひと、すずき、こっすーさん、のざさん、さとみんさん、そしてTreasure生・サポーター陣の方々、最高の時間を提供してくれたVOYAGE GROUPの皆さん、本当にありがとうございました!!!!! 

長い間、くそお世話になりました!!!!

 

 

https://i.gyazo.com/504b731e1c86417ec7c95d5495718e26.jpg

 

   

p.s. オフ会楽しみにしています。

 

ゴリにゃ 

CyberAgentのサマーインターン「CA Tech Challenge」で初ハッカソンしてきた話。

こんにちは!ゴリにゃです!

CyberAgent が主催するサマーインターンシップ「CA Tech Challenge」に参加してきたので、その時の話を書いていきます🏃‍♂️

CA Tech Challengeとは

「CA Tech Challenge」は、株式会社サイバーエージェントが主催する2Daysのハッカソン形式のサマーインターンシップです。

インターンの概要は以下の通りです。

  • 期間:9/26, 9/27
  • 参加人数:25人位
  • 場所:オンライン

参加した経緯

元々は1ヶ月間の就業型インターン「CA Tech Job」にエントリーしていたのですが、学校の事務的なところとの兼ね合いもあって、選考を途中でストップせざるを得なくなってしまいました…。(本当に申し訳ございません🙇‍♂️🙇‍♂️🙇‍♂️)

そんな折、面接をしてくださった人事の方に「CA Tech Challenge」の紹介をして頂き、エントリーしたという流れになります。

事前オリエンについて

インターン本番の1週間ほど前に事前オリエンがありました。

このオリエンについては、技術的なお話ではなく、

のお話が中心でした。この辺を具体的なアクションとして落とし込んでいたお陰で、インターン当日も芯を持って作業を進めることができました✌️(アクション大事)

目標について

僕は以下の4つの目標を掲げていました。

  • 技術的な挑戦(一度も触ったことがない技術を使用する)
  • UI周りを丁寧に作る(いつもは結構雑 ← 絶対ダメ)
  • レギュレーションプラスαで機能を入れる(目線は高く)
  • 2日間で実際にサービスとして稼働できる物を作る(折角だし)
結論から言うと、目標としては全部クリアできました!
ただ、実装が間に合わなかった部分などもあって無茶苦茶悔しかったのが本音です。

1日目

午前中は簡単な会社説明やメンターさんの自己紹介がありました。また、今回のお題も発表されました。

今回のお題

気になる今回のお題は「番組表」でした!

これを聞いた瞬間AbemaTVしか頭に浮かばなかった😂

技術選定

とりあえず、普段使い慣れているReactを採用しました。また、技術的な挑戦がしたかったということで、Next.jsとGitHub Actionsも取り入れました。

実はNext.jsは触ったことがなかったんですよね🤔(Gatsby.jsはある)。また、CI/CD周りに関しても、CircleCIばかりでGitHub Actionsは使ったことがありませんでした。2日間としては結構なボリュームだと思いましたが、折角の機会なので遠慮なく挑戦しました!

UI周りに関しては知見があまりなく(勉強します)、この2日間という短い期間では他サービスを参考にするのが一番いいと思ったので、ベースはAbemaTVを参考にしました。また、Googleが推奨するMaterial Designでシンプルかつ統一的なデザインを意識しました。

そして、今回はプラスαの機能として「ブックマーク機能」を作りたかったので、ユーザー認証周りにはFirebaseを使用しました。

実装

まず、Next.jsの公式ドキュメントを読んで入門しました。その後、環境構築を終えたあと、GitHub Actionsを使ってCI/CD周りの調整をしました。デプロイ先にはVercelを使っており、GitHub連携やnowコマンドを叩いてしまえば済む話なのですが、技術的な挑戦ということで、あえてGithub Actions上でビルド&デプロイの自動化を行いました。

その後、レギュレーションクリア一歩手前辺りまで実装を完了し、一日目を終えました 💤

2日目

2日目は前日の続きを行い、午前中にレギュレーションをクリアすることができました✌️(ワイワイ)。残りの時間はUI周りの調整や、新機能の追加を行いました。全員の成果発表が始まる15分位前まで粘って開発していました。そのせいもあってプレゼン資料が超雑になってしまって本当に申し訳ございませんでした🙇‍♂️🙇‍♂️🙇‍♂️

結果発表

残念なことに入賞ならず…!ムッチャ悔しい…!アベマくんグッズ欲しかった…!

また、他のインターン生の完成度は無茶苦茶高くて、シンプルに凄え!って思いました😂

入賞した方々本当におめでとうございます🎉🎉🎉🎉

開発以外の部分について

開発自体はひとりで行うのですが、インターン生同士の交流も兼ねて4人1組で作業を行っていました。チームメンバー達は僕のぼやきや悲鳴にもしっかり反応してくれて、マジで感謝しかない(ありがとね😊)

また、メンターさんには最初から最後まで無茶苦茶お世話になりました。本当にありがとうございました🙇‍♂️🙇‍♂️🙇‍♂️(もう感謝感激雨あられです)

まとめ

技術的な挑戦だけでなく、色んな気付きも得ることができ、2日間とは思えない程濃密な時間を過ごせました!

今回は初のハッカソン形式のインターンでしたが、これを機に他のハッカソンにも参加してみようと思います!

また、僕の今年のサマーインターンシップはこれで最後となります!この2カ月間様々な企業でお世話になりましたが、毎日が本当に最&高でした!僕がお世話になった企業さま、本当にありがとうございました!!!!!

そして、インターンを経て色々と課題も見つかったので、そこを修正して10月からの本選考も頑張りたいと思います💪💪💪

 

改めて、僕がこの2カ月間お世話になった企業さま、そして今回お世話になったCyberAgentさん、本当にありがとうございました!!!!!

ここからは内定まで一直線で走り抜けます🏃‍♂️💨

 

ゴリにゃ

DMM.comのサマーインターン「DMM GUILD」で1番エンジョイしちゃった話。

こんにちは!ゴリにゃです!🦍🐈

DMM.comが主催するサマーインターンシップ「DMM GUILD」に参加してきたので、その時の話を書いていきます ✏️

DMM GUILDとは

「DMM GUILD」とは、合同会社DMM.comが主催する2週間のクエスト型エンジニア向けインターンシップです。

DMM.comの各事業部が実際に抱える課題にissueという形でアサインし、解決まで導くという流れになります。

issueにはそれぞれestimateという形でポイントが割り振られており、closeまで持っていくとポイントが加算されます。そして、最終日には獲得したポイントに応じて表彰されるという感じです。

因みに、入賞者には別途賞金も渡されます💰💰💰(総額50万円ってヤバくね?)

hr.dmm-corp.com

その他の概要は以下の通りです。

  • 期間:9/7~9/18
  • 参加人数:25人位
  • 報酬:時給1,500円
  • 場所:オンライン

参加した経緯

サポーターズさんの1on1面談イベントでオファーを頂いたのがきっかけです。

その後、面接をしていただき無事合格を頂きました!

因みに、面接終了から合否連絡まではDMMさんが一番早かったです…!(流石だ✨)

初日

簡単な会社紹介やDMM GUILDの概要などが紹介されました。

また、入・退社手続きの案内や、現場で実際に使用されている各種ツールへの登録も行いました。

今回のインターン自体は個の色がとても強いインターンではあったのですが、一応チーム分けもなされており、朝会と夕会をチーム毎に毎日行っていました。

そして、issueが発表され、各自アサインするタスクを決めて初日は終わりました。

アサインしたタスク

ここからは僕が実際にアサインしたタスク毎に話していこうと思います!

Class ComponentのTS+Hooks化

僕が最初に取ったタスクはReactのClass ComponentをTS+Hooksに移行するというタスクでした。僕自体はフロントエンドが一番得意だったので、肩慣らしでアサインしました。(因みに2ポイントです)

このタスクで初めてプロダクションコードを読むことになりました。実務経験がほぼなかった僕としてはこれだけでも大きな収穫ですね☺️

タスク自体は1日で難なくクリアしました!

因みに、インターン生の中で一番早くcloseまで持っていきました✌️(まあ、2ポイントですが☺️)

スクロール位置のバグを修正

タスクの概要としては、投稿一覧画面から投稿詳細画面に遷移し、そこでブラウザバックした際にスクロール位置がズレているので、これを修正して欲しいというタスクでした。

まずは原因の調査ですね。この投稿一覧自体はIntersection Observerを使って画像の遅延読み込みを行っていました。ここが怪しいと思ってバグの再現を行ってみたところ、狙い通り画像サイズと同じサイズのズレが発生していました。

つまり、実際の画面の高さとブラウザ側が持っているヒストリー(スクロール位置)が遅延読み込みの影響でマッチしなくなっていたことが今回の原因でした。

この解決策として、遅延読み込みをする前に元画像と同じ高さの代替画像を埋め込むことで解決しました。

因みに、コードを2行追加するだけで解決したのですが、変に難しく考えちゃって実装に2日間掛かっちゃいました…。

ただ、その過程でプロダクションコードをじっくり読めたので、結果オーライですね😊

Cypressを使ったE2Eテスト環境の導入(CIで実行まで)

3つ目のタスクは、Cypressを使ったE2Eテスト環境の導入でした。

ローカルでの導入自体は半日で終了したのですが、CIで実行するところで無茶苦茶時間が掛かっちゃいました😔

因みに、CI自体は別に実装しなくてもよかったのですが、このタスクを発行していた事業部の方に「是非やらせて下さい!」と言ってCIまで実装させて頂きました。

CIにはCircleCIを使っており、Cypressを使ったE2Eテストのサンプルも一杯あったので「一瞬で終わりそうだな🤔」と思っていましたが、結局closeまで持っていくのに4日間費やしました…。(舐めてました…。すみません…。)

結果発表

結果としては、入賞ならず😭😭😭

終結果として、僕がcloseまで持っていったタスクは3つでした!ポイント自体は15ポイント位です!

グランプリを取った人は40ポイントくらい稼いでました!(ヤバイ)

賞自体はグランプリ意外にもいくつかあったのですが、僕は一つも擦りませんでした😂😂😂(ムッチャ悔しい…。)

入賞した方々本当におめでとうございます🎉🎉🎉

開発以外の部分

最初の方でも話しましたが、DMM GUILD自体は個の色がとても強いインターンです。ただ、折角の機会だし僕は積極的にチームメンバーとコミュニケーションを取っていました!

そのお陰もあってか、朝会と夕会がいつも一番長くて、毎日退社後もDiscordでわちゃわちゃと会話してました😊

ぶっちゃけ、僕のチームはダントツで仲が良かったと思います😂😂😂(うえちょ、きょーちゃん、やまちゃん、本当にありがとう😊。無茶苦茶楽しかった!!!!)

また、チーム内だけでなく、他のインターン生とも積極的にコミュニケーションを取っていました!

それ以外にも、Twitterハッシュタグを勝手に作って、それが人事に公式採用されるなど、結構好き勝手やってましたね(今思うとヤバイ)

最後に

初めてプロダクションコードを読み、新しい技術にも挑戦をさせて頂けて、本当にいい経験になりました!僕の書いたコードが実際にDMMのサービスで動いていると思うと興奮しますね!

結果的には入賞できませんでしたが、無茶苦茶楽しませて頂きました!!(多分1番エンジョイしてた😂😂😂)

改めて、この様な機会を提供して下さったDMM.comさん本当にありがとうございました!!!!

そして、入賞したみんなも本当におめでとう🎉🎉🎉

また機会があれば飲みにいこう🍻

 

ごりにゃ