プロジェクト：ソートアルゴリズムのビジュアライゼーション

これがあなたの最初のソロプロジェクトになります！このプロジェクトでは、ソートアルゴリズムを実装し、ソートアルゴリズムに関するフロントエンドのビジュアライゼーションを作成して、クラス内でプレゼンテーションを行います。

このソロプロジェクトは3つのパートに分かれています：

達成目標

DOM を操作するために、標準の Web API（document にあるもの）を使用する。
- もちろん、サードパーティのパッケージを使用しても大丈夫です。
ソートアルゴリズムについて、基本的な単体テストを作成する。
ソートアルゴリズムの仕組み、実装、およびビジュアライゼーションを説明し、洗練されたインタラクティブなプレゼンテーションを（クラスメートに対して）行う。
なじみのないテクノロジーを含むリポジトリを見つける。
ビジュアライゼーションを動作させる。

このリポジトリはあなた自身のものです！始める前に、package.json と app.js からファイルの確認を行い、各ファイルのつながりをチェックしてください。

依存パッケージをインストールするには：

$ yarn

テストを実行するには：

$ yarn test

とても基本的な index.html ファイルを提供するシンプルな Express サーバー（app.js にコードが記述されています）があります。 webpack を使用して、src/ フォルダ内のすべてのコードを1つの大きなファイルにコンパイルします。

index.html を調べて、すべてのコードをコンパイルした、1つの .js ファイルを確認してください。

サーバーを起動するには：

$ yarn serve

コンパイルのプロセスを開始するには：

$ yarn dev

yarn serve と yarn dev を別々のコマンドラインウィンドウ / タブで実行する必要があります。iTerm または Terminal に 3 つのタブを用意するか、VSCode で追加のターミナルを作成することをお勧めします。

その後、ブラウザで http://localhost:4000 にアクセスすることで、フロントエンドの確認を行うことができます。

変更を行った後は、必ずブラウザウィンドウを更新してください。

ソートアルゴリズムを調査して、選びましょう。

いくつかのヒント:

コードが行うさまざまなアクション（たとえば、特定の要素の作成、非表示、値の変更など）について考えましょう。これらのアクションは、おそらく、さまざまな関数を書く上で、よいスタート地点となります。
クラスはこの場合、どのような役割を果たすことができますか？
シンプルに考えましょう。この課題に取り組める時間は、たった 2 日間しかありません。最低限の内容を実装することに集中し、改善してください。アジャイルを意識しましょう。

ビジュアライゼーションのプレゼンテーションを作成します。

スライドは以下の内容をカバーする必要があります。