5

私はかなりの入門チュートリアルを読み(絶対初心者、完全に学ぶ、2つのコードスクールバックボーンコースの大部分を含む)、バックボーンが提供する可能性を完全に見ることができます。しかし、理解力の電球はまだ完全にはオンになっていない...単純なtodoアプリである例の大部分は、より複雑なプロジェクトで作業しているときよりもはるかに些細なことのように見えると思います。

私の実験はある程度まではうまくいきましたが、次の一連のスキャッターショットの質問について回答やフィードバックを得ると、多くのフラストレーションを軽減し、学習曲線を希望の方向に進めることができると思います。詳細な性質の例に関連するスニペットを含めようとしました。

1)ルーターは素晴らしいですが、/は重い物を持ち上げる場所ではありませんか?

次のルーターは、ユーザーを最初のページの読み込みから特定のルート(検索)に移動するように機能します。このルートでは、TodoMVCの例のapp.jsと同様に、最後に読み込まれたjsでSearchBoxViewがインスタンス化されます。ただし、SummaryResultsViewに示されているようにルーターでビューを設定しようとすると、「コンストラクターではありません」というエラーが生成されます。

var Workspace = Backbone.Router.extend({
    routes: {
        '': 'default',
        'search': 'searchBox',
        'summary': 'summary',
        'detail': 'detail',
    },

    default: function() {
        console.log("Router: Default");
        track.Router.navigate("#search", { 
            trigger: true,
            replace: true
        });
    },

    searchBox: function () {
        console.log("Router: Search");
    },

    summary: function () {
        console.log("Router: Summary");
        new track.SummaryResultsView({ el: $("#summary #results")});
    },

https://github.com/thomasdavis/backbonetutorials/blob/gh-pages/examples/modular-backbone/js/router.jsを見つけたところ、ルーターの初期化が期待どおりに動作しているようです。次にそのアプローチを試みます。

2)レンダリングで多くの状態ロジックを構築するメインページビューが必要ですか?

上記のルーターで私が目指していたのは、各ルートに、コレクションの結果に基づいてプレゼンテーションを表示/非表示または変更する多数のビューがあることです。状態の変化に応じてレンダリングするビューを設定するのは良い場所のように思えました。TodoMVCの例では、app.jsビューのレンダリング関数が同等のロジックの多くを実行します。

3)require.jsなしの外部ファイルのアンダースコアテンプレート

最終的にrequire.jsを含めることができると確信していますが、学習曲線の一部を単純化するために、それなしで開始したいと考えていました。また、b / cテンプレートは、別のCMSからフィールドタイトルを取得しますが、AMDでどれだけうまく機能するかは(まだ)わかりません。

4)カラーボックスやデータテーブルなどのプラグインの依存関係を減らすのに役立ちますか?

私がBackboneで取り組んでいる概念実証項目の1つは、これらのjQueryプラグインで動作するように明示的に記述されたかなりの量のプレゼンテーションコードを備えたsmediumサイズのアプリです。悪い言い方ではありませんが、バックボーン構造で同様の機能を記述することは、それが何をしているのかを理解するために、もう少し保守しやすいか、少なくとも読みやすいようです。念のために言っておきますが、旅行中にバックボーンテーブルソーター(投稿用のリンクがありません)を見つけましたが、プラグインとの緊密に結合されたコードになるかどうかは(まだ)わかりません。

ありがとう!

4

1 に答える 1

5

ルーター

確かにそれらは重いものを持ち上げるのに使用できます - 以前に聞いたことがあると思いますが、Backbone は、選択した上に構築するための必要最小限のものを提供するだけです。

をルーターSummaryResultsViewの変数に設定します。Workspaceそうしないと、電話をかけるたびにWorkspace.summary()ゴーストビューがぶらぶらします。

ルーターで定義されているtrack.Router.navigateルートと同じルートを共有しているように見えるため、何をしているのかわかりません。これにより、両方のルートが呼び出されます。#searchWorkspace

アプリケーションの異なるセクション間でコードを分割するのに役立つように、常に複数のルーターを作成できます。メインルーターから始めて、子ルーターを持つことは、通常、私が試み、目指していることです。

メインページの閲覧数

繰り返しますが、この方法を好む人もいれば、ルーターから開始するのが好きな人もいます。大きなメイン ビューがある場合は、同じことを繰り返さないように、小さなビューに分割してみてください。

ビューのキャッシュは便利です。そのため、(アプリケーションの起動時に) 1 回だけ作成されるメイン ビューでは、次のことができます。

var MyView = Backbone.View.extend({
    childView: null,

    toggleChildView: function() {
        if (this.childView) {
          this.childView.toggle(); //Toggle show/hide
        } else {
          this.childView = new ChildView({model: someModel});
        }
    }
});

アンダースコア テンプレート

実際、require.js を使用すると学習に役立つことがわかりました。これは、アプリケーションのサイズが大きくなり始めたときに確実に役立ちます。TodoMVC アプリの require.js 実装があります (まだご存じない場合)。

AJAX 呼び出しを使用してテンプレート ファイルを取得するため、require.js (テキスト プラグイン) がないと外部テンプレートを使用できません。もちろん、独自の AJAX 呼び出しを設計してテンプレート ファイルを取り込む場合を除きますが、それを行うにはかなり長い道のりのように思えます。

テンプレート ファイルは静的です。別の CMS からプルするという意味がよくわかりません。

余談ですが、require.js 最適化を使用すると、実際にはテンプレートがインライン化されるため、1 つのファット JS ファイルに含まれます。

移植コード

jQuery プラグインで動作する非常に一般的なバックボーン モデル (私は jQuery UI の日付ピッカー用のものを持っています) を見つけたら、大騒ぎせずにアプリケーション間で非常に簡単に移植できます。これは、require.js を別のファイルとして使用すると高速化されます (FTW をコピーして貼り付けます)。

お役に立てれば!

于 2013-03-08T22:59:11.500 に答える