サービス

技能：エンジニア

技能：デザイナー

技能：ビジネス職

技能：バックオフィス

ジャンル

<h2 id="content0">はじめに</h2>

こんにちは。新卒エンジニアの採用・育成担当の目黒です。 
30℃越えの日々が続き、すでに体力が限界を迎えていますが、今回も明るく元気にお届けします。

早くも24新卒の奮闘記vol.4となりました。 
新卒の皆さんが前のめりで納期前に記事を提出してくれており、本当に素晴らしいです！ 
今回の担当はチームC（大山・菊谷・桐山・清水・細井）です。

<h2 id="content1">チームC奮闘記　～バックエンド研修からSOLID原則まで～</h2>

こんにちは！チームCです！

チームCからは「Yatter」という架空のアプリケーションを制作するバックエンド研修・フロントエンド研修と、SOLID原則研修を紹介します。 
Yatterとは技術研修の題材として制作するX(旧Twitter)ライクなアプリケーションです。

最初にバックエンド研修として動作に必要なAPIを開発した後に、クライアントとしてWebフロントエンド・iOSアプリ・Androidアプリをそれぞれの研修で開発していく構成です。

Yatterを制作する研修は言語やフレームワークなどの基礎を学ぶ座学と、アプリケーションを制作する実践の2つのパートに分かれており、バックエンドとフロントエンドのパートではそれぞれを7日間ずつ行います。

<h3 id="content2">バックエンド研修</h3>

バックエンド研修ではYatterを制作するためにGo言語でAPIを開発します。 
実装するAPI例は、下記の通りです。

<ul>
	<li style="line-height: 1.38;">投稿の一覧取得</li>
	<li>投稿</li>
	<li>アカウントの作成・取得</li>
	<li>フォロー・アンフォロー</li>
</ul>

Swaggerであらかじめ定義された仕様に従ってこれらのAPIを実装していき、バックエンド開発の大枠を学びます。

<img alt="" height="416" src="https://lh7-us.googleusercontent.com/docsz/AD_4nXdfEwEApkWMwkP0ftvKwnnSGtSlL_cWt6gPKP4WJnSvQYqbeEdTXDVUECgR9YSDZAWuleqYJiCz0HUAlMXco-8VByWJX-_0OTKwJGiH3y8iyqB5xxeT4LguCyJcNu2bI63zjpxXxmu2hTH3zARyg3KnHxH6?key=qWDkh-bcO3mv-84iKpZzKA" width="602" />

&nbsp;

この研修は全体で7日間のスケジュールで行なわれました。

初日はGo言語でAPIサーバを作るためのライブラリについての講義でした。

2日目にはAPIサーバを実装する具体的な手法を説明していただき、さらに講師のライブコーディングを通じて、タイムラインや認証・認可処理の実装手順を紹介していただきました。 
その後はベースとなるコードが配布され、実装を追加していく形でAPIサーバを作っていきました。

テンプレートとなるコードベースは社内での採用事例が多いアーキテクチャになっており、学生時代に扱ったことのあるアーキテクチャとは全く異なるものでした。

最初は不慣れで難しく感じられましたが、チーム内で困ったことや有用な情報をDiscordで共有したり、講師の方々が常に待機していてすぐに質問に答えてくださったことで、取り残されることなく進められました。

また、新卒のほとんどがGo言語については初心者だったため、事前に <a href="https://go-tour-jp.appspot.com/list">A Tour of Go</a> でGo言語の基本的な学習を終えた状態で研修に参加しました。

この研修はそのような初心者であっても必須課題はすべて完了させられる難易度に設定されていました。

さらに経験者向けの追加コンテンツも用意されていました。アプリケーションの基本となるAPIから、画像アップロードやユーザ間のリレーションを表現する応用的なAPIまで、Go言語未経験者にとっても実務経験者にとっても有意義な研修だったと思います。

DMMでは多くのサービスでバックエンドにGo言語が採用されているので、今回の研修内容は配属後も大いに役立ちそうです。

&nbsp;

以下は、バックエンド研修に参加したメンバーの感想です。

桐山

「7日間あったので、理解にしっかり時間をかけることができました。最初の座学でWebアプリ開発に必要な知識をメインに解説していただいたので、スムーズに演習に移ることができました。」

大山

「座学よりも実習がメインの研修で、実践的な知識を身につけやすい形式でした。丸一日コードを書いてはエラーと格闘する、という状態が6日間続きました。時間が経つのがとても早く感じられるくらい充実していたと思います。」

清水

「Go言語の細かい仕様を知ることができ、テストのことを考えて実装する必要があると感じました。要件の認識間違いに気付くためにも、テストコードを書くことは大切だと改めて思いました。」

菊谷

「必要なライブラリについて事前に座学で扱ってくれたので、演習に取り組みやすかったです。また、座学でもコードを書いて手を動かす時間があったのも取り組みやすさにつながったと思います。」

細井

「A Tour of Goでは学べなかったWeb開発の周辺知識を実践形式で体系的に学ぶことができました。また、朝会でみんなのtipsを共有することでアプリケーションの完成度が上がり、さらに認識のすり合わせもできました。」

