仏発エンジニア養成機関「42 Tokyo」のCommomCore最終課題について
はじめに
この文書はComommCoreの最終課題はどんなことをするのかを示すものです。
最終課題以外の課題については仏発エンジニア養成機関「42 Tokyo」ってどんなところ?を参照ください。
先日、42のComommCoreの最終課題を終えました。
※Common Coreとは
42のカリキュラムは2部に分かれており、第1部のことを「Common Core」と呼んでいます。「Common Core」はコンピュータサイエンスに関するあらゆるトピックを幅広くカバーする内容です。CommonCoreカリキュラムは最大1年半で修了しなければなりません。
ComommCoreの最終課題より前の課題はComputer Scienceを学習するための課題です。その内容は、ささる人にはささるけど、多くの人にとっては「やってることはすごそうだけど、実務にはどうなのかな…」と感じるのではないかなあ…と思っています。
また、課題をこなしている本人達も「この課題をやってるだけで本当に就職できるのだろうか…」思っている感があります。実際、自分もそうでした。
この文書は最終課題でどんなことをするのかを示すことによって、42のCommonCoreの課題を一通りこなせば十分実務に耐えられることを示すことを目標にしています。
最終課題の概要
最終課題で作成する成果物の概要は以下の通りです。
技術的なこと
言語はTypeScriptを使用する
SPAで作る
バックエンドはNestJSを使用する
フロントエンドは自由(Next.jsを使うことが多いと思います)
データベースにはPostgreSQLを使用する
Docker Composeを使ってアプリを起動できるようにする
作るもの
2人でオンラインでPongができる
第三者がそのPongを観戦できる
対戦相手を見つけたり歓談するためにChatができる
DMを送ることもできる
BANやブロックもできる
ユーザーの状態(online / offline / game中など)を表示できる
なんらかの二段階認証ができるようにする
42のintra systemのOAuthを使ってログインする
成果物
docker-compose up --buildでゲームを立ち上げられるようにする
version: '3'
services:
app:
build:
context: .
dockerfile: Dockerfile
env_file:
- .env
ports:
- 4000:4000
- 4100:4100
depends_on:
- db
db:
image: postgres:14-alpine
env_file:
- .env
ports:
- 6432:5432Dockerfile
FROM node:19.4.0 AS build-front
RUN yarn global add react-scripts
COPY ./front /front
WORKDIR /front
RUN yarn install
RUN yarn build
FROM node:19.4.0
COPY ./server /server
WORKDIR /server
RUN yarn install
RUN yarn build
COPY --from=build-front /front/build /server/client
CMD [ "yarn", "start:prod" ]42のintra systemのOAuthを使ってログインする
42のintraにもGoogleでログインとかTwitteでログインと同じ仕組みがあります。
Google Authenticatorによる2段階認証を設定できるようにする
2段階認証を設定し、一度ログアウトしてからログインしようとすると6桁のコードを入力する必要があるようにします。
実装はAPI with NestJS #31. Two-factor authenticationそのままでいけます。ありがたいです。
アバターの設定
アバターを設定できるようにします。アップロードされた画像をBase64エンコードしてDBに保存しました。
emailによるユーザーの作成
emailでユーザーを作成できるようにします。user1とuser2というユーザーを作っておきます。
※以下は42生向けのコメントです。課題では42のintra systemのOAuthによるログインだけ作成すればOKですが、それだと自分でテストするとき1人でしかログインできないので他のログイン手段も作成して1人で複数アカウントでログインできるようにしておきます。
チャットを作る
WebSocketを使ってチャットを作ります。
チャットの管理者はユーザーをBANできるようにする
BANを解除できるようにする
チャットの管理者はユーザーをmuteできるようにする
チャットの管理者はユーザーをkick(チャンネルから追い出す)できるようにする
チャットのチャンネルにパスワードをかける
チャンネルにパスワードをかけてパスワードを入力しないと入れないようにします。
DMができるようにする
チャットの他にDMも実装します。
ユーザーがオンラインかオフラインかゲーム中かを表示する
WebSocketを使ってユーザーがオンラインかオフラインかゲーム中かを取得して表示します。
NestJSは以下のようにクライアントの接続が繋がったり切れたりをhandleConnection()、handleDisconectで検知できます。
@WebSocketGateway(4100, { namespace: "notify", cors: true })
export class NotifyGateway implements OnGatewayConnection, OnGatewayDisconnect {
@WebSocketServer() wss: Server;
handleConnection(client: Socket) {
// クライアントがオンラインになった場合の処理を書く
}
handleDisconnect(client: Socket) {
// クライアントがオフラインになった処理を書く
}
}ブラウザの更新ボタンを押さないとonline/offlineが更新されませんが、本当はここもチャットと同じでリアルタイムに反映させるべきだなあ…と思いました。ちなみにこの部分の実装は全部dnakanoさんにして頂いたので大きなことは一切言えません！
ゲームのマッチング機能を作成する
CREATE MATCHでゲームを作成することができます。誰かがJOIN MATCHすると、そのCREATE MATCHされたゲームに参加し対戦することができます。
複数ゲームが作られた場合の処理
複数のゲームが作られた場合、誰かがJOIN MATCHすると作られた複数のゲームのうち1つとマッチしてゲームが開始されます。もう1つのゲームがそのままJOIN MATCH待ちとなります。
ユーザーをお気に入り(FRIEND)に追加しておくと、FRIENDの画面からそのユーザーを指定してゲームをすることができる。
ユーザー指定でゲームを作成した場合、そのゲームに入れるのは指定されたユーザーのみです。
ゲーム中に回線が切れた場合、切れた方を負けとする
ゲームによって扱い方が異なりますが、コネクションが切れて10秒たっても回復しない場合、切れた方が負けにしました。
成果物の作成の流れ
まず最終課題の概要をもう少し詳しく書いた3ページほどの英語で書かれたpdfが与えられるのでそれを読みます。
この課題は3人から5人でこなす課題なので仲間を集めます。
これまでの課題ではCとC++しかでてきていないので、まずJavaScriptとTypeScriptを把握します。
次にNestJS、React、Nest.js等を把握します。
PostgreSQLの扱い方も知らないといけないのでER図の書き方から把握していきます。
OpenAPIを使って、フロントとバックエンドで分業できるようにします。
先生はいないので、自分たちでマニュアルを読んだり、本を読んだり、Udemyを見たり、ぐぐったり、あーだこーだ議論しながら実装していきます。
企業の採用担当者様へ
以上が42の最終課題なのですが、この課題をこなすことでインターンをへて採用されるレベルに達しているでしょうか。
おわりに
42 Tokyoは最近公式HPの内容が充実しましたが、まだまだ解像度が低いと思っています。この文書が解像度を高める助けになることを期待しております。
この記事が気に入ったらサポートをしてみませんか？