このレッスンをはじめる前に
このレッスンを進めるには前提知識が必要です。先に以下のレッスンを完了しておきましょう。
-
#01 メモ帳アプリを作ってみよう (02:24) 無料公開中
- 完成版の確認
- 作業用フォルダの設定
- index.htmlの作成
-
#02 HTMLでマークアップしていこう (01:36) 無料公開中
- index.htmlのマークアップ
- 要素の確認
-
#03 CSSでスタイリングをしていこう (02:33) 無料公開中
- style.cssの作成
- 文字コードの指定
- mainのスタイリング
- h1のスタイリング
-
#04 テキストボックスのスタイルを整えよう (02:14)
- textareaのスタイリング
- box-sizing
-
#05 ボタンとテキストのスタイルを整えよう (01:57)
- buttonのスタイリング
- spanのスタイリング
- フレックスボックス
-
#06 フレックスボックスでレイアウトを整えよう (02:34)
- .containerのスタイリング
- margin-right
- gap
-
#07 JavaScriptの実装をはじめよう (02:46)
- main.jsの作成
- getElementById()
- addEventListener()
- alert()
-
#08 localStorageの仕組みを知ろう (02:09)
- localStorage
- キー・値
- データの保存・取得・削除
- 注意点
-
#09 ブラウザにデータを保存しよう (02:07)
- setItem()
- 開発者ツールでの確認
-
#10 保存ボタンを完成させよう (03:00)
- .appearのスタイリング
- transition
- setTimeout()
-
#11 localStorageからデータを取得しよう (02:06)
- getItem()
- テキストボックスへの表示
-
#12 localStorageからデータを削除しよう (03:00)
- removeItem()
- confirm()
-
#13 完成したアプリを振り返ろう (01:24)
- これまでのまとめ
- アプリ開発の振り返り
