プログラミング独学・スクール・就職(目次)
プログラミング独学・スクール・就職(目次)
おすすめのプログラミングスクール めざせ就職・年収アップ!
おすすめのプログラミングスクール めざせ就職・年収アップ!
SEの転職活動で使うべきサイト・エージェント 目指せ年収アップ
SEの転職活動で使うべきサイト・エージェント 目指せ年収アップ
メンズクリア2年通い放題入会! その後のヒゲ状況(不定期更新)
メンズクリア2年通い放題入会! その後のヒゲ状況(不定期更新)
ブログ開始3年が経った月収が1万超えてた!
ブログ開始3年が経った月収が1万超えてた!
7年目で初の転職活動 2カ月で内定獲得した記録
7年目で初の転職活動 2カ月で内定獲得した記録
面接で評価されたプログラミング未経験者の学習方法
面接で評価されたプログラミング未経験者の学習方法
previous arrowprevious arrow
next arrownext arrow
 
Shadow
Django

Django独学 WEBページにDBのユーザ情報データを表示させる

Djangoのユーザ管理アプリ作成の目次ページはこちらです。

 

Djangoの独学を始めて、約1週間が経ちました。

勉強の理解度アップのためにも、ここでアウトプットをします。

因みに私はUdemyのDjangoの基礎をマスターして、3つのアプリを作ろう!を使って勉強をしています。

開発環境の構築(Mac、Windows両方対応)から、簡易なアプリ作成まで開設されています。

ビデオなのですが、合計19時間13分というかなりのボリュームになっています。

Django独学を開始する前の私の知識

事前にHTML、CSS、Pythonを勉強

2週間ほどかけて、HTML、CSS、Pythonの勉強をしました。

HTMLとCSSはブログ運営をしていて、何となく知識はある程度だったためです。

また、Pythonは全く無知だったので、簡単に文法は書き方を勉強しました。

JavascriptとLinuxコマンドは勉強していません。

Djangoの勉強前に調べていると、HTML、CSS、Pythonの知識があればできそうだったためです。

2週間の勉強も何かを作るのではなく、Udemyの動画をさっと見て理解した程度です。

プログラミングの勉強は暗記じゃない! 引出しを増やそう プログラミング勉強の勉強はどう勉強していけば良いか分からない人は多いはずです。 私もIT会社の中小企業に勤めていますが、最...

C#を3年ほど使っていた

C#を独学して業務でも使っていました。

そのため、クラスやメソッド、オブジェクト指向などは理解しています。

「プログラミング」に対しての知識はいろんなところで役立っていると思います。

「始めて勉強するのがDjangoです」と言う方は挫折率が高いかもしれません

作成したDjangoのページと概要

上の図のようにSQLiteのデータベースからデータを抜き出して、

ブラウザにユーザ情報を表示するプログラムです。

データを抽出して、HTMLテーブルへ表示させています。

開発環境:Windows10

データベース:SQLite(デフォルトで作成される)

ローカル環境でDjango作っただけで、アプリ公開はしていません。

まず、Djangoは構造や全体の理解が重要

Djangoの構造やアプリの動きを理解したうえでコードを書いていく必要があります。

そうしないと、何でそれをやっているか意味が分からないためです。

最初、私もUdemyの動画を見ながら手を動かしても、「動いたけど意味が分からない」という状態でした。

これでは、実力にならないので、まず何をしているかをちゃんと理解しましょう。

各ファイルの関係は以下のようになっています。

コードを書くときは流れの図を見返しながらやってみて下さい。

私も何度も自分で書いたこの図を見て、今何をしているかを理解しながらUdemyの動画を見ていました。

url.pyがプロジェクトとアプリに二つある理由は、

1つのプロジェクトに複数のアプリを入れて作れるようにするための構造だからです。

なので、アプリがAとBの二つあり、Bへのアクセスが来た場合、Bのurls.pyを呼び出すという動きになります。

ソースコードと解説

プロジェクトとアプリを作成

C直下にDjangoという名前のフォルダを作成します。

その後、以下コマンドでプロジェクトとアプリを作成します。

ここではmyprojectというプロジェクトの中に、myappというアプリを作成します。

setting.pyにアプリの登録

myprojectフォルダなのsetting.pyを以下のように編集します。

これでプロジェクトにmyappというアプリを登録、認識させます。

因みに、myapp.apps.MyappConfigは何かというと、

myappフォルダにあるapps.pyのことで、開いてみると何となく納得です。

意味を理解するには「.」を階層のように考えると分かりやすいです。

「myapp」にある「apps」の「MyappConfig」がプロジェクトに登録ということです。

