まず第一に、あなたはすでにシングルページアプリケーション(Spa)の通常のユーザーである可能性が最も高いです。
シングルページアプリケーションは、ユーザーにとって信じられないほど魅力的でユニークな体験を

いくつかの単一ページのアプリケーションの例は、Gmail、Googleマップ、AirBNB、Netflix、Pinterest、PaypalなどがSpaを使用して流動的でスケーラブルな体験を構築しているようなものです。,

しかし、過去には、コンテンツの管理に関しては、Spaはマーケティング担当者を暗闇の中に残していました。 幸いなことに、SPAと適切なCMSをペアリングして、開発者とマーケティング担当者の両方に必要なレベルのコントロールを提供することが可能になり

シングルページアプリケーションとは何ですか?

シングルページアプリケーション(SPA)は、多くの情報が同じままであり、一度に更新する必要があるのはわずか数個のページです(したがって、名前)。,
たとえば、メールを閲覧するときに、ナビゲーション中にあまり変化がないことに気付くでしょう-サイドバーとヘッダーは、受信トレイを通過するときにそのまま残ります。
SPAはクリックするたびに必要なものだけを送信し、ブラウザはその情報をレンダリングします。 これは、サーバーがクリックするたびにフルページを再レンダリングし、ブラウザに送信する従来のページロードとは異なります。

この作品は、クライアント側の方法は、ユーザーのために速くなければならないロード時間を作り、サーバーがはるかに少なく、より多くのコスト効率の高い送, ウィンウィン。

シングルページアプリケーションアーキテクチャとは それはいかに働くか。

単一ページアプリケーションは、サーバーから新しいページ全体をロードするのではなく、現在のページを動的に書き換えることによってユーザーと対話するweb

このアプローチボイドの中断、ユーザーの経験と歴代のホームページの申請と同様の振る舞いをデスクトップます。

ほとんどのウェブサイトには繰り返しコンテンツがたくさんあります。,

そのうちのいくつかは、ユーザーがどこに行っても同じまま(ヘッダー、フッター、ロゴ、ナビゲーションバーなど)、そのうちのいくつかは、特定のセクション(フィルタバー、バナー)で一定であり、多くの繰り返しレイアウトやテンプレート(ブログ、セルフサービス、上記のgoogleメールセットアップ)があります。
シングルページの用途この反復する

ウェブサイトのあなたのビューが家と木の絵であるとしましょう。 従来の、複数のページのウェブサイトはサーバーのあなたのための全体の映像を塗り、あなたのブラウザに送る。,

Spaは、使用する可能性の高い繰り返しガイドを含むサイトのペイント番号ごとのガイドを提供し、適切なペイント(データとコンテンツ)をパイプしてテンプレートに記入します。

いずれにしても同じツリーが表示されますが、SPAの速度は、”次へ”をクリックしたり、結果をフィルタリングしたり、メールを開いたり、この小さなメタファーで

従来のウェブサイトでは、新しいツリーを要求すると、サーバーは画像全体を再描画して送り返します。,

単一のページアプリケーションでは、サーバーは”こんにちは、私はあなたのための新しいツリーを持っていますが、あなたはすでに家を持っているので、同じ
ペイント作業(ページレンダリング)をサーバーからクライアント(あなた)に転送することにより、ページを動的に書き換えることができます。
これにより、物事はずっと速くなります。,

シングルページアプリケーションの利点

SPAソリューションには、アプリケーションのパフォーマンスと一貫性の向上、開発時間とインフラストラクチャ

プレゼンテーションをコンテンツとデータから分離することにより、開発チームはソリューション全体に統合されながら、異なる速度で作業できます。 スパは、モバイル、デスクトップ、タブレットのための応答デザインを,

シングルタイムファイルロードHTML、CSS、JSのそれぞれ

シングルページアプリケーションは、最初のページロード後、サーバーはあなたにこれ以上HTMLを送信しません-あなたは初めにそれをすべて正しくダウンロードします。

サーバーはシェルページを送信し、ブラウザはユーザーインターフェイス(UI)をレンダリングします。

