PyCharm 2023.3 ヘルプ

最初の Django プロジェクトを作成して実行する

このチュートリアルでは、基本的な ToDo アプリケーションを作成する

始める前に

次の前提条件が満たされていることを確認してください。

  • PyCharm バージョン 2022.2 以降を使用しています。PyCharm をお持ちでない場合は、このページからダウンロードしてください。PyCharm をインストールするには、プラットフォームに応じて、指示に従ってください。

このチュートリアルは、次の前提で作成されています。

  • Python 3.11

  • Django 4.2.

新しいプロジェクトを作成する

  1. ファイル | 新しいプロジェクトに移動するか、ウェルカム画面新しいプロジェクトボタンをクリックします。「新しいプロジェクト」ダイアログが開きます。

    Create a Django project
  2. 新しいプロジェクトダイアログで、次の操作を行います。

    • プロジェクトタイプ Django を指定します。

    • 必要に応じて、デフォルトのプロジェクトの場所を変更します。

    • デフォルトのプロジェクト venv インタープリタータイプをそのままにしておきます。

  3. More settings 詳細設定をクリックし、アプリケーション名フィールドに todo を指定します。

  4. 作成をクリックします。

プロジェクトの構造を探る

新しく作成されたプロジェクトには、Django 固有のファイルとディレクトリが含まれています。

プロジェクトの構造はプロジェクトツールウィンドウ (Alt+1) に表示されます。

Django project structure
  • myDjangoProject ディレクトリは、プロジェクトのコンテナーです。太字で表記しています。

  • ネストされたディレクトリ myDjangoProject は、プロジェクトの実際の Python パッケージです。

  • myDjangoProject/__init__.py : この空のファイルは Python に、このディレクトリを Python パッケージとみなすべきであることを伝えます。

  • myDjangoProject/settings.py : このファイルには、Django プロジェクトの構成(英語)が含まれています。

  • myDjangoProject/urls.py : このファイルには Django プロジェクトの URL 宣言(英語)が含まれています。

  • myDjangoProject/wsgi.py : このファイルは、プロジェクトにサービスを提供するための WSGI 互換 Web サーバーのエントリポイントを定義します。詳細については、WSGI を使用してデプロイする方法(英語)を参照してください。

  • templates ディレクトリは今では空です。Django テンプレートが含まれます。

  • ネストされたディレクトリ todo には、Django アプリケーションの開発に必要なすべてのファイルが含まれています。

    • 繰り返しますが、todo/_init_.py は、このディレクトリを Python パッケージと見なす必要があることを Python に通知します。

    • todo/models.py : このファイルでは、アプリケーションのモデルを作成します。

    • todo/views.py : このファイルでは、ビューを作成します

  • ネストされたディレクトリ migrations には、現在はパッケージファイル _init_.py のみが含まれていますが、将来、モデルに加えた変更(フィールドの追加、モデルの削除など)をデータベーススキーマに伝達するために使用されます。移行の説明はここを参照してください(英語)

  • manage.py は、Django プロジェクトと対話できるようにするコマンドラインユーティリティです。詳細については、Django のドキュメント(英語)を参照してください。

Django サーバーの起動

Django サーバーの実行 / デバッグ構成は自動的に作成されます。必要に応じて、メインツールバーの実行 / デバッグ構成リストで実行構成の編集コマンドを選択して編集できます。

Edit configurations

例: 構成の起動時にブラウザーウィンドウを自動的に開くように選択できます。

Run/Debug configuration for a Django server

をクリックして、myDjangoProject 構成を実行します。ブラウザーウィンドウが自動的に開かない場合は、実行ツールウィンドウのリンクをクリックします。

次のページが開きます。

Django server test page

モデルの作成

Django モデルは、データのフィールドと動作を定義します。これらは、django.db.models.Model クラスのサブクラスである Python クラスによって表されます。

ToDo アプリの ToDoItem モデルを作成しましょう。これを行うには、todo/models.py を開き、次のコードを入力します。

from django.db import models from django.utils import timezone class ToDoItem(models.Model): text = models.CharField(max_length=100) due_date = models.DateField(default=timezone.now)

モデルには、フィールドクラスのインスタンスによって表される 2 つのクラス変数があります。

  • text : CharField クラスのインスタンス。これを使用して、実行すべき内容の記述を保存します。

  • due_date : DateField クラスのインスタンスなので、To-Do の期限を保存するために使用します。

