【Django/VSCode】データベースのテーブルの中身を表示する

VSCodeでデータベースのテーブルの中身を表示する方法の解説ページアイキャッチ

SHARE

このページにはプロモーションが含まれています

このページでは、特に VSCode ＆ Django ＆ SQLite3 を利用されている方に向け、データベースのテーブルの中身（レコード）を簡単に表示する方法を紹介していきます。

一応 Django 利用者向けとしていますが、Django や Python に限らずとも、VSCode と SQLite3 を利用されている方であれば問題なくテーブルの中身の表示を行うことができると思います（未確認ですが…）。

VSCode でデータベースの中身を表示する際には「拡張機能」を利用します。これにより、簡単に、かつ、SQL 文の知識なしにデータベースのテーブルの中身を表示することができます。

VSCodeでテーブルの中身を確認する様子

今回紹介するのは下記の２つの拡張機能になります。どちらか一方をお好みでインストールしておけば良いと思います。

どちらも簡単にデータベースのテーブルの中身の表示を行うことができますが、より簡単に表示できるのは前者の SQLite Viewer だと思います。SQLite は、ちょっとだけ表示するのに手間がかかりますが、テーブルの操作も行いたいような場合に便利です。

データベースを利用しているけどテーブルの中身の表示の仕方が分からない方や、わざわざ SQL 文を実行するのが面倒という方にとっては有益な情報になると思います。

また、SQLite3 は Python の標準モジュールですので、特に Python を利用する方には SQLite Viewer や SQLite は利用価値の高い拡張機能だと思います。是非このページで使い方を理解していってください！

SQLite Viewer

最初に SQLite Viewer 拡張機能を紹介していきます。

SQLite Viewer のインストール

SQLite Viewer 拡張機能を利用するためには、あらかじめ SQLite Viewer 拡張機能をインストールしておく必要があります。ということで SQLite Viewer のインストールを行なっていきましょう！

まずは VSCode のウィンドウ左側にある 拡張機能 ボタンをクリックし、さらに上側の検索窓に sqlite と入力します。

SQLite viewer拡張機能のインストール手順

sqlite と入力することで拡張機能の検索が行われ、おそらく検索結果の上位の方に SQLite Viewer という拡張機能が表示されるはずです。この拡張機能の インストール ボタンを押せば、SQLite Viewer のインストールが行われます。おそらくすぐにインストールが完了すると思います。

スポンサーリンク

SQLite Viewer の使い方

インストールが完了すれば、あとは VSCode から SQLite3 のデータベースのファイルが存在するフォルダを開き、エクスプローラーからそのファイルをクリックすれば良いだけです。

Django を既に利用し、makemigrations や migrate を実行している場合、VSCode から Django のプロジェクトのフォルダを開けば、プロジェクトのフォルダ直下に db.sqlite3 というファイルが存在するはずです。これが SQLite3 のデータベースのファイルになります（以降、SQLite3 のデータベースのファイル名が db.sqlite3 であることを前提に解説していきます）。

SQLite Viewer をインストールしている場合、この SQLite3 のデータベースのファイルのアイコンが下の図のように赤色に変化していると思います（もしかしたら設定によって違う色かもしれないです…）。

SQLite3のデータベースファイルのアイコンが変化する様子

続いて db.sqlite3 をクリックしてみましょう。db.sqlite3 は通常では単なるバイナリファイルとして扱われるので VSCode で上手く開くことができないのですが、SQLite Viewer 拡張機能をインストールしている場合、下の図のようにデータベース内のテーブル一覧が表示されます。

さらに、右側のウィンドウには選択中のテーブルの中身、つまりレコード一覧が表示されます。

SQLite viewerでテーブルの中身を表示する様子

つまり、VSCode のエクスプローラーからデータベースのファイルをクリックし、続いてテーブルをクリックするだけで、あなたが希望するテーブルの中身を表示することができます。

テーブル名について補足しておくと、Django の場合、models.py で定義したモデルから生成されるテーブルの名前は アプリ名_モデルのクラス名 になるはずです（特にテーブル名を指定していない場合は）。

例えば、Django で下記のようなプロジェクト・アプリ・モデルの構成にしている場合、

  • プロジェクト：ImageProject
    • アプリ：ImageApp
      • モデル（models.py）：
        • Image クラス（models.Model のサブクラス）
        • Comment クラス（models.Model のサブクラス）

makemigrations と migrate を行えば、データベースの中に ImageApp_image と ImageApp_comment というテーブルが作成されるはずです。

そして、db.sqlite3 をクリックして表示されるテーブル一覧の中にも imageApp_image と imageApp_comment が存在し、これらのテーブルを選択すれば中身を表示することができます。

models.pyで作成したモデルのテーブルがSQLite viewerで確認できる様子

Comment クラスは、イメージとしては画像投稿サービスにおいて画像に対するコメントを管理するクラスであり、具体的には models.py で下記のように定義したものになります。

Comment 
from django.db import models
from django.contrib.auth.models import User