<h3 id="content3">フロントエンド研修</h3>

フロントエンド研修では、ランディングページの作成とYatterのWebフロントエンドの実装の2つを行いました。 
&nbsp;

ランディングページ作成の目的は、Figmaで与えられたデザインカンプをCSSフレームワーク等を用いずに作成することで、HTMLとCSSを使えるようになることです。 
ランディングページはPCとモバイル2種類の端末に対応する必要があり、HTMLの構造化手法やレスポンシブに表示できるCSSの書き方などを手を動かしながら学ぶことができました。

また、CSSフレームワークに隠蔽されている処理を自前で記述する必要があったことで、フレームワークの有用性や利便性を実感しました。

加えて、フレームワークとして利用しているコンポーネントの実現方法を理解するのにも役立ちました。

&nbsp;

YatterのWebフロントエンドの実装は、Reactを含むNext.jsの理解を目的としています。

前述のバックエンド研修で実装したAPIにアクセスし、取得してきたデータを表示します。 
そのためランディングページとは異なり、スタイリングだけでなくDOMの操作やHTTPリクエストまでやる必要があります。

私たちの班ではNext.jsの理解に重きを置き、スタイリングにはChakra UIを使いました。これによりReactの機能やNext.jsの機能をより深く理解すると同時に、宣言型UIの構文やレンダリング方法の違いなども学ぶことができました。 
また、追加課題ではテストコードの作成やPage Routerでの実装をApp Routerへ移行するなど、実運用で起こりうるケースが想定されており多くの学びがありました。

&nbsp;

研修を振り返ってみると、私は言語やフレームワークの仕様を学習することに囚われすぎており、設計やテストといった実運用可能なレベルのコードを書けていませんでした。 
今後は言語の仕様をしっかりと理解した上で、実運用を意識した設計・コーディングを行なっていきたいです。

<h3 id="content4">SOLID原則研修</h3>

この研修では、変更しやすく可読性が高いコードを書くために、SOLID / CQS / DRYといったよく知られている原則を学びました。

研修の中で特に印象に残ったことは以下の三点です。

<ul>
	<li aria-level="1" style="list-style-type:disc">SOLID原則の具体例を考えて「いらすとや」で表現した
	<ul>
		<li aria-level="1">抽象的な概念を実例に落とし込むことでわかりやすく理解でき、それぞれの原則をより身近に感じることができました。</li>
	</ul>
	</li>
	<li aria-level="2">お互いのコードを共有・レビューした
	<ul>
		<li aria-level="2">チームメンバーごとに異なるコードの書き方や、SOLID原則をどのように意識しているかを比較することで、自身のコードを再評価し改善点を見つけることができました。</li>
	</ul>
	</li>
	<li aria-level="2">大喜利形式で各原則について議論した
	<ul>
		<li aria-level="2">笑いを交えながら議論することで、講義への関心が高まり、記憶に定着させることができました。</li>
	</ul>
	</li>
</ul>

また、今後の業務に向けて以下の2点を意識していこうと考えています。

<ul>
	<li aria-level="2" style="list-style-type:disc">SOLID原則を意識したコードを書く
	<ul>
		<li aria-level="2">常に各原則を念頭に置き、変更しやすく可読性の高いコードを書くことを心掛ける</li>
	</ul>
	</li>
	<li aria-level="2">コードレビューを通して他者のコードから学ぶ
	<ul>
		<li aria-level="2">積極的にコードレビューに参加し、さまざまなコードの書き方に触れて自身の視野を広げる</li>
	</ul>
	</li>
</ul>

<h2>おわりに</h2>

研修と並行して、6月末に配属先が決定しました。

今年は過去最多の入社人数となったため、一筋縄ではいかなかったものの、無事に全員の配属先を決めることができました。 
現在は配属先との顔合わせが始まり、8月1日の配属に向けて徐々に動き出しています。

また人事として配属のミスマッチを防ぐため、各部署との調整はもちろん、新卒全員と面談を実施しました。 
希望を聞くだけではなく「将来どうなりたいか？」「性格的には●●だから～」というように、ひとりひとりと話しながら調整を進めました。

改めて新卒がいま感じている研修・配属への想いや、配属後のビジョンを聞くことができ、個人的にもとても良い刺激をもらいました。 
学生さんや外部の方により解像度の高い話ができるよう、こういう話を聞くなどして常にアンテナを張っておきたいですね。

配属先で新卒の皆さんが活躍されるのが今からとても楽しみです。

新卒の声をお届けしているこの記事も折り返しです。 
次はAndroid・iOS研修の記事をUP予定です！

&nbsp;

24新卒技術研修奮闘記vol.4 　～バックエンド研修からSOLID原則まで～

シェア

関連する記事

24新卒技術研修奮闘記vol.4 ～バックエンド研修からSOLID原則まで～

シェア

関連する記事

24新卒技術研修奮闘記vol.4 　～バックエンド研修からSOLID原則まで～