プログラミングについてのサポートをお願いしたいと思っています

【教えてもらいたいこと】
プログラミング/フロントエンド JavaScript HTML/CSS

【利用目的】
技術的な質問・相談

【具体的な相談内容】
課題１：以下の機能を有するWeb画面を作成せよ。
１． 幅600px、高さ400pxのCanvasを画面上に表示させる。
2. Canvas内をクリックした際、クリックした点を中心に半径30pxの円を描画する。
3. 円は外枠を赤2pxで表示し、内部をピンクで塗りつぶす。
4． クリックする度に新たな円が作成され、過去に作成した円は画面を更新しない限り残るものとする。

課題２：課題１のWeb画面に以下の機能を追加せよ。
1. Canvasの上部に「作成」「選択」のラジオボタンを配置し、「作成」を初期選択状態にする。
2. 「作成」が選択されている場合は、Canvasをクリックした際に課題１と同じ動作をする
3. 「選択」が選択されている場合は、Canvas上の円をクリックした際、クリックされた円をドラッグ移動可能にする。
4. 複数の円が重なったポイントをクリックした場合は、最上部に配置した円をドラッグするものとする。
5. 円上でクリックされたポイントはドラッグ中もその円上の位置を維持するものとする。

課題３：課題２のWeb画面に以下の機能を追加せよ。
1. 「選択」が選択されている状態で、円をクリックすると選択された円に選択状態を表す矩形が表示される。
2. 矩形は円を囲む正方形で2pxの水色とする。
3. 円の複数選択は出来ない。異なる円を選択したら以前の選択はクリアされる。
4. Canvas内で円以外の箇所をクリックした場合、円の選択はクリアされる。
5. Canvas上部に「削除」ボタンを作成し、円が選択された状態で「削除」をクリックすると選択された円は削除される。

課題４：課題３のWeb画面に以下の機能を追加せよ。
1. 「元に戻す(Undo)」「やり直し(Redo)」ボタンを追加し、各々その操作が不可能なときは不活性とする。
2. Undo/Redoは無制限に行う事ができる。
3. Undo/Redoの対象は円の追加、削除、移動の前後のみとする。ドラッグ中の円の動きを再現する必要は無い。

こちらに課題を一緒に取り組んでいただきたいです。
一応、課題２の４番まで進めているのでそれ以降を教えて頂きたいですが、修正などがあればそちらもお願いします。

【希望相談スタイル】
技術的な質問・相談, ロードマップ・学習法相談

【目安予算】
15000円