2017-06-08 33 views
-1

私は新しいNodejの開発者です。私はreactとexpressを使ってWebアプリケーションを作成する方法についていくつか理解したかったのです。ReactとExpressを使ったWebアプリケーション

私は次の操作を実行したい:

- >私のWebアプリケーションでは、私はこれらの静的なページをする必要があることを理解し、私の読書から私たちについてのページなど、ホームページを含め5つの静的なページを中心にしていますSEOの最適化のためにサーバー側に表示されます。

- 私も完全で行われるユーザーのダッシュボードを作成しています>

ユーザーがログイン一度単一ページのアプリケーションとして機能するように反応する - >第三に、私はまたの部分を持っていると思います。 Webアプリケーションは、URLに基​​づいて異なるコンテンツをレンダリングします。たとえば、mywebsite/test1はtest1についてコンテンツをレンダリングし、mywebsite/test2はtest2についてコンテンツをレンダリングする必要があります。私はこれが反応を通じて行うことができることを理解するが、私はまた、これらのURLをSEOにしたいので、コンテンツをサーバサイドでレンダリングする必要がある。

どうすればそのようなアプリケーションを設定できますか?私の最初の考えは次のとおりです:

私は5つの静的ページに定義されたルートを持つエクスプレスアプリを持っています。私はこれらの5ページのために直接HTMLをレンダリングすることができます。

ダッシュボードでは、ルータに反応/反応するリクエストを転送する明示的なルートを用意してそこから取得できます。

同様に、3番目の部分については、反応コンポーネントに誘導するためにエクスプレスルートを使用していました。

これは正しい方法ですか?

ありがとうございます!私が何かを逃しているか、何かについて概念的に間違っているかどうか私に知らせてください。

+0

この質問はあまりにも広すぎます。投票を終了する。 – tommyd456

答えて

1

私が理解しているのは、あなたが同種のアプリのようなものをやっているということです。

  1. 静的なページは、ビルド(index.htmlを、about.html、など)で事前にレンダリングすることができ
  2. 要求されたURLは、すなわちで始まっている場合は
  3. (すなわち/assets)サブフォルダから静的ファイルを提供/dashboard、ダッシュボードを提供表現しますダッシュボードで

    http://example/dashboard/some/view =>/dashboard.html

  4. 、あなたはおそらく01を使用します。 あなたのルーターは、所望の部品にURLをディスパッチします:

    import { Route } from 'react-router'; import SomeView from 'app/components/some/SomeView.jsx'; <Route path='/dashboard/some/view' render={SomeView} />

あなたはGitHubまたは物品hereまたは同型のアプリケーションに関連するhere上の例の多くを見つけることができます。

関連する問題