次に、クリックすると、SPAはデータとマークアップの要求を送り返し、サーバーは必要な原材料を取り戻し、ブラウザはそれを受け取り、ページ全体を更新することなく、更新されたUIインターチェンジの部分をレンダリングします。,
この迅速な互換性は、高度にナビゲートされ、繰り返しテンプレートを使用しているページで非常に便利になります。

サーバーへの余分なクエリはありません

サーバーは時間を費やす必要がないため、&完全な描画を行うエネルギー、Spaはサーバー全体への影響を

高速で応答性の高いフロントエンドが構築されました

上記で説明したより速いパフォーマンス時間とともに、Spaは開発者がフロントエンドをより速く構築することを可能にします。,
これは、Spaのデカップリングアーキテクチャ、またはバックエンドサービスとフロントエンドディスプレイの分離によるものです。

多くのビジネスクリティカルな機能は、バックエンド上でそれほど大きく変更されません。
顧客のログイン、登録、購入、注文の追跡方法は、”見た目”やプレゼンテーションを時々変更する可能性がありますが、その背後にあるロジックとデータのオーケストレーションはかなり一定であり、それを台無しにするリスクはありません。

同様に、生のコンテンツとデータは同じままですが、表示方法は異なります。,
そのバックエンドロジックを切り離すことによって&それがどのように提示されているかからデータを”サービス”に変換し、開発者はそのサービスを表示して使用するためのさまざまなフロントエンドの方法を構築することができます。

分離されたセットアップにより、開発者は基礎となるバックエンド技術とは完全に独立して、フロントエンドを構築、デプロイ、および実験できます。
これらのどのようにしたいユーザ体験を見て、感じ、そしてアップのコンテンツ、データ、機能を通じてサービス,
これはApiを使用して行われ、アプリケーション間でデータをどのように構造化、交換、再構成するかに関する標準的なルールセットです。

このAPIセットアップにより、開発者はビジネスクリティカルなバックエンドテクノロジーを危険にさらすことなく、UIですばやく作業できます。

強化されたユーザーエクスペリエンス

独立して更新できるモジュール式サービス(マイクロサービスアーキテクチャ)として構築される機能が増えるにつれて、それらの表示および使用方法を実験することが容易になります。,
SPAsフレームワークは、魅力的でダイナミックでアニメーション化されたユーザーエクスペリエンスを作成するため

また、多くの人が特定のプログラミング言語(多くのSPAフレームワークはjavascriptを使用しています)で開発するのが好きで、Apiのおかげで、ある言語で構築したSpaは、異なる言語で開発されたバックエンドサービスでうまく動作することができます。

次にこれを読む:5CMSの機能急速に成長している企業が必要

Angular vs React vs Ember vs Vueのシングルページアプリケーション?,

AngularとReact(およびEmberやVueなどの他の多くのもの)は、開発者がSpaを効率的かつ雄弁に作成するために使用するフレームワークです。
簡単に言えば、これらのフレームワークは、多くの開発者が貢献してきた再利用可能なコンポーネントのコレクションであり、定義されたビルドルール
家を建てるように考えるなら、粘土を混ぜて、レンガを乾かして、自分で鋼を採掘して成形するか、他の人がすでに設計しているレンガやパイプを使って、あなたの家をユニークにするものに時間を集中することができます。,

それらの違いについては、私は専門家ではありません(ただし、この人はそうです)が、Spaとそれらをサポートするフレームワークの素晴らしい点は、Apiのおかげで、

なぜシングルページアプリケーションとCmsが歴史的に難しいペアリングだったのか

Spaを使用するとき、開発者は経験を”アプリ”と考えるかもしれませんが、訪問者はまだそれをwebページと考えるかもしれません。,
Spaはディスプレイをいじくり回すために開発作業を必要とするアプリであるため&経験の配信、マーケティング担当者は、デジタル石器時代(別名90年代)に戻って、すべての微調整のための開発の助けを求めなければならない-避けられないボトルネックを引き起こします。

