Quickstarters
Feature Overview
Denoのバックエンドを構築する方法は?
30 分
はじめに このチュートリアルでは、back4appを使用してdenoのバックエンドを構築する方法を学びます。 back4appの主要機能—データベース、rest api、ユーザー認証、ファイルストレージ、ライブクエリ—をdeno環境に統合するためのすべてのステップを説明します。 restエンドポイントを通じてback4appと通信し、自分でサーバーを管理することなく完全なインフラストラクチャを作成する方法を見ていきます。 back4appを使用すると、denoでサーバーを手動で設定する必要がなくなり、時間と労力を節約できます。 denoの標準ライブラリと現代的なアプローチのおかげで、よりシンプルなコードを書くことに集中できます。 このdenoのバックエンドを構築する方法ガイドの終わりまでに、高度なセキュリティ、クラウドコード、スケジュールされたタスクをdenoアプリケーションに統合するための明確な道筋を持つことができるでしょう。 このチュートリアルを完了すると、サーバーを実行し、rest apiを処理し、ユーザー認証を統合し、ファイルを保存し、タスクを簡単にスケジュールできるようになります。 また、back4app rest apiを使用してdenoのfetchアプローチでデータを管理する方法も理解できるようになります。 前提条件 back4appアカウントと新しいback4appプロジェクト back4appの始め方。 https //www back4app com/docs/get started/new parse app アカウントを持っていない場合は、無料で作成できます。上記のリンクを使用してプロジェクトを準備してください。 denoをインストールする denoは https //deno land https //deno land から入手できます。オペレーティングシステムにdenoをインストールし、 deno version で確認してください。 基本的なdenoの概念に慣れていること モジュール、ファイルシステム、 deno run allow net , または標準ライブラリからアプリケーションモジュールをインポートする方法など。 rest apiの基本的な知識 データ処理のためにfetch呼び出しとヘッダーのコンテンツタイプを使用するので、restとjsonの基本を理解していることを確認してください。 始める前に、これらの前提条件を確認してください。back4appプロジェクトが設定され、ローカルのdeno環境が稼働していることで、このチュートリアルをスムーズに進めることができます。 ステップ1 – back4appで新しいプロジェクトを作成し、接続する 新しいプロジェクトを作成する あなたのdenoバックエンドの基盤はback4appプロジェクトです。まだ作成していない場合は back4appアカウントにログイン 「新しいアプリ」ボタンをクリック back4appダッシュボードで。 アプリに名前を付ける (例:「deno backend tutorial」)。 プロジェクトが準備できると、back4appダッシュボードに表示されます。このプロジェクトでは、データベース、セキュリティ、およびapiを設定します。 rest経由でback4appに接続 deno用のparse sdkがないため、back4appのrest apiエンドポイントを使用します。アプリの アプリ設定 または セキュリティとキー セクションで、 アプリケーションid , rest apiキー , および サーバーurl を見つけることができます。 このチュートリアル全体を通して、 fetch を使用してdenoからback4appにリクエストを送信します。各呼び出しにapiキーとヘッダーのコンテンツタイプを含めることを忘れないでください。 ステップ2 – データベースの設定 このステップでは、back4appでデータモデルを作成し、denoからrest apiを使用してそれと対話します。 データモデルの作成 「データベース」セクションに移動 し、back4appダッシュボードで。 「新しいクラスを作成」をクリック し、例えば「todo」と名付けます。 関連するカラムを追加 (例:title(string)、iscompleted(boolean))。 データが保存されるときに、parseがこれらのカラムを自動的に作成することも許可できます。 aiエージェントを使ったデータモデルの作成 back4appのaiエージェントがスキーマを設計します aiエージェントを開く あなたのback4appダッシュボードで。 データモデルを説明する (例:“タイトル、説明、iscompletedフィールドを持つtodoクラスを作成する。”)。 エージェントに自動的に スキーマを生成させる。 これにより、より複雑なスキーマを迅速に管理できます。 rest apiを使用したデータの読み書き denoから、 fetch を使ってrestエンドポイントを呼び出すことでサーバーを実行できます。例えば、todoを作成するには // file called createtodo ts export async function createtodoitem(title string, iscompleted boolean) { const url = "https //parseapi back4app com/classes/todo"; const body = json stringify({ title, iscompleted }); const response = await fetch(url, { method "post", headers { "x parse application id" "your application id", "x parse rest api key" "your rest api key", "content type" "application/json", }, body, }); if (!response ok) { throw new error(`error saving todo ${response statustext}`); } const result = await response json(); return result; } todoを取得するには // file called fetchtodos ts export async function fetchtodos() { const url = "https //parseapi back4app com/classes/todo"; const response = await fetch(url, { method "get", headers { "x parse application id" "your application id", "x parse rest api key" "your rest api key", }, }); if (!response ok) { throw new error(`error fetching todos ${response statustext}`); } const result = await response json(); return result; } これを実行できます deno run allow net createtodo ts graphql apiを使用したデータの読み書き back4appはgraphqlエンドポイントも提供しています https //parseapi back4app com/graphql // file called createtodographql ts export async function createtodographql(title string) { const mutation = ` mutation { createtodo(input { fields { title "${title}" iscompleted false } }) { todo { objectid title iscompleted } } } `; const response = await fetch("https //parseapi back4app com/graphql", { method "post", headers { "x parse application id" "your application id", "x parse rest api key" "your rest api key", "content type" "application/json", }, body json stringify({ query mutation }), }); const result = await response json(); return result; } ライブクエリの操作(オプション) ライブクエリはリアルタイムで更新されますが、denoにはネイティブのparse livequeryライブラリがありません。それでも、back4appダッシュボードで他のクライアント用にライブクエリ機能を設定するか、denoでwebsocketを使用して手動で購読できます。詳細については、公式の ライブクエリのドキュメント https //www back4app com/docs/platform/live queries をご覧ください。 ステップ3 – aclとclpによるセキュリティの適用 概要 back4appのacl(アクセス制御リスト)とclp(クラスレベルの権限)は、データを保護します。clpを使用して、クラス全体のデフォルトルールを設定します。その後、aclを使用してオブジェクトレベルの制限を行います。 クラスレベルの権限の設定 データベースを開く セクションをあなたのback4appダッシュボードで。 クラスを選択する (例えば、「todo」)。 クラスレベルの権限 タブに移動します。 必要に応じて、一般公開または認証されたユーザーのために 読み取り/書き込みアクセスを有効または無効にします。 aclの設定 rest経由でオブジェクトを作成または更新する際に、リクエストボディにacl属性を含めることができます。例えば const body = json stringify({ title "private task", acl { " " { "read" false, "write" false }, "role\ admins" { "read" true, "write" true }, } }); この例では、「admins」ロールのみが読み取りまたは書き込みを許可されています。一般公開アクセスはオフです。 ステップ 4 – クラウドコード関数の作成 なぜクラウドコードなのか クラウドコードは、安全なサーバーサイドのロジックを保存する場所です。サーバーを自分で管理する必要はありません。特定のクラスに対してバリデーションやトリガーを追加できます。 クラウドコード関数の例 クラウド関数(javascriptで)を定義し、アプリにデプロイできます。例えば、テキストの長さをチェックする関数は次のようになります parse cloud define("calculatetextlength", async (request) => { const { text } = request params; if (!text) { throw "text parameter is required"; } return { length text length }; }); デプロイメント コードは、 back4app cli https //www back4app com/docs/local development/parse cli または、back4appダッシュボードのクラウドコードパネルを通じてデプロイできます。 クラウドコードでのnpm 外部ライブラリをインポートすることができます。 require() デプロイ後、サーバー環境がそれらを実行します。これは高度なタスクに役立ちますが、denoから実行することはback4appのクラウドコード環境とは別であることを忘れないでください。 ステップ 5 – 認証の設定 認証を有効にする back4appは、認証のためにparse userクラスを使用します。denoを使用している間、ユーザーを管理するためにrestエンドポイントを呼び出すことができます。 restを使用したサインアップとログイン async function signupuser(username string, password string, email string) { const url = "https //parseapi back4app com/users"; const body = json stringify({ username, password, email }); const response = await fetch(url, { method "post", headers { "x parse application id" "your application id", "x parse rest api key" "your rest api key", "content type" "application/json", }, body, }); return await response json(); } async function loginuser(username string, password string) { const url = `https //parseapi back4app com/login?username=${username}\&password=${password}`; const response = await fetch(url, { method "get", headers { "x parse application id" "your application id", "x parse rest api key" "your rest api key", }, }); return await response json(); } ソーシャルログイン back4appでgoogle、facebook、apple、その他のプロバイダーを設定できます。その後、oauthトークンを使用して専用のエンドポイントを呼び出します。詳細については、 back4appのソーシャルログインドキュメント https //www back4app com/docs/platform/sign in with apple を参照してください。 ステップ6 – ファイルストレージの取り扱い ファイルのアップロードと取得 denoからファイルをアップロードするには、 https //parseapi back4app com/files/\<filename> にpostリクエストを使用します。例えば async function uploadfile(filedata uint8array, filename string) { const url = `https //parseapi back4app com/files/${filename}`; const response = await fetch(url, { method "post", headers { "x parse application id" "your application id", "x parse rest api key" "your rest api key", "content type" "image/png", }, body filedata, }); return await response json(); } その結果得られたファイルurlをクラスオブジェクトに保存できます。この方法は、denoでサーバーを実行している間に画像やドキュメントを保存するのに最適です。 ステップ7 – メール確認とパスワードリセット 概要 メールを確認することで正当なアクセスが保証されます。パスワードリセットは、ユーザーが安全にアクセスを取り戻すのに役立ちます。 ダッシュボード設定 メール確認を有効にする あなたのback4appダッシュボードのメール設定で。 確認テンプレートをカスタマイズする パスワードリセットを有効にする お好みのメールレイアウトを設定します。 ユーザーがサインアップすると、メール認証をオンにしている場合は確認リンクが送信されます。パスワードリセットの場合は、restエンドポイントを呼び出します post /requestpasswordreset ステップ 8 – クラウドジョブによるタスクのスケジューリング クラウドジョブの概要 クラウドジョブは、人間の介入なしに定期的に実行されます。たとえば、古いレコードを毎日削除したり、定期的なメールリマインダーを送信したりできます。 parse cloud job("cleanupoldtodos", async (request) => { const todo = parse object extend("todo"); const query = new parse query(todo); const now = new date(); const thirty days = 30 24 60 60 1000; const cutoff = new date(now\ valueof() thirty days); query lessthan("createdat", cutoff); const oldtodos = await query find({ usemasterkey true }); await parse object destroyall(oldtodos, { usemasterkey true }); return `deleted ${oldtodos length} old todos `; }); このジョブをデプロイした後、あなたの back4app ダッシュボードの アプリ設定 > サーバー設定 > バックグラウンドジョブ でスケジュールできます。 ステップ 9 – ウェブフックの統合 定義 ウェブフックは、オブジェクトの作成や更新などのイベントが発生したときにトリガーされるhttpコールバックです。slack、stripe、または任意の外部サービスと統合できます。 設定 「その他」 > 「webhooks」を開く back4app ダッシュボードで。 「webhookを追加」をクリック し、サードパーティサービスのエンドポイントを提供します。 リクエストを送信したいトリガーまたはクラスを設定 します。 これにより、back4appでオブジェクトを作成または変更するたびに、外部システムがデータを受信できるようになります。 ステップ 10 – back4app管理パネルの探索 管理パネルの紹介 非技術的なチームは、このパネルを使用してデータを視覚的に管理できます。crud操作とデータレビューを簡素化します。 有効にする方法 アプリダッシュボード > その他 > 管理アプリ に移動し、「管理アプリを有効にする」を選択します。 管理ユーザーを作成 してログインします。 管理アプリ用のサブドメインを設定 します。 その後、管理アプリにログインして、安全にレコードを管理できます。 結論 このチュートリアルでは、back4app上でdenoのバックエンドを構築する方法を学びました。データモデルを作成し、ユーザー認証を処理し、セキュリティのためのaclとclpについて学び、クラウドジョブをスケジュールしました。 外部apiをwebhookを介して統合する方法や、deno run allow netコマンドを使用してサーバーやrest apiを実行する方法も見ました。 このセットアップにより、手動でファイルシステムやサーバーアーキテクチャの標準ライブラリの複雑さを構成することなく、迅速に開始できます。 次のステップ denoアプリケーションを拡張 し、cloud codeを使用して追加のエンドポイントと高度なロジックを実装します。 より多くのサービスを統合 (例:決済ゲートウェイ、分析)し、back4appのデータと連携させます。 back4appの公式ドキュメントを参照 し、セキュリティ、パフォーマンス、ログ分析のヒントを深く学びます。 実験 し、高度なリアルタイム機能やdeno kvストレージを使用して、denoランタイムとback4appの堅牢な環境間でデータを橋渡しします。 新しい知識を持って、back4appにサポートされた安全でスケーラブル、かつ機能満載のdenoバックエンドを自信を持ってデプロイできます。