🔖 カリキュラム:6.15～19

Preview

前回の授業ではdbのインストール、接続、データフォーマットも設定しました.本当にdbとコミュニケーションするcrud機能をインストールする必要があります.
ビデオをアップロードするページを作成すると、CRUDの設定方法について説明します.
では、それぞれの機能を分けて、まずはC(create)機能から始めましょう.
次に,R(read)機能により生成されたデータがうまくロードされているかを調べる.
ビデオをアップロードするページを作成し、データベースに新しいデータを作成して取得します.

レッスン内容

step 0. アップロードページを作成します。

1) upload template
2)コントローラ上のgetUpload、PostUpload
3)ルータ上でビデオ/アップロードルーティングを行い,それぞれget,post機能を追加する.

step 1. template手動ビュー:inputname

ビデオモデルで作成したフォーマットに従って、フォームはデータの到来を期待します.
upload form付きuploadテンプレートに戻り、inputnameにデータ型で作成したキー値を書きます.

step 2. Controllerジェスチャー:new Model,Model。create

コントローラに戻って、クララからの情報をどのように処理するかを見てみましょう.

1)new Model:データ型に合わせてコントローラに新しいデータを作成します。

//view
const videoSchema = new mongoose.Schema({
    title: String,
    description: String,
    createdAt: Date,
    hashtags: [String],
    meta: {
        views: Number,
        rating: Number,
    },
});

//controller
export const postUpload = (req, res) => {
  const { title, description, hashtags } = req.body;
  const video = new Video ({
    title,
    description,
    createdAt: Date.now(),
    hashtags: hashtags.split(",").map(word => `#${word}`),
    meta: {
      views: 0,
      rating: 0,
    }
  });
  return res.redirect(`/videos/${id}`);
}

この過程で、文字列(「spliter」)、map()の分割方法を学習した.

参考までに、新しいデータはdbに保存されていません.

コンソールには追加されていないIDが表示され、newモデルを使用して新しいデータを生成する場合はMongusによって提供されます.

入力されたデータ型が正しくない場合(ex.title:String、title:6に設定)、モデルに基づいてタイプが調整されます.

タイプが変更できない場合(ex.views:Number Injectviews:lalaに設定)は、このセクションを削除してデータを作成します.

データ型以外の属性を追加する場合は、このようにします.
ex. { type: String, required: true, default: Date.now }

defaultプロパティ設定の場合、このプロパティに関数がある場合は()を削除する必要があります.Date.now() (x) Date.now (o)

defaultプロパティ設定は、コントローラで説明する必要はありません.デフォルト値が自動的に生成されるためです.

公式サイトのmongose.Schemaに適用できる様々な属性について説明します.

2) .save():作成したデータをデータベースに保存します。

1)

await 생성된데이터변수명.save()

🌟 ! 注意:忘れないでください.デベに対処するときは歩くのを待つ.

3) Model.create():別のオプション

作成時にnewモデルの代わりにモデルを使用します.create()を書くと.save()機能を含む方法なので.別途save()を書く必要はありません.

export const postUpload = async (req, res) => {
  const { title, description, hashtags } = req.body;
  const video = new Video ({
    title,
    description,
    createdAt: Date.now(),
    hashtags: hashtags.split(",").map(word => `#${word}`),
    meta: {
      views: 0,
      rating: 0,
    }
  });
  await 생성된데이터변수명.save()
  return res.redirect(`/videos/${id}`);
}

わあ.

export const postUpload = async (req, res) => {
  const { title, description, hashtags } = req.body;
  await Video.create ({
    title,
    description,
    createdAt: Date.now(),
    hashtags: hashtags.split(",").map(word => `#${word}`),
    meta: {
      views: 0,
      rating: 0,
    }
  });
  return res.redirect(`/videos/${id}`);
}

銀のようです.

4)try/catch:error時にエラーメッセージウィンドウを作成する