class Comment(models.Model):

    image = models.ForeignKey(Image, on_delete=models.CASCADE)
    user = models.ForeignKey(User, on_delete=models.CASCADE)
    message = models.TextField()
    time = models.TimeField(auto_now_add=True)

上の図では、この Comment から生成される ImageApp_comment のテーブルの中身が表示されています。

Comment で用意した各フィールドの値がテーブルの表示結果から確認することができますし、さらに、それらのフィールドの値から、各コメントがどのようなものであるかも大体分かると思います。

  • 誰からのコメント？（user_id）
  • どの画像に対するコメント？（image_id）
  • どんなコメント？（message）
  • コメントの投稿日時は？（time）

もちろん SQL 文を実行したり、Python や Django からレコードを取得したりするのでもテーブルの中身の表示は可能ですが、クリックだけでテーブルを表示できるのはかなりお手軽だと思います！

SQLite

続いては、もう１つの拡張機能である SQLite を紹介していきたいと思います。

SQLite のインストール

SQLite 拡張機能も SQLite Viewer とほぼ同様の手順でインストールすることが可能です。

まずは VSCode のウィンドウ左側にある 拡張機能 ボタンをクリックし、さらに上側の検索窓に sqlite と入力します。

すると、おそらくですが、検索結果の一番上に SQLite という拡張機能が表示されるはずです。この拡張機能の インストール ボタンを押せば、SQLite のインストールが行われます。

SQLite拡張機能のインストール手順

スポンサーリンク

SQLite の使い方

SQLite の場合は、まずはコマンドパレットからデータベースファイルを開く必要があります。

コマンドパレットは、例えば VSCode のウィンドウ左下の 設定 ボタン（歯車ボタン）をクリックし、表示されるメニューから コマンドパレット を選択することで開くことができます。

コマンドパレットを表示する手順

コマンドパレットが開かれたら、コマンドパレットの入力欄に >sqlite を入力します（> に関しては最初から入力されているはずです）。

すると、コマンドの検索結果として SQLite: Open Database が見つかると思いますので、それをクリックします。

SQLiteからデータベースを開く手順

クリックすれば、次は開くデータベースファイルの候補が表示されます。

すでに VSCode でフォルダを開いており、さらにそのフォルダ以下にデータベースファイルが存在するのであれば、そのファイルが候補として表示されているはずです（下の図の db.sqlite3）。このファイルのデータベースのテーブルを表示したい場合は、これをクリックすれば良いです。

まだフォルダを開いていない場合や候補以外のファイルを開きたい場合は Choose database from file をクリックし、ファイル選択ダイアログからファイルの選択を行なってください。

開くデータベースの候補が表示される様子

ファイル選択を行なっても一見何も変化がないように感じるかもしれませんが、上手くファイルが開けているのであれば、エクスプローラー画面（VSCode のウィンドウ左側の エクスプローラー ボタンをクリックして表示される画面）に、SQLITE EXPLORER が表示されているはずです。

SQLITE EXPLORERが表示される様子

ここに先程選択したファイルのファイル名が表示されていれば、正常にデータベースを開くことができ、以降で紹介する手順によりテーブルの中身の表示やテーブルへの操作を行うことができます。

ファイル名が表示されていない場合はファイル名が隠れているだけかもしれません。おそらく、SQLITE EXPLORER の部分をクリックすればファイル名が表示されると思います。

テーブルの中身の表示

ここから実際にテーブルを操作する手順を解説していきます。

まず、テーブルの中身の表示を行う手順を解説します。

先ほど表示された SQLITE EXPLORER のファイル名をクリックすれば、そのファイルのデータベースに含まれるテーブルが表示されます。

さらに、テーブルにマウスカーソルを合わせれば 右向きの三角マーク が表示されますので、それをクリックすることで、新たなタブが開かれ、そこにテーブルの中身が表示されます。

SQLiteでテーブルの中身を表示する手順

実際に表示した結果は下の図のようになります。

SQLiteでテーブの中身を表示した様子

テーブルの中身を表示する手順は以上です。

もちろん、あなたが作成したテーブルや保存しているレコードによってテーブルの中身は異なりますので注意してください。また、テーブルの中にレコードがない場合、テーブル自体が表示されないので注意してください（この場合は 右向きの三角マーク を押しても反応しないはずです）。

テーブルへの操作

SQLite Viewer とは異なり、SQLite ではテーブルへの操作（テーブルへのレコードの追加やテーブルからのレコードの削除など）を行うことも可能です。

ただ、これは結局 SQL 文を実行するだけなので、わざわざ拡張機能から行う必要もないかもしれません。が、一から SQL 文を考えるよりは少し楽かなぁと思います。

テーブルへの操作を行うためには、操作を行いたいテーブルにマウスカーソルを合わせて右クリックを行い、表示されるメニューから New Query [Insert] or New Query [Select] を選択します。テーブルへのレコードの追加を行いたいのであれば New Query [Insert] を、テーブルからレコードの抽出を行いたいのであれば New Query [Select] を選択するので良いです。テーブルの操作を行う手順