ついでに、時間や言語も変えておきます。

データベースをmodel.pyから作成する

まず最初に、データベースを作成してデータを入れておきます。

コードは以下です。

やっていることは、UserInfoというクラスにテーブルの列を定義しています。

以下でテーブルを作成します。

実行後、myapp\migrationsに0001_initial.pyができます。

中にはテーブルを作成するコードが記載されています。

db.sqlite3というSQLiteのデータベースができますが、中身は空です。

migrationファイルをもとに、以下コマンドでDBにテーブルを作成します。

実行後、こんな画面が出るはずです。

そして、データベースの中身を見てみると、テーブルができています。

空っぽだったので、とりあえず5件ほど手入力でデータを入れておきました。

New Recordを押すと、追加できます。

SQLite DB.Browserからデータベースを表示させるツールをインストールしています。

SQLiteはDjangoのデフォルトのデータベースで、特に何も設定しなくてもデータベースが作成されます。

プロジェクトのurls.pyでプロジェクトとアプリの紐づけ

まず、アプリ側のurls.pyがないため、myappフォルダ内に作成します。

次にプロジェクト側のurls.pyにアプリ側のurl.pyを紐づけます。

書いた内容の意味は、usersのページ来た場合、myappのurls.pyを呼ぶという意味です。

アプリのurls.pyにviews.pyを呼びだす動作を記述

次は、アプリ側の動作を記載します。

空ファイルのはずなので、以下を丸ごと貼って良いと思います。

※この次にviews.pyの説明を記載します。

一旦views.pyのことは置いておいて、やっていることだけ理解してみて下さい。

path(”, views.showUsers, name=’showUsers’),は

users/以降のパスが空白だった場合、views.pyのshowUsersメソッドを呼ぶという意味です。

views.pyからデータを抽出して、template(ページ)に渡す

コードは以下のように書いています。

先ほどのshowUsers関数を定義しています。

usefinfo = UserInfo.objects.all()で、DBのmyapp_userinfoテーブルから全件を

変数に格納しています。

そして、context(辞書型)にデータを入れています。

その後、return render(request, ‘myapp/users.html’,context)で

users.htmlに対して、contextを渡しています。

※users.htmlはこの次で説明します。

・from .models import UserInfoについて

UserInfoクラスを使うために、importをしています。

views.pyのファイルから見て、models.pyは同じフォルダ(階層)にあるので、「.models」と言うような書き方をしています。

・contextの中身について補足です。

色んなデータを渡して表示できるか試すために、辞書に色々入れています。

msgはただの文字列です。

countは抽出したデータのレコード数です。

template(ページ)で受取ったデータを表示

templatesフォルダとusers.htmlのファイルは最初はないため、作成します。

作成場所は以下です。

C:\django\myproject\myapp\templates\myapp\users.html

HTMLにはHTMLコードでページの骨組みを作っています。

ページ受け取ったデータをPythonで記述させています。

users.htmlは以下です。

HTMLとPythonを勉強していれば、ここは何となく分かると思います。

ただ、独特な書き方があり少し個人的には違和感があります。

変数の扱い方

{{}}で囲まないと表示できません。

なので、{{msg}}と書くと、「現在の利用状況」が表示できます。

・for文の書き方

for文も{% %}で囲まないと表示できません。

:も書いてはいけません。

また、for文の終了箇所も明示的に{% endfor %}と記載する必要があります。

実行してみると

コードの記述は完了したので、ようやく実行です。

まずはサーバを起動させます。

その後、http://127.0.0.1:8000/users/にアクセスしてみると。

上手く表示されました!

因みに、http://127.0.0.1:8000/users/http://localhost:8000/users/は同じです。

Djangoは理解がとても難しい

冬休みの1週間を費やしてきた今の感想です。

私はC#、VBAなどの言語は勉強してきました。

ただ、Djangoというフレームワークは全く別物で、とても理解が難しいです。

Python、HTMLなど単体の理解はサクサクできたのですが…

完全に独学は躓きやすいと思うので、ぜひDjangoの基礎をマスターして、3つのアプリを作ろう!から勉強をしてみて下さい。

今後も作ったウェブアプリをもとに、分かりやすくなるよう発信していきます。

今回作ったアプリを修正する形で、新しい機能を付けています。

Django独学 WEBページをリンクでページ遷移させる Djangoのユーザ管理アプリ作成の目次ページはこちらです。 Djangoの独学を2020年の12月末からしていま...
ABOUT ME
LooseCarrot
LooseCarrot
ブログ運営をしているLooseCarrotです。 興味のあることにトライして発信していきます! プロフィール
関連している記事