BootStrapのサンプル Sign-in についてメモ

BootStropのサンプルページについてのメモです。
Sign-inは、他にも使えそう。

環境

  • Python
  • Django
  • SQlite
  • VsCode
  • OS:Windows(WSLでUbuntu)

BootStrap5

どんなページ？

シンプルなサインイン（ログイン）用のフォームです。
無駄が無くていい感じだと個人的に思います。

構造は？

  • Emailアドレス入力欄
    • 入力のヒントが初期と入力中のどちらも表示される
  • Password入力欄
    • 入力のヒントが初期と入力中のどちらも表示される
  • 保存用チェックボックス
    • ただのチェックボックスです。
  • Sign inボタン
    • ボタンです
    • submitするようになっています
  • CSSの参照先があるよ
    • ソースのコピペのみだとレイアウト崩れるので覚えておく

流用へのヒント

  • sign-in(ログイン)だけでなく、sign-up(ユーザー登録)にも使えそう。
  • Email入力欄を、username等に変更するのもあり

python(Django)で使用するために

  • template(base.html)等使い回す場合はbodyタグ内のみコピー
  • 動きをつける用のJavaScriptは削除してもOK
  • {% csrf_token %}の記述を忘れずに
    • エラーになるよ
  • 入力欄のタグに[name]を追加する
    • POSTメソッドの時に、値を参照するのに必要
  • 登録結果を表示する
    • render実行時に、{‘result’:’ユーザー登録済みです’}等引数追加
    • htmlに{{ result }}と記載すれば、メッセージが表示される
    • try〜exceptで処理の分岐をする
  • ユーザー名の2重登録は不可(デフォルトのユーザーモデル)
    • エラーになる
      IntegrityError
    • カスタムユーザーモデルの使用をDjangoは推奨している?
      今後調べて更新

コメント

タイトルとURLをコピーしました