00:06
神経質やせ男です。今日は、javascriptでTodoリストを作ってみた話をお届けします。
これまで、Pythonで100個ほどプログラムを作ってきて、次はjavascriptで何かを作ってみようと考えました。
そこでAIに聞いたところ、初心者ならTodoリストがいいですよ、というありがちだけど納得の回答。
というわけで、まずは定番のTodoリスト作りに挑戦しました。
今回はCUIではなくあえてGUI、つまり画面で操作できる形にします。
理由は単純で、画面で動きが見える方がモチベーションが続くからです。
ただやってみてわかったのが、GUIは思った以上に大変。
チェックボックス、テキストボックス、ボタン、それぞれにメソッドやプロパティが山ほどあります。
これを一個一個覚えていくのは正直しんどいなぁと。
さらにHTMLとCSSも必要になります。
最初はボタンを作ったつもりがただの文字だったり、テキストボックスがどこにあるかわからなかったり。
そこで今回は見た目は最低限にして、入力欄と追加ボタンだけを用意。
あとはjavascriptでDOM、つまり画面の構造を操作していく方針にしました。
やっていること自体はとてもシンプルで、テキストを入力して追加ボタンを押すと下にToDoが表示される、それだけです。
でもこの中にイベントってこう動くんだとか、DOMってこうやって触るんだという学びがぎゅっと詰まっています。
特に面白かったのが、何も入力していないときは登録しないといったちょっとした工夫。
こういう細かい制御がGUIプログラムっぽさを一気に出してくれます。
まずはこのシンプルなToDoリストを土台にしてチェック機能をつけたり、削除機能を足したり、少しずつ育てていく予定です。
コードは今はまだあまり綺麗とは言えませんが、理解が進めば自然と整理できるはず。
javascript学習、まだ始まったばかりですが動くものができる。
この感覚はやっぱり楽しいですね。
以上、javascriptで初ToDoリストを作ってみた話についてまとめました。
次回は社交率99.99%、アイマスクの実力についてお話しする予定です。
ご静聴ありがとうございました。