# 概要 - スクリーン、データベース、レイアウト設定、ユースケース

ソーシャルメディアフィード機能テンプレートを使用すると、ユーザーはお気に入りのソーシャルメディアツールを利用するように他のアプリメンバーとやり取りできます。この機能テンプレートには、画像を最優先としたソーシャルフィードがあり、ユーザーの投稿に「いいね」やフォロー、ブックマーク、コメントをすることができます。このテンプレートは、コミュニティアプリに最適で、メンバー間のエンゲージメントを促進します。

## 画面概要

📚 **インストラクション画面**

テンプレートの概要を素早く把握し、ヒント、ヘルプドキュメント、および興味を引くかもしれない関連するテンプレートを表示します。*この画面はいつでも削除できます。*

### ユーザー画面

**🖼️ すべての投稿**

アプリ全体のメンバーからのすべての投稿を表示します。

**👑 フォローフィード**

特定のメンバーをフォローしている人の投稿を素早く確認できます。

**♥️ いいねフィード**

アプリ内で「いいね」したすべての投稿をフィルターされたフィードで確認できます。

**🔖 ブックマークフィード**

便利な場所にブックマークしたすべての投稿を表示します。

**🆕 新規投稿モーダル**

メンバーに表示する新しい投稿を作成します。

**📝 投稿の編集モーダル**

自分の投稿を編集します。

**💬 コメントモーダル**

どのフィード内に投稿されたアイテムにコメントします。

**👤 ソーシャルプロファイル**

アプリ内の各ユーザーのプロフィールを確認します。

## データベース概要

ソーシャルメディアフィード機能テンプレートには、サンプルデータが含まれたデータベースが付属しています。各Adaloデータベースにはコレクションが含まれ、各コレクションには関連するプロパティが付属しています。コレクション間の必要な関係も設定されています。

{% hint style="info" %}
**データベースに関する重要な注意:**

機能テンプレートからコレクションまたはプロパティを**削除**すると、アプリの機能に影響する可能性があります。

機能テンプレートにコレクションまたはプロパティを**追加**すると、アプリの機能に影響しません。
{% endhint %}

以下は含まれるコレクションとそのプロパティの概要です。コレクション名は太字で表示され、説明が含まれています。プロパティには、名前、プロパティタイプ（角かっこ内）、説明が含まれています。

### 基本的なコレクションとプロパティ

#### 👥 **ユーザー**

ユーザーコレクションは、すべてのAdaloアプリに自動的に付属しています。このコレクションには、アプリを使用するすべての人に関連する情報が格納されます。この情報は、ユーザーがアプリを利用するためにサインアップする際に最初に収集されます。

* Email \[テキスト] — ユーザーのメールアドレス。
* Password \[暗号化] — アプリにログインするためのユーザーのパスワード。これは管理者を含め、誰にも表示されません。
* Username \[テキスト] — ユーザーのユーザー名。
* Full Name \[テキスト] — ユーザーの名前と姓。
* Profile Photo \[画像] — ユーザーのプロフィール写真。
* Posts Published \[一対多の関係] — この関連フィールドは、各ユーザーが多くの投稿を持つことを示し、各投稿は1人のユーザーによってのみ公開されます。
* Posts Liked \[多対多の関係] — この関連フィールドは、各ユーザーが複数の投稿を「いいね」できることを示し、各投稿が複数のユーザーに「いいね」されることを示します。
* ブックマークされた投稿 \[多対多の関係] — この関連フィールドは、各ユーザーが複数の投稿をブックマークでき、各投稿が複数のユーザーによってブックマークされることを示します。
* フォロー中 \[多対多の関係] — この関連フィールドは、各ユーザーが多くの他のユーザーをフォローできることを示します。
* フォロワー \[多対多の関係] — この関連フィールドは、各ユーザーが多くの他のユーザーにフォローされることを示します。
* 投稿コメント \[一対多の関係] — この関連フィールドは、各ユーザーが複数の投稿コメントを書くことができ、各投稿コメントは1人のユーザーにのみ属することを示します。