try/catch構文を使用してエラーをキャプチャし、エラーメッセージが表示されたときにビューに表示します.

//controller

export const postUpload = async (req, res) => {
  const { title, description, hashtags } = req.body;
  try {
    const video = new Video ({
      title,
      description,
      hashtags: hashtags.split(",").map(word => `#${word}`),
    });
    await video.save();
    return res.redirect(`/`);
  } catch (error) {
    console.log(error);
    return res.render("upload", {pageTitle: "Upload Video", errorMessage: error._message});
  }
}

// upload template

extends base
include mixins/videoMixin

block contents
    h1 Welcome to Wetube!
    a(href="/videos/upload") Upload Videos →
    each video in videos 
        +videoMixin(video)
    else 
        li Sorry nothing found.

5) Read part

5-1. read Home

postUploadプロセスが完了したら、最後にres.redirect("/")を設定し、フォームで情報転送が完了したらホームページに戻ります.また、ホームページでは、home templateがdbからデータをロードして表示することができます.ホームページに行ってみてください.データがよくロードされていることを確認することができます.

// videoController / home

export const home = async (req, res) => {
  try {
    const videos = await Video.find({});
    return res.render("home", { pageTitle: "Home", videos })
  } catch(error) {
    console.log("server error", error)
  }
}

5-2. read Watch

ロードしたデータヘッダーをクリックし、watch templateを解放し、データの詳細を読み込むように設定します.

//video router
videoRouter.get("/:id([0-9a-f]{24})", watch);

! 0から9、aからfは文字と数字の配列で、24文字列です.

//video controller

export const watch = async (req, res) => {
  const { id } = req.params; 
  const video = await Video.findById(id);
  return res.render("watch", { pageTitle: video.title, video });
}

! Video.またfindById(id)というモンゴル語のスキルを学びました.

//watch template
block contents
    div
        p=video.description
        small=video.createdAt
    a(href=`${video.id}/edit`) Edit Video →

このようにして生成されたデータがロードされているかどうかもよく確認できる.
6)存在しないビデオ要求に従ってスクリーンを作成する
if条件文を使用して404テンプレートを解放します(作成).

export const watch = async (req, res) => {
  const { id } = req.params; // const id = req.params.id; 의 es6 버전.
  const video = await Video.findById(id);
  if (!video) {
    return res.render("404", { pageTitle : "404, Not Found"});
  } 
  return res.render("watch", { pageTitle: video.title, video });
}

追加学習？

req.body:
The req. body objectでは、クライアント=>クライアントからStringまたはJSON objectのデータにアクセスできます.つまり、要求(req)のデータをWebページのフォームから表示できます.これには、inputの小さな値(キーがinputname)、リクエストされたサイトのparamsなどが含まれます.
mongoose.モデルでのデフォルトの設定
dbにdbs->マイdb->collection->マイデータセットを表示するには、dbにdbs->マイdb->を使用します.
名前がビデオではなくビデオなのは、モンゴル人が最初の面の小文字+エンディングにsを加えたことを知っていたからだ.
モンゴルモードタイプの確認
Mongooseモードは、Mongooseモデルを構成するためのオブジェクトと考えられます.
https://mongoosejs.com/docs/schematypes.html
モンスモードタイプの定義
モンゴルのすべてはモデルで始まった.各モードはMongoDBコレクションにマッピングされ、そのコレクション内のドキュメントの外観が定義されます.
https://mongoosejs.com/docs/guide.html
.excu
モンズメディアには含まれていない核心的な内容は.許しです.executeはexecute(実行)の略で、別途承諾しなくても、このメソッドをコミットする声明で待機します.そんなことがあるならわかるだろう

要点

データベース内のデータの作成(作成)を試みる:Schema()設定、モデル()、モデル.create()またはnew Model()、callback&promise、try/catch

また、データベース内のデータ:Modelを検索および読み込みしようとしました.find(), Model.findById()は、

を承諾しなければならない.