GMOサマーインターンに参加してきました!
【インターン体験記】GMOサマーインターン
皆さん、こんにちは!
先日、約1週間のGMOサマーインターンシップに参加してきました。
今回は、そこで得た学びや気づきを、未来の自分へのアウトプットとして残したいと思います。
本インターンでは、話題の生成AIをフル活用して開発を進めました。具体的なAIツールの活用法や、ハードな開発を乗り越えた経験など、これからインターンに参加する方や、開発でAIを使ってみたいと考えている方にとって有益な情報もあるかと思いますので、ぜひ最後までお付き合いください!
自己紹介
はじめまして!大阪のとある大学で情報学を専攻している、髙木優希です。
現在、3回生の27卒ということもあり、就活と開発を同時並行する生活を送っています。
普段はコンピュータサイエンスを学びながら、ハッカソンやインターンを通じてWebアプリケーション開発に取り組んでいます。
本格的に学生エンジニアをして、まだ半年も経っていなくまだまだ経験は浅いです。
特にバックエンドに興味があり、将来的にはバックエンドエンジニアになりたいと考えています。
開発経験のスタック
- フロントエンド: TypeScript / React Native / Next.js / Vue.js
- バックエンド: node.js/ Express / Python / Golang / Django /
- その他: Dify / GitHub Actions / Kubernetes / 流行りのLLM
最近は生成AIの活用やバックエンドの設計にも力を入れており、「作るだけ」ではなく、「その技術を使いユーザーに何が提供できるのか」を心がけています。
参加したインターンの概要
なぜGMOのインターンに参加したのか?
元々、「お名前.com」を少しだけ使用したことや人気度の高い企業ということでGMOは知っていました。
私自身、「より多くの人にインターネットを届けたい、使用しやすい環境を整えたい」という想いもあり、GMOの企業理念とマッチしていると感じインターンシップに参加しました。
インターンシップではGMOの働き方、サービス、企業理念などより深く理解することができました。
開発内容:ゼロからのサービス開発
お題は、GMOの既存サービス「ConoHa」の機能追加・改善案を考え、それをゼロから自分たちの手で開発するというものでした。
「ConoHa」は、誰でも簡単にサーバーを構築・運用できるGMOの人気サービスです。
当初はテンプレートが提供されるのかと思っていましたが、蓋を開けてみれば完全なスクラッチ開発。正直、「これはかなりハードなのでは?」と不安に思いました。
しかし、結果としてチームは開発課題を完遂し、最終的に優勝を勝ち取ることができました! 🥳
「優秀すぎるチームメンバー」と「生成AIの戦略的な活用」ということもあり最後まで実装することができました。
開発物
個人情報の観点から一部のUIだけ掲載します!
ダッシュボードの情報は全てダミーデータです
サーバー作成画面
続き
作成後のダッシュボード
easyモードとhardモードの切り替え
これで実際にサーバーを立ててゲームを行うことができます!!!
使用した技術スタック
技術選定は完全にチームに委ねるものでした。
今回はチームメンバー全員がTypeScript経験ありだったので、以下のような選定を行いました。
- フロントエンド: Next.js, TypeScript, Material UI
- バックエンド: 既存サービスのAPI, Firebase(Authentication, database)
- AIツール: Gemini CLI, Kombai, Cursor, ChatGPT, Kiro, Codex
- その他: Figma, GitHub, Canva, Gamma
開発で工夫した点・苦労した点
工夫した点
-
モダンなデザインの取り入れ
今回はゲームプレイヤーのターゲット層であったため、フォントやUIをゲームに意識し、既存サービスのUIが一部レガシーな部分が残っていたので、モダンなデザインを意識しました。
また、初めて使う人でも迷わず操作できるよう、ボタン配置や導線をシンプルに統一。 -
チーム開発であえてリーダーを決めなかった
チーム開発では、タスクの割り振りや方針決めするリーダー的な方がいるかと思いますが、今回の開発では皆んなが思ったことを発言し、意見を出し合いシステムを決める、またタスクも手の空いた人が積極的に解消していくことをチームで意識しました。
どうしてもチーム開発をしていると、発言回数が少ない人や提案しにくいなど生まれることもあるかと思いこのような意識を行いました。 -
UX向上への取り組み
- サーバーに慣れているユーザーもいれば、初めてサーバーを立てるユーザーもいます。
そこで、両者がスムーズに利用できるよう、「easyモード」と「hardモード」を実装しました。
「easyモード」では最低限の設定で素早くサーバーを構築でき、
「hardモード」では細かなカスタマイズが可能になるよう設計し、幅広いユーザー層に対応しました。 - リロード時の待機時間の表示
- SSR・CSRによるページ遷移速度の向上
- サーバー作成までのチュートリアル表示
などなど、、、
- サーバーに慣れているユーザーもいれば、初めてサーバーを立てるユーザーもいます。
苦労した点
-
API使用によるサーバー作成・情報取得からの条件分岐
サーバー構築のAPIということもあり、APIの実装は大変でした。
サーバー台数やその他の要因もあり、上手く立てれないなども、、、 -
AIの利活用
AIを導入することで効率は上がりましたが、生成コードの適用範囲の判断には時間がかかりました。 -
エラー対処
様々なエラーがありましたが、特に対処が大変だったのは、あらゆる箇所でAPIが無限にFetchされていたことでした。
それまでの開発ではそのようなことはなかったのですが、8割ほどの完成度で発生しました。
過去のブランチに遡る、AIに聞く、構文など確認のようなアプローチをとり分かったのがuseEffectでした。
第二引数でから配列がなく、レンダリング時にfetchして欲しいのに永遠にfetchされていました。それはおそらくですが、うまい感じにキャッシュが効いて、「レンダリング時にfetchされているかのように見えていた」ということではないかと。。。
このエラーも大きな学びの一つとなりました。
##イメージ##
import React, { useEffect, useState } from "react";
export default function BadInfiniteFetch() {
const [data, setData] = useState<any>(null);
// ❌ 依存配列を付け忘れている(=毎レンダー実行)
useEffect(() => {
fetch("https://jsonplaceholder.typicode.com/todos/1")
.then((res) => res.json())
.then((json) => {
setData(json); // ← state更新 → レンダー → useEffect再実行 → 無限ループ
})
.catch((e) => console.error(e));
}); // ← [] を入れてない!
return (
<div>
<h1>Bad Infinite Fetch</h1>
<pre>{JSON.stringify(data, null, 2)}</pre>
</div>
);
}
GMOの良かったところ
- パートナー(社員)の技術力の高さ
- 既存サービスの規模の大きさ
- 若手にも与えられる大きな裁量
正直、参加前に抱いていたイメージとの悪いギャップは一切ありませんでした。
むしろ、「全ての事業で本気でNo.1を目指す姿勢」や「圧倒的な技術力」を肌で感じ、いい意味でのギャップでした。
ここなら自分の強みを最大限に活かせると思いました。
また運用しているサービスの概要を解説してくださる時間もあり、サービスへの理解度も高まりました。
開発を加速させたAI活用術
今回の開発で「AIを使い倒した」と言っても過言ではありません。
特に効果的だった4つのツールをご紹介します。
1. Figmaからコードへ:Kombai
Kombaiは、Figmaで作成したUIデザインから、フロントエンドのコードを自動生成してくれる革新的なツールです。
UIデザインをコードに落とし込む方法はいくつかあると思いますが、Kombaiの精度は圧倒的でした。
使用方法
①Kombaiをダウンロード
②Figmaで作成したデザインのURLとプロンプトを入れる
③しばらく待つと生成したファイルを確認でき、修正を加えたあと承認を押す
④UI完成!!!!
もちろん生成したUIはレイアウトがずれたり、機能しなかったりありますが、雛形を作成するには十分すぎる精度です。
今後、ハッカソンや個人開発などでも使用しようと思います!!
2. Claude codeだけではない!:Gemini CLI
最近のコーディングAIではClaudeが有名ですが、Gemini CLIも非常に優秀でした。
主な活用場面は以下です。
- バックエンドAPIとの連携コード作成
- エラー解決のヒント出し
- サイドバーなどの簡単な機能追加
使ってみた感想
-
良かったこと
- 使い方次第で他のAIツールと同等以上のパフォーマンスを発揮。
- CLIでの操作はエンジニアにとって最高。
- ディレクトリの整理、型定義、バリデーションなど優秀
- 様々な実装の雛形作成で工数削減。
-
悪かったこと
- 複雑なAPI連携の実装は不安。
- 時にプロンプトの範囲外の実装を行う、"暴走"がある。
- 0からのUI作成はイマイチ。
特に、今回のAPI仕様が複雑だったのでgeminiはうまく機能しないことが多く、自分で書くことも多かった気がします。
ただ、Calude codeが高くて課金できない人はGemini CLIでもしっかりとパフォーマンスを出すこともできると思いました!
3. 柔軟なコーディング支援:Cursor
Cursorも基本的な使い方はGemini CLIと似ていますが、より柔軟な対応が可能です。
Gemini CLIがファイルのパス指定を厳密に求めたり、"拗ねる"場合があったため、基本はCursorで実装を進め、疑問が残る部分をGemini CLIで再検証するという使い分けをしていました。
(学生なので無料で使用できている)
4. 資料作成の救世主:Gamma
最終日の発表資料作成で大活躍したのがGammaです。
「〇〇についての資料を作って」と指示するだけで、精度の高いプレゼンの雛形を生成してくれます。
ページによっては3〜4箇所修正するだけで完成するものもありました。
その分、開発に集中できたのは大きなアドバンテージでした。
5. OpenAIによるCodex
最終日に少しだけ触れた程度なのですが、OpenAIのCodexです。
まだ触り始めたばかりなので深くは語れませんが、参考程度にしてください。
良かった点
- GitHubのリポジトリをそのまま読み込めそう
- 他言語への変換
気になった点
-
チーム開発では使いずらそう
権限設定などの問題で、すぐには全員で使えなかった。 -
生成速度が遅め
使った時は生成までにかなり時間がかかった
CLIもあるので、今後はもっと積極的に試したいと思います!!
GMOインターンで得たこと
今回のインターンで得たことをまとめると以下の通りになります。
-
GMOの理解度がめちゃくちゃ高まった
-
技術力の向上
-
チーム開発の経験
-
ユーザー視点での機能設計の難しさ
-
AIの活用
AI時代にエンジニアに求められるもの
よくAI時代で必要な力で言われるのが、「ビジネスサイドの力」「AIを活用できるか」これらは間違いないと思います。
今回の経験を通じて、さらに感じたことがあります。
-
共に開発しやすいエンジニアであること
これまでは開発する時間が多く占めていたことがAIにより開発時間が大幅に減り、それ以外のタスクに割り当てる時間が多いかと思います。
その中で、設計や仕様のことでチームメンバーとこれまで以上にコミュニケーションをとることが多いかと思いますが、「やっぱり一緒に開発したいな」、「この人と開発しやすいな」というエンジニアと開発することで自分のスキルを最大限に活かすことができると思いました。
今回のインターンでもチームメンバー全員がそう思わせてくれる人だったからこそ、自分のスキルを最大限に活かすことができました。 -
実はこれまで以上のスキルが求められていること
AIが自動でコードを書いてくれる機会が多くなり、エンジニアのハードルが下がってるなどと言われることもあるかと思います。果たして本当にそうでしょうか?
AIが生成したコードはあくまで「たたき台」。
生成したコードを修正するのは結局人間なので、コードの良し悪しを判断するためにより深い言語の理解とCSの理解、どれだけ幅広い技術があり、使いこなすことができるか、ということが必要になってくるのではないでしょうか?
このようなことが求められる今、エンジニアに必要なレベルはかなり上がっていると思います。
おわりに
GMOでのインターンは、技術的な成長はもちろん、AI時代のエンジニアとしての在り方を深く考えるきっかけとなった、非常に濃密な1週間でした。
実際に参加してみて、「本当にここで働きたい」と思える企業でした。
これまで以上に学びをキャッチアップし、さらに成長していきたいと思います。
そして、この記事が誰かの挑戦の一歩を後押しするきっかけになれば嬉しいです。
Discussion