で、New Query [Insert] or New Query [Select] を選択すれば、VSCode に SQL の編集画面が表示され、その中に選択したクエリに合わせた SQL 文が入力されているはずです。

SQL文編集画面が表示される様子

要は、ここに自身が実行したい SQL 文を入力していけば良いだけです。そして、SQL 文の入力が終わった際には編集画面を右クリックし、表示されるメニューの Run Query を実行すれば、入力した SQL 文が実行されてテーブルに対して操作が行われます。

SQL文を実行する手順

Run Query 実行後に再度テーブルの 右向きの三角マーク をクリックしてテーブルの中身を表示すれば、SQL 実行後の状態のテーブルに変化しているはずです。

一応具体例を示しておくと、私の場合は ImageApp_comment というテーブルを右クリックして New Query [Insert] を実行した際には、SQL 文の編集画面には下記が入力されていました。

自動入力されるSQL文 
-- SQLite
INSERT INTO ImageApp_comment (id, message, time, image_id, user_id)
VALUES ();

今回の例ではレコードの挿入を行うため、１行目の括弧内で記された列の内容に合わせて、挿入したいレコードを指定していくことになります。

例えば下記のように変更を行えば、２つのレコードが ImageApp_comment に追加されることになります。レコードの各フィールドの値は VALUES 以降の ( 〜 ) の中で指定を行なっています。

レコードを２つ挿入するSQL文 
-- SQLite
INSERT INTO ImageApp_comment (id, message, time, image_id, user_id)
VALUES (7, 'こんにちは', '03:56:09.257341', 1, 2),
(8, 'さようなら', '04:36:07.324241', 5, 1);

編集後に、編集画面上での右クリックにより表示されるメニューの中から Run Query を実行すれば、ImageApp_comment のテーブルが下の図のように変化します。

SQLite拡張機能からテーブルを操作した結果を示す図

こんな感じで、SQLite 拡張機能を利用することで、VSCode から SQL 文を実行してテーブルの操作を行うことができます。

ここまでの例で感じ取っていただけたのではないかと思っているのですが、一応補足しておくと、New Query [Insert] 等を実行して自動入力される SQL 文の１行目の内容は、あなたが作成したテーブル（Django の場合はモデル）に応じて異なるので注意してください。

当然、レコードを作成する場合は、あなたが作成したテーブルに合わせて、VALUES 以降の ( 〜 ) の中に指定する値も変更する必要があります。

自動入力されるSQL文 
-- SQLite
INSERT INTO ImageApp_comment (id, message, time, image_id, user_id)
VALUES ();

ちなみに、上記の ImageApp_comment は、SQLite Viewer の使い方 で紹介した Comment モデル（クラス）から生成されたテーブルになります。

また、テーブルを右クリックした際に表示されるメニューの中には、New Query の候補として New Query [Insert] と New Query [Select] しかありませんが、実行できる SQL 文が Insert と Select のみであるというわけではないので注意してください。

例えば下記のように SQL 文を変更して Run Query を実行すれば、ImageApp_comment テーブルから id が 7 のレコードを削除するようなこともできます。

レコードを削除するSQL文 
-- SQLite
DELETE FROM ImageApp_comment WHERE id=7;

まとめ

このページでは、VSCode で SQLite のテーブルの中身を簡単に表示することの可能な拡張機能として、下記の２つの紹介を行いました！

上記の２つ両方とも、インストールやテーブルの表示の手順は非常に簡単です。

テーブルの中身の確認さえ出来れば良いのであれば、前者の SQLite Viewer の方が、よりテーブルの表示の手順は簡単なのでオススメです。もし、表示だけでなくテーブルの操作も行いたいのであれば、後者の SQLite の方がオススメです。

私はとりあえず SQLite Viewer を使っています。

SQL 文を書くことなく、さらに VSCode 上でテーブの中身を確認することができるので、かなり便利な拡張機能だと思います。特に SQLite を利用してプログラムやアプリを開発する場合は役に立つ機会も多いと思いますので、ぜひこれらの拡張機能を利用してみてください！

また、VSCode を利用するのであれば Django で作成したアプリもステップ実行できるようにしておくと便利だと思います。かなりデバッグがやりやすくなります。

VSCode で Django で作成したアプリをステップ実行する手順は下記ページで解説していますので、こちらもぜひ読んでみてください！

【VSCode】Django のデバッグ環境の構築手順

同じカテゴリのページ一覧を表示

コメントを残す

メールアドレスが公開されることはありません。 ※ が付いている欄は必須項目です

前の記事

The Xxxx could not be created because the data didn't validate.エラーの原因と対処法の解説ページアイキャッチ
【Django】The Xxxx could not be c…

次の記事

【Django】静的ファイルの扱い方（画像・CSS・JS）
Djangoでの静的ファイルの扱い方の解説ページアイキャッチ