次にどのテレビ番組や映画を見ようか迷ったことがありますか?さまざまなストリーミング プロバイダーでアクセスできるオプションが非常に多いため、次のどんちゃん騒ぎを決めるのは決して簡単ではありません。 次の映画を決めるとき、私たちは主にいくつかの評価機関 (IMDB など) からのレビューと評価に依存します。ただし、これらの機関が多数あることを考えると、どの格付けを信じるべきかを選択するのは難しいかもしれません。 そうは言っても、多くの場合、これらの組織の多くから高い評価を得ている映画を視聴する方が安全です。しかし、そのような映画を見つけるのは難しくありませんか？はい、そうです！ この 3 回のブログ シリーズでは、まさにこの問題を解決するソフトウェア ソリューションを作成していきます。この Django アプリケーション (Flix-Finder と呼ぶことにします) を使用すると、ユーザーは複数の評価機関からの評価に基づいて映画をフィルタリングできます。 BrightData のサービスを使用して、アプリケーションに必要なデータを取得します。 それでは早速、Flix-Finder の構築を始めましょう。 アプリケーションのセットアップ このセクションを始める前に、Django がシステムにインストールされていることを確認してください。 システムに Django がインストールされている場合は、次のコマンドが機能するはずです。 python3 -m django --version システムに Django がインストールされていない場合は、pip を使用して Django をインストールしてください。 python3 -m pip install Django Django プロジェクトをセットアップすることから始めましょう。次のコマンドを使用して新しいプロジェクトを作成します。 rishabh@my-ubuntu:~/projects$ python3 -m django startproject flix_finder ディレクトリを新しく作成したプロジェクト ディレクトリ に変更します。ここでお気に入りのコード エディターを開きます。 Django によって自動的に作成されたこのディレクトリに次のファイルが表示されるはずです。 flix_finder rishabh@my-ubuntu:~/projects/flix_finder$ tree . . ├── flix_finder │ ├── asgi.py │ ├── __init__.py │ ├── settings.py │ ├── urls.py │ └── wsgi.py └── manage.py 1 directory, 6 files これらのファイルの詳細については、Django が提供するこの を参照してください。 説明 Django サーバーを実行し、 にアクセスして、セットアップが正しく完了したことを確認してください。 localhost:8000 rishabh@my-ubuntu:~/projects/flix_finder$ python3 manage.py runserver 新しいアプリの作成と最初のビュー Django アプリ (または Django アプリケーション) は、個々の機能をカプセル化する、より大きな Django プロジェクトのコンポーネントを指します。 Django アプリは再利用可能な独立したコンポーネントです。これらは、モデル、ビュー、テンプレート、テスト、およびその他のファイルで構成されます。 このプロジェクトのレコメンダー ロジックはすべて、 というアプリケーションに存在します。このアプリを作成するには、次のコマンドを実行します。 recommender rishabh@my-ubuntu:~/projects/flix_finder$ python3 manage.py startapp recommender 上記のコマンドは、 という名前の新しいフォルダーを作成します。アプリケーションのロジックはすべてこのフォルダー内に収まります。 recommender アプリケーションが正常に作成されたと言えるまでには、あと 1 つのステップが残っています。先に進み、 の下にある リストに新しく作成したアプリの名前を追加します。 flix_finder/settings.py INSTALLED_APPS # flix_finder/settings.py INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'recommender' ] これで、 アプリが正常に作成されました。 recommender 次に、最初のビューを作成しましょう。 Django では、ビューは HTTP リクエストを受信し、HTTP レスポンスを返す Python 関数です。ビューは、ビジネス ロジックに基づいてユーザーにデータを表示する際に重要な役割を果たします。 の下に新しいメソッドを作成します。このメソッドは、 経由で送信されるリクエストを処理します。現時点では、このエンドポイントは単に hello メッセージを返します。 recommender/views.py localhost:8000/ from django.http import HttpResponse def index(request): return HttpResponse("Hello From Recommender!") リクエストを処理するためのビュー メソッドを作成しましたが、このビューに対応するエンドポイントを (プロジェクト内で) 指定していません。これは ファイルで行います。 urls.py レコメンダー アプリ内に新しいファイルを作成し、 という名前を付けます。ここでは、この URL と view メソッドの対応を指定します。 urls.py from django.urls import path from . import views urlpatterns = [ path("", views.index, name = "index") ] 次に、この新しい URL のファイルを Django に認識させる必要があります。ファイル を次のように更新します。 flix_finder/urls.py from django.urls import path, include urlpatterns = [ path('', include("recommender.urls")), path('admin/', admin.site.urls), ] まだサーバーを起動していない場合は、ブラウザで を開きます。 hello メッセージが表示されるはずです。 localhost:8000 おめでとうございます。最初のビューの作成が完了しました。 テンプレートを使ってみよう… 同意しましょう…応答として文字列を送信することは、最もクールなことではありません。代わりに、適切な HTML 応答を送信する必要があります。そして、まさにこの目的のために、Django テンプレートを使用します。 ディレクターの下にディレクトリ を作成します。 Django はデフォルトで という名前のディレクトリ内で HTML ファイルを検索するため、この新しく作成されたフォルダーの名前は特別です。 recommender templates templates 新しく作成したディレクトリ内に、 という名前の新しいファイルを作成します。このファイル内に、ユーザーが にアクセスしたときに表示する HTML を記述します。 index.html localhost:8000 ここでは HTML の記述が主な焦点ではないため、その部分の説明は省略します。 から HTML をコピーするだけで済みます。 ここ この HTML ファイル (または Django テンプレート) について知っておくべきことのいくつかを次に示します。 この HTML は、Web ページ上にナビゲーション バー、カルーセル、動画検索フォーム、動画検索結果の 4 つを表示します。 (1) Django テンプレート言語を使用して、HTML 内で直接 Python 変数を使用できるようにします。 (2) コンテキスト (テンプレートに渡されるデータ) 内の 変数を予期し、それを使用してカルーセルを表示します。 (3) featured_movies 変数には Django Form オブジェクトが入力されることが期待されており、それを使用して映画検索フォームを表示します。 (4) form 変数を期待しており、それを使用して検索結果を表示します。 (5) filtered_movie_list また、検索結果が空かどうかを示す 変数も期待されます。 (6) no_result_error スタイル設定用の CSS も追加する必要があります。 ディレクトリの下に ディレクトリを作成します。このフォルダーにはすべての静的ファイルが保存されます。 recommender static という名前の新しいファイルを作成し、 から CSS を貼り付けます。 style.css この URL これで、必要な HTML と CSS がすべて整いました。次に、映画検索フォームを作成する必要があります。 動画検索フォームの作成 このテンプレートではフォーム オブジェクトを提供する必要があるため、フォーム オブジェクトを作成する必要があります。 Django フォームが何なのかわからないですか?これについてはChatGPTを読んで説明してください - Django フォームは、HTML フォームの作成と操作に使用される Django フレームワークのモジュールです。これらには、プレーンな HTML フォームを使用する場合に比べて、いくつかの利点があります。 HTML の自動レンダリング。 Django フォーム クラスを定義すると、Django はそれを HTML フォームとしてレンダリングします。 データの検証。 Django フォームは、送信されたデータを検証し、保存する前にクリーンアップします。 データをフォームにバインドします。既存のデータをフォームにバインドして、ユーザーに表示して編集することができます。 レコメンダーのアプリ ディレクトリ内に、 という名前のファイルを作成します。これに次のコードを追加します。 forms.py from django import forms class MovieSearchForm(forms.Form): imdb_rating = forms.DecimalField(min_value=0.1, max_value=9.9, required=True, label='Minimum IMDB Rating') release_year = forms.IntegerField(required=True) ここでは、映画検索フォームのフォーム クラスを作成しました。このフォームには、クラスで説明されている 2 つのフィールドが含まれます。フォームについて詳しく知りたい場合は、 確認してください。 これを インデックスビューの更新 テンプレートに必要なものがすべて設定されたら、この新しく作成したテンプレートを使用するように view メソッドを更新する必要があります。 from .forms import MovieSearchForm # We use a hard-code list here, we will make it dynamic in subsequent parts featured_movie_list = [ { "img_src": "https://images.thedirect.com/media/article_full/amazing-spider-man-3-andrew-garfield-movie-mcu.jpg", "img_alt": "...", "active": True }, { "img_src": "https://static1.colliderimages.com/wordpress/wp-content/uploads/2022/11/avatar-the-way-of-water-poster.jpg", "img_alt": "...", "active": False } ] def index(request): context = { "featured_movies": featured_movie_list, "form": MovieSearchForm() } return render(request, 'index.html', context) サーバーを起動し、 に移動します。次のページが表示されるはずです。 localhost:8000 BrightData からの IMDB データ ビュー、URL、テンプレート、フォームをすべて配置したら、アプリケーションが操作するデータを検討できるようになります。私たちのプログラムでは、複数の格付け機関 (まずは IMDB) からのデータが必要になります。 残念ながら、このデータを取得するための明確に定義された API はありません。この情報を取得する 1 つの方法は、Python Selenium を使用して独自のスクレイパーを作成することです。ただし、これにはさらに多くの作業が必要であり、誰もがそのようなテクノロジーに慣れているわけではありません。 より良い解決策は、BrightData などのサードパーティ サービスを使用することです。 BrightData を使用すると、これらすべての情報を簡単に取得できます。 この最初のパートでは、BrightData から事前に厳選された IMDB データセットを使用します。これは、BrightData で利用できる多くのデータセットの 1 つです。このようにして入手できます。 BrightData にアカウントを登録します。 (1) ブラウザから にアクセスするか、左側から メニューを開きます。 (2) brightdata.com/cp/datasets Datasets & WebScraper IDE Dataset Marketplace に移動し、 を検索します。 (3) IMDB media dataset [データセットの表示] をクリックし、サンプル データセットを CSV 形式でダウンロードします。 (4) ダウンロードしたら、ファイルの名前を に変更し、 フォルダー内に配置します。このサンプル CSV には、1000 以上の映画の 28 個の IMDB 属性が含まれています。私たちのアプリケーションは、この部分の IMDB データセット上で動作します。 IMDB.csv recommender/static フォームの送信を受信するためのインデックス ビューの更新 検索リクエストを処理するために view メソッドを更新しましょう。 フォームからのすべての検索リクエストは POST リクエストとして到着します。フォームが正しく入力されていることを確認した後、ダウンロードした CSV ファイルからすべてのムービーをリストし、フィルター条件に一致しないムービーを除外します。更新されたコードは次のようになります。 def index(request): if request.method == 'POST': form = MovieSearchForm(request.POST) if form.is_valid(): movie_list = _getIMDBMovieDataList() filtered_movie_list = _filter_imdb_movie_list(movie_list, form) context = { "featured_movies": featured_movie_list, "form": MovieSearchForm(), "filtered_movie_list": filtered_movie_list, "no_result_error": len(filtered_movie_list)==0 } return render(request, 'index.html', context) context = { "featured_movies": featured_movie_list, "form": MovieSearchForm() } return render(request, 'index.html', context) メソッド と の実装は Django に固有のものではなく、純粋な Python です。したがって、ここではそれについて話すことは省略します。 ファイル全体は あります。 _getIMDBMovieDataList _filter_imdb_movie_list views.py ここに 最終製品 この時点に到達したことをおめでとうございます。すべての手順を適切に実行した場合は、サーバーを実行し、UI を介して検索を実行できるはずです。検索結果は次のようになります。 このシリーズのコード このシリーズの一部として作成されたすべてのコードは、 GitHub リポジトリで利用できます。このパートの最終結果は、 という名前の ブランチに含まれています。 この Part1 この 自分のコードとリポジトリに存在するコードをクロスチェックして、何か問題がないかどうかを確認することを常にお勧めします。 結論 これで、この 3 部構成の第 1 部が終了します。次のパートでは、BrightData の WebScraper IDE を使用して、他の格付け機関からデータを収集します。その後、フォームを更新して、ユーザーがより複雑な検索を実行できるようにします。 また、カルーセル コンポーネントを動的にします。 また次回…それまで、楽しく学習してください! 🙂
![featured image - Flix-Finder: Django と BrightData を使用した映画おすすめアプリの構築 [パート 1/3]](https://hackernoon.imgix.net/images/hxgB3A2KjtPk4sJXB1ezGnusKBx1-lu938jl.jpeg?auto=format&fit=max&w=3840)
