Django3.2 | クラウドソーシングアプリの構築 | 13 | テンプレート - 学生向けプログラミング入門

↓↓クリックして頂けると励みになります。

【 12 | リファクタリング】 << 【ホーム】 >> 【14 | プロフィール】

「core」フォルダに「static」フォルダを新規作成します、
さらに作成した「static」フォルダに「img」フォルダを作成します。
以降、この「img」フォルダにstaticな画像を入れていきます。

「core/templates」フォルダに「customer」フォルダを新規作成します。
作成した「customer」フォルダに「base.html」ファイルを新規作成してください。

先ほど作成した「core/static/img」フォルダに何でもいいので「avatar01.jpg」ファイルを入れておいてください。

新規作成　【Desktop/crowdsource/core/templates/customer/base.html】

{% extends 'base.html' %}
{% load static %}

{% block content %}

<div class="container bg-light mt-4 pt-3 pb-3">
  <div class="row">
    <div class="col-lg-4">
      <div class="text-center">
        <img
          src="{% static 'img/avatar.png' %}"
          alt="" class="rounded-circle mb-2" width="100" height="100">
        <h4>{{ request.user.last_name }} {{ request.user.first_name }}</h4>
        <p class="text-secondary">{{ request.user.email }}</p>
      </div>

      <ul class="list-group">
        <li class="list-group-item">仕事登録</li>
        <li class="list-group-item">自分の仕事</li>
        <li class="list-group-item">プロフィール</li>
        <li class="list-group-item">支払い方法</li>
      </ul>

    </div>
    <div class="col-lg-8">
      {% block main %}

      {% endblock %}
    </div>
  </div>
</div>

{% endblock %}

「core/customer/views.py」ファイルを編集します。

記述編集　【Desktop/crowdsource/core/customer/views.py】6行目

from django.shortcuts import render, redirect
from django.contrib.auth.decorators import login_required

@login_required()
def home(request):
    return render(request, 'customer/base.html')

ブラウザを確認します。
http://127.0.0.1:8000/customer/