反応を使用して複数の役割を持つ快適なWeb​​アプリケーションを構築する

Question

私は100％安静でなければならない単一ページのWebアプリケーションを作成しています（これは初めてです）。だから私は、反応を使って複数の役割のUIをどのようにレンダリングするのか決定するのが難しいです。

通常のユーザーと管理者がログイン/認証後にサーバーがメインアプリケーションページにリダイレクトされ、メニューが表示されます。問題は、管理メニューに余分なオプションがあるはずなので、私はこれを処理すべきかどうか考えています。

リダイレクト（user.html/admin.html）に2つの異なるファイルを設定する必要がありますか？欠点は、バンドルの1つに他のコンポーネントが持つものと余分なコンポーネントがあるため、おそらくコードが重複することになります。

デフォルトでnoneに設定されているコンポーネントの場合は、管理者の場合はそれ自体が表示されますか？欠点は、ユーザーがJSの知識を持っていれば、コードを検索して管理者が何ができるのかを知ることができるということです（実際には何も起こらないようにサーバーに認証があることはもちろんです）。

また、jsonを介してメニューリストを取得することも考えていました。追加オプションをクリックすると、表示されるコンポーネントのスクリプトが取得され、何らかの理由でReactDOM.renderに結果が表示されますそれが可能かどうか知りません、おそらく私は思っています）。また、私はReact-Routerについて聞いたことがありますが、十分な情報が見つからなかったので、おそらく私が必要なのでしょうか？

これがどのように正しく行われたかについてのアイデアや例は、本当に役に立ちます。前もって感謝します。

Answer 1

あなたのコードは絶対に複製しないでください。最初に私は尋ねるでしょう、本当に知っている問題があります何が管理者が可能ですか？私はそれについて個人的に心配しません。

React Routerはクライアント側のルーティングに使用され、適切なReactアプリケーションを使用する場合はクライアント側のルーティングが必要です。基本的に最初のAppルートとその後のAPI呼び出しにのみサーバーを使用します。

引数をフィードに戻してボタンコンポーネントに確実に渡すことは可能です。あなたの小道具は、ボタンをレンダリングするために必要なすべての引数を持つ「buttonList」プロパティが含まれている可能性が...しかし、そのボタンの操作が簡単で、それは限り、管理機能が行くようだ場合にはだけは本当に実現可能な難読化です。サーバーから渡すことができる引数で具体的なものを取り入れるジェネリックコンポーネントを書くことは、これを行うための実際の方法です。

あなたがユーザーから隠す必要があるものと、それが本当に十分であるかどうかを判断する重要性があります。