36歳がDjangoを勉強してみた(ユーザ管理機能_その2)
今回もpaizaで勉強したWebアプリケーションフレームワークのDjangoについて書きます。
paizaの有料コースになりますので、無料で公開するとその他のお金を払っている方に申し訳ないため、この記事も有料で配信しています。
【やったこと】
●ログイン・ログアウト画面作成の準備をした
今回は前回作成した続きで、ログインとログアウト画面を作成します。
この記事の通り行うと以下のようなアウトプットになります。
●ログイン画面
それではどのように作成するかコードを書いていきます。
今までの差分で設定するため、過去の設定内容は以下のマガジンを参照ください。
●今回は以下のファイルを修正します。
・layout.html 新規作成
・login.html 新規作成
・logged_out.html 新規作成
まずは、ログイン・ログアウト画面の共通テンプレートを作成します。
ランチマップの共通テンプレートで利用した、base.htmlと共通部分があるため、base.htmlファイルをコピーします。
ファイル:myapp>templates>layout.html
コード:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name='viewport' content='width=device-width, initial-scale=1, shrink-to-fit=no'>
<link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css'>
<style>body {padding-top:80px;}</style>
<title>Lunchmap</title>
</head>
<body>
<nav class='navbar navbar-expand-sm navbar-dark bg-dark fixed-top'>
<a class='navbar-brand' href='{% url "lunchmap:index" %}'>ランチマップ</a>
#ここまではbase.thmlと同じ。以下より新規コード
<ul class='navbar-nav'>
{% if user.is_authenticated %}
<li class='nav-item'>
<span class='navbar-text'>{{ user }} - </span>
</li>
<li class='nav-item'>
<a href='{% url "logout" %}' class='logout nav-link'>Logout</a>
{% else %}
<a href='{% url "login" %}' class='login nav-link'>Login</a>
{% endif %}
#ここまで
</nav>
<div class='container'>
{% block content %}
{% endblock %}
</div>
</body>
</html>
各コードの説明
<ul class='navbar-nav'>:
ナビゲーションバーを利用します。
{% if user.is_authenticated %}:
ユーザがログインしている場合に次のコードを実行します。
<li class='nav-item'><span class='navbar-text'>{{ user }} - </span>:
ナビゲーションバーの上にテキストで、「ユーザ名」を表示します。
<li class='nav-item'><a href='{% url "logout" %}' class='logout nav-link'>Logout</a>:
ログアウト用にリンクを「Logout」で表示します。
ここから先は
¥ 100
この記事が気に入ったらチップで応援してみませんか?