モデルフィールドの詳細については、Django のドキュメント(英語)を参照してください。

移行の実行

デフォルトでは、PyCharm は Django プロジェクトの SQLite データベースを自動的に作成します。todo アプリケーションと ToDoItem モデル用のテーブルをデータベースに作成する必要があります。Django では、これは移行を使用して行われます。移行は人間が編集可能なファイルであり、データモデルへの変更が保存されます。

  1. 以下のいずれか 1 つを実行します:

    • メインメニューでツール | manage.py タスクの実行に移動します

    • ボタン Ctrl+Alt+R

    • ターミナル (Alt+F12) を開き、ターミナルツールウィンドウのツールバーで 新規定義済みセッションをクリックし、manage.py を選択します。

    Opening manage.py in the terminal

    manage.py ユーティリティはターミナルタブで起動します。

  2. makemigrations に続けて Enter と入力します。

    コンソール出力に Process finished with exit code 0 が表示されるはずです。todo/migrations ディレクトリには、移行ファイル 0001_initial.py が含まれています。

    New Django migration
  3. migrate と入力して Enter を押し、変更を適用し、2 つの新しいモデル用のテーブルをデータベースに作成します。

    The 'migrate' command output in console

ビューの作成

Django ビューは、Web 要求の処理方法とどの Web 応答が返されるかを指定する関数またはクラスです。慣例により、ビューは <app_dir>/views.py で定義されます。ここで、<アプリのディレクトリ> は Django アプリケーションディレクトリです。

todo/views.py を開き、次のコードを入力します。

from django.views.generic import ListView from .models import ToDoItem class AllToDos(ListView): model = ToDoItem template_name = "todo/index.html"

ここでは、Django ListView 基本ビュークラスを継承する AllToDos クラスを定義しました。このビューを使用して、利用可能なすべての To-Do を表示します。

テンプレートの作成

Django テンプレートは基本的に、Django テンプレート言語(英語)の要素を含む HTML ファイルです。テンプレートは、ビューによって提供されるコンテキストに従って HTML ページを生成するために使用されます。

views.pytodo/index.html が未解決の参照としてハイライトされていることがわかります。

Unresolved reference to a Django templates

PyCharm はクイックフィックスを提案します: index.html の上にマウスを置くか、Alt+Enter を押すと、対応するテンプレートファイルを templates フォルダーに作成することを選択できます。

Quick-fix for Django a template

PyCharm は、このテンプレートが存在するディレクトリ todo も作成します。この操作を確認します。

Confirmation of directory creation

PyCharm は todo/index.html を作成して開きます。基本的な HTML コードを入力するには、「 html:5 」と入力し、続いて「Tab 」と入力します。

Using the html live template

Django テンプレート言語要素を含むコンテンツをテンプレートに追加してみましょう。次のコードを body タグの間に貼り付けます。

<h1>Things to do:</h1> <table> {% for item in object_list %} <tr> <td>{{ item.text }}</td> <td>{{ item.due_date }}</td> </tr> {% endfor %} </table>

h1 の見出しと表があります。for サイクルを使用して、AllToDos ビューから渡される object_list の項目を反復処理しています。Django は項目ごとに、text および due_date の値を含む行をテーブルにレンダリングします。

URL の設定

次に、ブラウザーで AllToDos ビューにアクセスする方法を設定する必要があります。

  1. todo ディレクトリにファイル urls.py を作成し、次のコードを入力します。

    from django.urls import path from . import views urlpatterns = [ path("", views.AllToDos.as_view(), name="index") ]
  2. 次に、ファイル myDjangoProject/urls.py (PyCharm によってすでに作成されています) を開き、todo/urls.py からのパスが含まれるように構成します。最終的には次のコードが完成するはずです。

    from django.contrib import admin from django.urls import path, include urlpatterns = [ path("todo/", include("todo.urls")), path("admin/", admin.site.urls), ]

    django.urls.include をインポートすることを忘れないでください !

  3. ブラウザーで http://127.0.0.1:8000/todo/(英語) ページを開きます。次のテキストが表示されます。

    To-do application index page

見出しはありますが、To Do はまだありません。Django 管理インターフェースを使用してタスクを追加してみましょう。

