To Doアプリを制作してみました！
初心者がTo Doアプリを制作して感じたことなどを執筆していきます。
機能
- タスクの追加・編集・削除
- チェックボックスで完了/未完了
- タスク数のリアルタイム表示（全て/完了/未完了）
つまづいたポイント
1. 変数のスコープ
-
{}の中でconstで定義した変数は外から見えない - 複数の場所で使う変数は外で
letで宣言
2. DOM操作の順番
- 要素を作ってから使う（定義前に使えない）
-
insertBeforeで指定位置に挿入
3.画面の更新
- 変数を変えても画面は自動で変わらない
-
element.innerText = 値で明示的に更新が必要
学んだこと
- DOM操作(
createElement、appendChild、insertBefore) - イベントリスナー（`addEventListener)
- 条件分岐で同じボタンに複数の役割を持たせる方法
感想
AIのサポートを受けながら制作しましたが、コピペするのではなく
一つずつ理解しながら進めることを意識しました。
その中で、小さく分けて考える重要性の大切さを考えさせられました。
一気にサポートしてくれるのですが「今はこの部分だけ」に集中することで
複雑なコードも理解することができた点はよかったです。
これから実務に入るので、今回学んだ「わからないことを一つずつ解決する姿勢」を大切にして日々の業務に取り組んでいきたいと思います。