#### 💬 投稿コメント

投稿コメントコレクションには、アプリ内の投稿に対して行われたコメントに関するすべての情報が含まれています。

* テキスト \[テキスト] — コメントのテキスト。
* ユーザー \[多対一の関係] — この関連フィールドは、各投稿コメントが1人のユーザーに属することを示しますが、各ユーザーが複数の投稿コメントを持つことができます。
* 投稿 \[多対一の関係] — この関連フィールドは、各投稿には多くのコメントが付けられることを示しますが、各コメントは1つの投稿に属します。

#### **🖼️ 投稿**

投稿コレクションには、アプリ内の各投稿に関する情報が含まれています。

* テキスト \[テキスト] — 投稿の説明。
* 画像 \[画像] — 投稿画像。
* 投稿所有者 \[多対一の関係] — この関連フィールドは、各投稿には1人の所有者がいて、各ユーザーが複数の投稿を持つことができることを示します。
* いいねしたユーザー \[多対多の関係] — この関連フィールドは、各投稿が複数のユーザーによっていいねされることを示し、各ユーザーが複数の投稿にいいねをすることができることを示します。
* ブックマークしたユーザー \[多対多の関係] — この関連フィールドは、各投稿が複数のユーザーによってブックマークされることを示し、各ユーザーが複数の投稿をブックマークすることができることを示します。
* 投稿コメント \[一対多の関係] — この関連フィールドは、各投稿には複数のコメントが付けられ、各コメントは1つの投稿に属することを示します。

## レイアウト設定

ソーシャルメディアフィード機能テンプレートの各画面はレスポンシブデザインを使用して作成されています。画面はどのデバイスやタブレットでも見栄えが良くなります。

ほとんどの画面はカスタムレイアウトで設計されています。画面に新しいコンポーネントを追加すると、他の画面サイズに影響を与えることがあります。

### レイアウト概要

異なる画面サイズのレイアウトを表示または編集するには — 画面タイトルをクリックしてドロップダウンを表示します。

<figure><img src="https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-0a98b0144050234aedd2b5e3fb1441156412f400%2FLayoutOverview1.png?alt=media" alt="" width="311"><figcaption></figcaption></figure>

このテンプレートのデフォルトビューはデスクトップです。ビルダー内の1つの画面のサイズを変更しても、キャンバス上の他の画面のサイズは変更されません。

#### 非表示コンポーネント

<figure><img src="https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-0c0c6290c48169cd05f8be4e76ce60f303a0cad0%2FLayoutoverview2.png?alt=media" alt="" width="476"><figcaption></figcaption></figure>

各ビューには、デスクトップでは表示されないがモバイルで表示されるコンポーネントがある場合があります。これらは左側パネルでグレーアウトされ、アイコンで示されます。

どのデバイスコンポーネントが表示されているかを確認する別の方法は、こちらのレイアウトタブです:

<figure><img src="https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-2bbea52ddce833a1d274220fbf1f4148195cd901%2FLayoutoverview3.png?alt=media" alt="" width="540"><figcaption></figcaption></figure>

#### カスタムレイアウト

<figure><img src="https://797861279-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4EFNSNZLMs5AZ70x2P33%2Fuploads%2Fgit-blob-5b867757643ee4aa22bb0c83ad9a711eabdb00f8%2FLayoutoverview4.png?alt=media" alt="" width="347"><figcaption></figcaption></figure>

一部のコンポーネントには、画面サイズに基づいたカスタムレイアウトが付属しています。これらの設定を表示するには、レイアウトタブを確認し、カスタムレイアウト設定までスクロールしてください。

## 使用例

* フィットネスクラブ向けのソーシャルフィード
* 編み物グループ、ママグループなど、特定のコミュニティ向けのソーシャルフィード