Django 管理者の使用

管理サイトでは、コンテンツの追加、編集、その他の管理が可能です。デフォルトでは、PyCharm は新しい Django プロジェクトの Django 管理インターフェースを自動的に有効にします。

管理サイトのセットアップ

  1. まず、スーパーユーザーを作成する必要があります。これを行うには、manage.py コンソール (Ctrl+Alt+R) で createsuperuser と入力し、メールアドレスとパスワードを指定します。

  2. Django サーバーの /admin/ に移動します (例: http://127.0.0.1:8000/admin/(英語))。次のログインページが表示されます。

    Django admin site login page

ログインすると管理ページが表示されます。認証と認可 (グループとユーザー) セクションはありますが、ToDo を追加する方法はありません。これを行うには、管理インターフェースで ToDoItem モデルを登録する必要があります。

コンテンツの追加

  1. ファイル todo/admin.py を開き、次のコードを入力します。

    from django.contrib import admin from .models import ToDoItem admin.site.register(ToDoItem)
  2. ブラウザーでページをリフレッシュします。アイテムを実行するにはを含む TODO セクションが表示されます。

    Django admin site with todo section
  3. 追加をクリックして To-Do を作成します。

    Adding a to-do in Django admin site

    準備ができたら、SAVE をクリックします。

新しく作成された To-Do はリストに ToDoItem object (1) として表示されます。このような名前を付けると、各タスクを開いて説明を読む必要があるため、コンテンツ管理が複雑になります。

__str__() メソッドを ToDoItem モデルに追加して、この問題を修正しましょう。todo/models.py を開き、以下を追加します。

def __str__(self): return f"{self.text}: due {self.due_date}"

次のようになるはずです:

from django.db import models from django.utils import timezone class ToDoItem(models.Model): text = models.CharField(max_length=100) due_date = models.DateField(default=timezone.now) def __str__(self): return f"{self.text}: due {self.due_date}"

To Do リストには、必要な情報がすべて含まれるようになりました。

List of to-do's on the admin site

機能の提供

ToDo をいくつか追加したため、もう一度 http://127.0.0.1:8000/todo/(英語) に移動します。タスクのリストがそこにあるはずです。

Displaying the list of to-do's

今日完了する必要があるタスクのみを表示するフィルタリングはどうでしょうか ? この機能をアプリケーションに追加してみましょう。

views.py に移動し、次のコードを使用して TodayToDos クラスを追加します。

class TodayToDos(ListView): model = ToDoItem template_name = "todo/today.html" def get_queryset(self): return ToDoItem.objects.filter(due_date=date.today())

このクラスは AllToDos に非常に似ていますが、別のテンプレート (後で作成します) を使用し、get_queryset メソッドを実装して、現在 due_date である ToDoItem オブジェクトのみを返します。

date は赤い波線でハイライトされます。その上にマウスを移動し、この名前をインポートするをクリックし、datetime.date を選択して、対応するインポートステートメントをファイルの先頭に追加します。

today.html テンプレートを作成する必要があります。index.html からコピー & ペーストしてプロジェクト内にコードが重複することを避けるために、Django テンプレートの継承(英語)を使用します。

  1. プロジェクトツールウィンドウで templates を右クリックし、コンテキストメニューから新規 | HTML ファイルを選択して、myDjangoProject/templatesbase.html を作成します。

  2. コードを index.html から base.html にコピーし、<body> タグ間のすべてを次のコードに置き換えます。

    {% block content %}{% endblock %}

    myDjangoProject/templates/base.html は次のようになります。

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> {% block content %}{% endblock %} </body> </html>
  3. index.html に移動し、<h1> タグと <table> タグの内容を除くすべてを削除し、次のように Django テンプレート言語要素で囲みます。

    {% extends "base.html" %} {% block content %} <h1>Things to do:</h1> <table> {% for item in object_list %} <tr> <td>{{ item.text }}</td> <td>{{ item.due_date }}</td> </tr> {% endfor %} </table> {% endblock %}
  4. myDjangoProject/templates/todo/today.html を作成し、次のコードを入力します。

    {% extends "base.html" %} {% block content %} <h1>Things to do today:</h1> <table> {% for item in object_list %} <tr> <td>{{ item.text }}</td> </tr> {% endfor %} </table> {% endblock %}

    このページには期限が今日である To Do のみが表示されるため、ここでは期限は必要ないことに注意してください。

すべての一般的な HTML タグを含む基本テンプレート base.html を作成しました。index.htmltoday.html子テンプレートであり、共通の要素を継承しますが、特定の内容を持ちます。

また、ブラウザーで今日のタスクにアクセスする方法を設定する必要もあります。myDjangoProject/todo/urls.py に移動し、path("today/", views.TodayToDos.as_view(), name="today")urlpatterns に追加すると、次のようになります。

from django.urls import path from . import views urlpatterns = [ path("", views.AllToDos.as_view(), name="index"), path("today/", views.TodayToDos.as_view(), name="today") ]

すべてが期待どおりに機能することを確認しましょう。http://127.0.0.1:8000/admin/(英語) に移動し、期限日を今日に設定する To Do をいくつか追加します。次に、http://127.0.0.1:8000/todo/today/(英語) に移動し、新しく追加された To-Do が表示されていることを確認します。

To-do items with due day today

エクスペリエンスの向上

この段階では、To-Do アプリケーションは本来の目的を果たしています。

  • すべての To-Do のリストを表示します

  • 今日やるべきことを示す

  • Django 管理インターフェースを使用して新しいタスクを追加できるようにします

しかし、見た目もあまり良くないし、使い心地もあまり良くありません。それを直しましょう !

HTML ページの外観を改善する最も簡単な方法は、CSS を実装することです。例: シンプルな CSS(英語) を使用できます。base.html を開き、<head> タグ間の任意の場所に次の行を挿入します。

<link rel="stylesheet" href="https://cdn.simplecss.org/simple.min.css">

ブラウザーで http://127.0.0.1:8000/todo/(英語) にアクセスして、アプリケーションの新しい外観を確認します。

The application home page with CSS

基本テンプレートを使用しているため、http://127.0.0.1:8000/todo/today/(英語) の外観も変わります。

The application home page with CSS

次に、ブラウザーのアドレスバーにアドレスを入力する必要がないように、いくつかのナビゲーション要素を追加しましょう。base.html で、開始 <body> タグの後に次のコードを貼り付けます。

<div> <a class="button" href='{% url "index" %}'>All tasks</a> <a class="button" href='{% url "today" %}'>Today</a> </div>

結果は次のとおりです。

py_django_navigation_todo.png

アプリケーションのテスト

アプリケーションのすべてのタスクページにあるいくつかの ToDo の期限が 5 月 12 日であることに気づいたかもしれません。これらのタスクは実際には期限を過ぎているため、表示する必要はありません。このような見落としは、アプリケーション開発時にテストを導入することで回避できます。

myDjangoProject/todo ディレクトリには、tests.py ファイルがあります。これは、Django テストを対象としています。To-Do が期限に応じてアプリケーションのホームページに正しく表示されるかどうかを確認するテストを作成してみましょう。

from datetime import date, timedelta from django.test import TestCase from django.urls import reverse from .models import ToDoItem def create_todo(todo_text, days): return ToDoItem.objects.create(text=todo_text, due_date=date.today() + timedelta(days=days)) class AllToDosViewTest(TestCase): def test_today(self): todo = create_todo("To be done today", 0) response = self.client.get(reverse("index")) self.assertQuerySetEqual( response.context["todoitem_list"], [todo] ) def test_last_week(self): todo = create_todo("This task is past due", -7) response = self.client.get(reverse("index")) self.assertQuerySetEqual( response.context["todoitem_list"], [] ) def test_next_week(self): todo = create_todo("Still have some time", 7) response = self.client.get(reverse("index")) self.assertQuerySetEqual( response.context["todoitem_list"], [todo] )

ここで、create_todo は To Do を作成するためのショートカット関数であり、AllToDosViewTest は 3 つのメソッド ( test_todaytest_last_weektest_next_week) を持つテストクラスです。各メソッドは、対応する期日を持つタスクを作成し、そのタスクがアプリケーションのホームページに表示されるかどうかを確認します。期限が現在の日付より 7 日前であるタスクは表示されません。

このテストを実行するには、エディターでファイル tests.py の背景を右クリックし、オプション実行を選択するか、単に Ctrl+Shift+F10 を押します。

テスト結果は、実行ツールウィンドウのテストランナータブに表示されます。

Running tests

作成した To Do が期限を過ぎているにもかかわらず、ホームページに表示される項目のリストに追加されるため、test_last_week が失敗したことがわかります。

get_queryset メソッドを AllToDos クラスに追加して、これを修正しましょう。

def get_queryset(self): return ToDoItem.objects.filter(due_date__gte=date.today())

このメソッドはオブジェクトをフィルター処理して、期限が今日の日付以降のタスクのみをビューで返すようにします (これは __gte の略です)。

実行ツールウィンドウのツールバーにある をクリックしてテストを再実行します。これで、すべてのテストが正常に成功しました。

All tests pass

要約

このチュートリアルは終了しました。単純な Django アプリケーションの作成、起動、テストが正常に完了しました。PyCharm を使用して行ったことを要約しましょう。

  • アプリケーションで Django プロジェクトを作成しました

  • Django サーバーを立ち上げました

  • 作成されたモデル、ビュー、テンプレート

  • 設定された URL

  • アプリケーションを起動しました

  • テストを作成して実行しました

関連ページ:

ウェルカム画面

PyCharm は、プロジェクトが開かれていないときにウェルカム画面を表示します。例: PyCharm を初めて実行するとき、またはプロジェクトの唯一の開いているインスタンスを閉じるとき。この画面から、新しいプロジェクトを作成したり、教育向け PyCharm でパスの学習を開始したり、インポートしたり、開いたり、バージョン管理から既存のプロジェクトをチェックアウトしたりできます。カスタマイズタブを使用して作業環境を構成し、プラグインタブを使用して IDE プラグインを管理します。学習タブを開いて、I...

プロジェクトツールウィンドウ

プロジェクトツールウィンドウでは、様々な視点からプロジェクトを見て、新しいアイテム(ディレクトリ、ファイル、クラスなど)の作成、エディターでのファイルのオープン、必要なコードフラグメントへの移動など、様々なタスクを実行することができます。このツールウィンドウのほとんどの機能には、コンテンツペインのコンテキストメニューコマンドとして、関連するショートカットを介してアクセスします。また、ビューには、作成されたスクラッチファイル、データベースコンソール、および拡張スクリプトを管理できるスクラッチとコン...

実行 / デバッグ構成: Django サーバー

このダイアログを使用して、Django サーバーの実行 / デバッグ構成を作成する構成タブ:ホストこのフィールドには、使用するホスト名を指定します。ポートこのフィールドには、サーバーが起動するポート番号を指定します。追加オプションこのフィールドでは、django-admin.py ユーティリティのオプションを指定します。詳細については、django-admin.py および manage.py のドキュメントを参照してください。ブラウザーの実行 Django アプリケーションをデフォルトのブラウザーで開...

インテンションアクション

エディターで作業するときに、PyCharm はコードを分析し、コードを最適化する方法を検索し、潜在的な問題と実際の問題を検出します。IDE がコードを変更する方法を見つけるとすぐに、現在の行の横のエディターに黄色のバルブアイコンが表示されます。このアイコンをクリックすると、現在のコンテキストで使用できるインテンションアクションを表示できます。インテンションアクションは、警告から最適化の提案まで、さまざまな状況をカバーします。インテンションの完全なリストを表示し、設定ダイアログでカスタマイズでき...

最初のプロジェクトを作成して実行する

始める前に:次の前提条件が満たされていることを確認してください。PyCharmCommunity または Professional で作業しています、Python 自体をインストールしました。macOS または Linux を使用している場合、コンピューターにはすでに Python がインストールされています。python.org から Python を取得できます。PyCharm の使用を開始するには、Python スクリプトを書いてみましょう。Python プロジェクトを作成する:ウェルカ...

テストランナータブ

テストランナータブは、テストセッションの開始時に実行ツールウィンドウで開き、同じツールバーボタンを備えています。実行ツールバーは、実行ツールウィンドウのツールバーとほとんど同じですが、テスト固有のボタンを備えています。左側のペインには、現在の実行 / デバッグ構成内のすべてのテストのツリービューが表示されます。ルートノードは、実行するように選択されたテストを表します。ネストされたノードは、テストスイートとテストケースの階層を表します。リーフノードは個々のテストを表します。各テストのステータスはア...