2回目の挑戦(JS版)
参加したテーマ
- フォームバリデーション機能を実装しよう
- 参加日時: 2020.09.20
作品情報
- リポジトリ: https://github.com/sayaishi/sayaishi.github.io-mkform2.git
- 提出日: 2020.09.22
- 開発期間: 2日間
コメント
再チャレンジです。
まだまだ拙いものですが、前回は動くことすらできなかったので成長を実感しました。
メールアドレス欄を『input type="email"』とすることで入力データがメールアドレスかどうかの判別が出来るようにしました。
また、GitHub Pageでのアップロードの際、最初にアクセスするhtml名を「index.html」にしてなかったため、READMEがずっと出てしまう事象が起きました。
次回からはそのようなミスがないように気をつけたいと思いました。
今回実装できなかったところ
最初に設計したときと変更し、エラー表示をアラートで出すようにしました。
それはなぜかというと、エラー時に色を変更することが実装できなかったからです。
また、当初JavaとSpringで実装しようとしましたが、tomcatが起動できなくなったためHTML,CSS,JSでの実装に切り替えました。
使用した技術
フロントエンド
- HTML
- CSS
- JavaScript
バックエンド
インフラ
- GitHub Pages
データベース
- MySQL
その他
Java,Spring
開発ログ
「フォームバリデーション機能を実装しよう」に参加。開発をスタート!
「要件を確認しよう」を完了しました!
「技術選定をしよう」を完了しました!
「ワイヤーフレームを書こう」を完了しました!
「設計しよう」を完了しました!
「リポジトリを作ろう」を完了しました!
「提出期限を決めよう」を完了しました!
・要件の確認
・設計
・リポジトリ作成
・提出期限決定
最初の挑戦からかなり時間を要してしまいましたが、再チャレンジします。
実装(エラーメッセージ)
JavaとSpringを用いて実装しようと試みるも問題が発生し、HTML,CSS,JSで実装開始。
送信ボタンを無効化から有効化することが出来ていない。
前回取り組んだ時はエラーメッセージすら出せなかったため、それよりは成長できていると前向きにとらえようと思う。
「入力されていない項目がある場合はエラーを表示する機能」を完了しました!
「「プライバシーポリシーに同意する」にチェックが入っていなければ「送信」ボタンが押せない機能」を完了しました!
「実装しよう」を完了しました!
「デプロイしよう」を完了しました!
・「プライバシーポリシーに同意する」にチェックが入っていなければ「送信」ボタンが押せない機能を実装
・デプロイ
「プライバシーポリシーに同意する」にチェックが入っていなければ「送信」ボタンが押せない機能を実装するのに四苦八苦しましたが、以下サイトを参考に実装できました。
(『JavaScript 要素を活性/非活性にするサンプル(disabled)』(https://itsakura.com/js-disabled))
GitHub Pagesにアップロードし公開したものの、反映がまだされていないので、テストは明日以降実施しようと思います。
「動作をテストしよう」を完了しました!
「作品を提出しよう」を完了しました!