ヒグマ

Like a Bear / Notes

👾

サイバーエージェントのフロントエンドインターン(2days)に参加しました

Other

タイトルにもある通りサイバーエージェントのフロントエンド開発型インターン(完全オンライン)に参加しました。本記事はそのまとめです。本インターンの内容と個人的反省点について、本記事を通して書いていきます。

1.目標設定・事前準備

まず、私が本インターンに参加することになった経緯についてです。きっかけは,6 月に行われたエンジニア学生向けの逆求人イベントです。そこで、サイバーエージェントの人事の方にお誘いを受け、参加が決定しました。

開発型・ハッカソン型のインターンは初めての参加でした。そのため正直不安もありましたが、インターン一週間前の事前オリエンテーションで、「自分で設定した目標を達成できることが重要」だといわれたため、気持ちを切り替え、普段開発している中で自分に足りていないと感じる点を意識して目標設定を行いました。

私が今回のインターンで以下の目標を設定しました

これらを達成するために、事前に React Hooks に関する記事を書いたり、Atomic デザインによるフォルダ構成を作成したり、といった準備を行い、本番に臨みました。

2.インターン当日

さて、いよいよインターン本番です。各チームにメンターがつき、開発で分からない部分があれば質問をするというスタイルで、開発が進んでいきました。お題はインターンの内容に触れてしまうのでここには書きませんが、「2 日で実装できるの?」と、最初聞いたときに思ってしまうようなお題でした。

2.1.作業(1 日目)

1 日目に行った作業は以下の通りです。

・connected-react-router の導入 ・redux * Typescript の導入 ・createContext/useContext による API Fetch の実装 ・デプロイ環境の構築(netlify)

17:00 くらいまで作業を行い、メンターの方からレビューをもらって一日目は終了です。

2.2.作業(2 日目)

2 日目に行った作業は以下の通りです。

・API から取得したデータの成形 ・デザインの調整 ・最終発表スライドの作成(ギリギリ!)

最後まで開発を行い、いよいよ最終発表です。

デプロイされていることが満たすべき条件の一つだったため、ほかの学生の成果物を実際に使うことができます。その時、感じたのは参加していた他の学生が期間中に作成した成果物のデザインが思った以上に凝っているということです。(ペルソナまで作っている人がいたのは本当に驚いた!)

私の成果物は、デザインについて深く考えていなかったため、かなり残念なデザインになっており、他の学生との差を感じました。

3.インターンの反省

今回のインターンでは次に挙げる反省点があると思います。

目標設定がインターンの内容に適していなかった。

redux は比較的大規模なアプリケーション向けの状態管理ツールです。そのため、今回のインターンで作成したようなサイズ感のアプリでは redux は導入せずとも、createContext  + useReducer による状態管理だけで十分だったかな、と思います。

また、他の学生の発表を聞いていると、「初めて React を使った」「フロントエンド自体今回が初めて」などかなり挑戦的な目標を設定している人がちらほらと存在しました。(それでも、成果物のクオリティが高いからスゴイ!)そのため、触ったことのないフレームワークを使うなど、より思い切った目標設定をした方がもっと楽しかったはずです。

設計・デザインフェーズにもっと時間をかけるべきであった

初めての開発型インターンで緊張していたこともあり、かなり慌てて、実装をしてしまった感があります。最終的なアウトプットをしっかりとイメージしてから、開発に臨むべきでした。

CSS in JS を事前に準備すべきであった

スタイリングには node-sass を使ったのですが、お題の特性上、動的に CSS を変化させられることが重要な要素の一つでした。そのため、「CSS in JS」を事前に準備しておくべきだったという反省があります。(styled-components,emotion…)

4.まとめ

他の学生の発表も聞け、またサイバーで働くエンジニアの方々からお話も伺えて、非常に楽しいインターンでした!今回のインターンを通して、自分に足りていないのは

といった点だと思いました。

そのため、今後は

ここら辺を意識していきたいと思います。