connet.lolipop.jp
■はじめに
「Django」は「Python」にインストールして利用するWebアプリケーションフレームワークと呼ばれ、ウェブサイトにデータベース管理システムを、簡単に構築することを主な目的と言われます。

標題のCRUDは、データベースシステムの基本的なデータ処理の、 作る(Create)、読む(Read)、最新(Update)、削除(Delete) の頭文字を表したものと言われています。

さっそく「Django」を使って、超簡易なCRUDアプリケーションを備忘録として作成してみました。
掲載内容についてはDjango初心者様向きです。

まず最初に記事掲載にあたり、「Python」と「Django」のインストールは済でいるものとし、インストール先のディレクトリは「C:\Users\user\」でWindowsにpathも設定済として、説明させていただきます。

データベースデータの表示には「DataTables」アプリケーションを利用します。

開発環境
▾OSーWindows
▾Python 3.11.2 バージョン
▾Django 4.1.7 バージョン
■「DataTables」
「DataTables」は、HTMLのtableに検索やページ捲りなどを実装できる、jQueryライブラリと呼ばれています。

▾DataTables
DataTables | Table plug-in for jQuery


▾ライブラリ
CDN経由で利用することにします。

<head>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4-4.1.1/jq-3.3.1/dt-1.10.18/sl-1.2.6/datatables.min.css"/>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/v/bs4-4.1.1/jq-3.3.1/dt-1.10.18/sl-1.2.6/datatables.min.js"></script></span>
</head>

      
▾JSコード
HTMLのtableにライブラリを実装するコードです。

オプションには、表示するレコード数を指定するプルダウンメニユーと、ページ位置の状態の保存を、設定してます。

HTMLのbody終了タグの直前あたりに書き込んでください。

id名はtableのidと合わせます。

<script type="text/javascript">
  $(document).ready( function () {	
    var table = $('#mytable').DataTable({  
      // プルダウンメニュー 
      "lengthMenu":[[5, 10, 25, 50, -1], [5, 10, 25, 50, "All"]],
      // ページの保存
      "stateSave":true
    });
  });	
</script> 


▾HTML
tableタグの記述例です。CSSはclass名を変更して自分好みにしてもかまいません。

参考:DataTables | Table plug-in for jQuery

<table id="mytable" class="table table-striped table-bordered nowrap" width="100%">
  <thead>
  	<tr>
      <th>Column 1</th>
      <th>Column 2</th>
  	</tr>
  </thead>
  <tbody>
  	<tr>
      <td>Row 1 Data 1</td>
      <td>Row 1 Data 2</td>
  	</tr>
  </tbody>
</table> 
■プロジェクトを作成する
Djangoは、プロジェクトの中にアプリケーションを作る仕組みになってます。
では最初はプロジェクトの作成から。

▾プロジェクトの名前 ー>「djangoMyLiteApp」とします。
▾作成場所 ー>任意ですが、ここでは「Python」のインストール先「C:\Users\user\」の直下に作ります。

コマンドプロンプト(Windows ターミナル)をカレントディレクトリに移動して、下記のようにコマンドを実行します。

 C:\Users\user\>django-admin startproject djangoMyLiteApp

プロジェクトフォルダが作成されます。
≫C:\Users\user\djangoMyLiteApp

次に、作成したプロジェクトの動作を確認します。

コマンドプロンプト(Windows ターミナル)から下記のように入力して、開発サーバーを実行してください。 同時にWebサーバーも自動で起動します。

この実行で、プロジェクトフォルダの中にデータベースファイルの「db.sqlite3」が自動的に生成されます。

 C:\Users\user\djangoMyLiteApp>python manage.py runserver

次に、ブラウザのアドレスバーに下記のように入力してアクセスしてください。
http://localhost:8000/

画面にロケットのアニメーションが現れ、プロジェクトの正常を確認することができます。

■アプリケーションを作成する
上記のプロジェクト作成方法と同様に、コマンドプロンプトを使って行われます。

▾アプリケーションの名前 ー> 「myliteapp」とします。

コマンドプロンプト(又は、Windows ターミナル)をカレントディレクトリに移動させ、下記のようにコマンドを実行します。

 C:\Users\user\djangoMyLiteApp>python manage.py startapp myliteapp

プロジェクトフォルダの直下にアプリケーションフォルダが作成されます。
≫C:\Users\user\djangoMyLiteApp\myliteapp

■プロジェクトのディレクトリ構造
プロジェクトフォルダの中身は、下記のようになっているかと思います。
あとで記述しますが、この中に新たに作成するフォルダ名とファイル名も追記しておきます。

■djangoMyLiteApp ープロジェクト
   └■djangoMyLiteApp ープロジェクトと同名のフォルダが生成される.
         └■__pycache__
         └__init__.py
         └asgi.py
         └settings.py
         └urls.py
         └wsgi.py
   └■myliteapp ーアプリケーション
         └■__pycache__
         └■migrations ーデータベース関連.マイグレーションファイル作成時に生成.		
         └■templates ー新たに作成.
             └■myliteapp ー新たに作成. 他のアプリケーションと重複しないように同名にします.
                 └index.html
                 └×××××.html 				  
         └__init__.py
         └admin.py
         └apps.py
         └forms.py ー新たに作成.
         └models.py ーモデルの定義を作成.
         └tests.py
         └urls.py ー新たに作成.
         └views.py	
   └db_sqlite3
   └manage.py
   └show
Search
Google


↟ このページの先頭へ