Reduxでの製品データオブジェクトの作成

出品者オブジェクトを作成する関数は できましたので、製品に移りましょう。このオブジェクトの作成は データフィールドが多いため、少し複雑になります。 さあ、始めましょう。

製品アプリケーションを開き、 その中のファイル server.js を開きましょう。 関数 getRandInt の後に、 私たちの関数 createProductData を書きます:

api/server.jsconst createProductData = () => {}

次に、必要なプロパティを定義します。 name、price、amount の値は、 前のレッスンで書いた getRandInt を使って生成します:

api/server.jsconst createProductData = () => {
  return {
    name: `Product${getRandInt(0, 100)}`,
    price: getRandInt(100, 2000),
    amount: getRandInt(1, 50),
  }
}

説明文を生成するために、もう一つ便利なものを利用します。 それは faker ライブラリで、 様々な言語で偽の名前、住所、メール、通り名、テキストなどを 生成することができます。 ターミナルで以下のコマンドを入力し、 このライブラリをアプリケーションにインストールしましょう:

terminalnpm install @faker-js/faker --save-dev

そして、ファイルにインポートします:

api/server.jsimport { faker } from '@faker-js/faker'

これを使って、よく知られた 「Lorem ipsum」というダミーテキストを含む 文章を生成してみましょう。 説明文には 3 から 5 個の そのような文を含めるようにします:

api/server.jsconst createProductData = () => {
  return {
    name: `Product${getRandInt(0, 100)}`,
    desc: faker.lorem.sentences({ min: 3, max: 5 }),
    price: getRandInt(100, 2000),
    amount: getRandInt(1, 50),
  }
}

次に、反応を表すフィールドをオブジェクトに追加します。 その値には、create コマンドでその場で生成されたオブジェクトを渡します (反応は今のところ 0 になります):

api/server.jsconst createProductData = () => {
  return {
    name: `Product${getRandInt(0, 100)}`,
    desc: faker.lorem.sentences({ min: 3, max: 5 }),
    price: getRandInt(100, 2000),
    amount: getRandInt(1, 50),
    reactions: db.reaction.create(),
  }
}

最後のプロパティとして、 既に生成された出品者オブジェクトを追加します。 このオブジェクトは必ず関数 createProductData の パラメータとして渡さなければなりません。 製品オブジェクト作成関数の完全なコードは以下のようになります:

api/server.jsconst createProductData = (seller) => {
  return {
    name: `Product${getRandInt(0, 100)}`,
    desc: faker.lorem.sentences({ min: 3, max: 5 }),
    price: getRandInt(100, 2000),
    amount: getRandInt(1, 50),
    reactions: db.reaction.create(),
    seller,
  }
}