マーケティング担当者が使用する編集ツールを削除

マーケティングチームが依存するCMS編集機能(ライブプレビュー、ドラッグアンドドロップ、WYSIWYG編集など)は、通常、CMSの配信層に関連付けられています。,

Spaでは、配信はSPAによって決定され、コンテンツはApiが読み取ることができる標準的な方法でCMSに単純に保存されます。 SPAはフロントエンドでレンダリングされるため、バックエンドCMSはどのように見えるかわからないため、プレビューをスピンアップすることはできま
だから、CMSユーザーは非常に古いアプローチで立ち往生してしまう-フォームに記入し、指を交差させ、公開を押して、それがライブのように見えるものを見に行く。

paint-by-numbersの例に戻ると、CMSは生のコンテンツ(ペイント)を保存し、SPAにはそのコンテンツの外観に関するpaint-by-numbersガイドがあります。, プレビューにはこのガイドがないため、コンテンツがどのように見えるかがわかりません。

これは、コンテンツの純粋な”ヘッドレス”配信です(別名、CMS配信層を”ヘッド”として持っていません)。 この開発はすでに感のためのマーケターの方を変更したいサイトでもこなせます。

それと並んで、マーケティング担当者は”ページ”で物事を考えるのに慣れていますが、SPAは単一のページであるため、マーケティング担当者が必要とするページ,
新しい”ページ”(SPAの”ルート”)が必要な場合、またはビューの外観を異なるようにしたい場合は、開発者に尋ねる必要があります。

次にこれを読む:ヘッドレスCMS対デカップリングCMS:完全なガイド

コンテンツを再利用することが困難になりました

この問題は、

まず、コンテンツの見た目と保存方法の結合が解除されていない特定のCmsがあります。,
コンテンツのストレージは標準ではないため、SPAではAPIベースの方法では使用できないプレゼンテーションニュートラルフォーマットが望まれています。もちろん、Spaを使用する場合、これは単なる問題ではありませんが、この種のCMSセットアップは、一般的にチャネル間でコンテンツを再利用することを
コンテンツは表示方法(ページベースのシステム)に結びついているため、ウェブサイトに掲載されているFaqは、誰かがスマートウォッチをめくるためにタップするだけではなく、同じコンテンツを二つの異なる方法で保存する必要があります。,
SPAの必要性は、コンテンツベースのCMSが正常に動作するように、生のコンテンツを引っ張って表示できるようにしたい。

SPA側では、難しさは多くのウェブサイトがハイブリッド設定になるという事実から来ています。
あなたはスパとしていくつかの部分をしたいかもしれませんが、あなたは他の人が(多くの場合、SEOのためのより良い)伝統的な方法で設定したいかもしれませんし、これらの間に凝集感が必要です。
あなたのセットアップは、コンテンツの二つのバケツであれば、伝統的なサイトとスパのための作品は、その結束が壊れるだろう。, すべてを渡って働く内容を必要とする。

パーソナライゼーション/関連性で難しい

Spaは”サービス”の方法でコンテンツを取得するので、コンテキストのないコンテンツの少しナゲットです。
それに加えて、多くのCmsはページベース(SPAでは役に立たない)またはクライアント側でパーソナライズを行い、これらのjavascriptパーソナライズルールはSPA javascriptの上ではあまりうまく機能しません。 パーソナライゼーションキッチンであまりにも多くの料理人。

マーケティング担当者は、スパの世界で永遠に運命づけられていますか?

もちろんそうではありません!, 鉱泉の使用の準備ができた建築があるCMSを単に必要とする。

APIベースのコンテンツをプレゼンテーションから切り離し、SPAと連携してライブプレビューを提供できます&編集ツール、ハイブリッドセットアップをサポートし、サーバー側でパーソナライゼーションを行います。
以下では、ブルームリーチがそれを行う方法を説明します。

  • Bloomreachが開発者やマーケターにシングルページアプリケーションの使いやすさを提供する方法

  • シングルページアプリケーションのパーソナライゼーションとハイブリッドサポート