エントリの簡単なリストを取得する

Question

これはbackbone.jsに関する非常に基本的な質問です。私はjavascript/backbone.jsの完全な初心者です。私はいくつかのチュートリアルを読んでいますが、かなり単純なタスクを行うことはできません： "データベースからエントリーのリストを取り出す"。

アプリケーション全体がGoogle App Engineにあります。データベースにはすでにいくつかのエントリ "words"が含まれていますが、私はFlaskを使ってエントリのJSON表現を送ります。ここで

は、私はこの作業のために使用する関数です：

@wordbook.route('/words', methods=('GET', 'POST')) 
def wordlist(): 
    return retrieve_words() 


def retrieve_words(): 
    content = json.dumps([word.to_dict() for word in Word.all()]) 
    response = make_response(content) 
    response.mimetype = 'application/json' 
    return response 

だから、私の知る限り、プログラムが作業する方法を理解し、自分の基幹アプリケーションは、Webサイトのルートになり、彼がします「/ words」URLに、JSONと呼ばれる特定の形式でデータベースからデータを取得して、アプリケーションが自由に使用できるようにしてください。

私は出力が追従しているので、URL http://localhost:8080/wordsは、正しいと仮定します。

[{"word": "keyboard", "key": "ahB2b2NhYnVsYXJpdW0tYXBwcgoLEgRXb3JkGAEM", "language": "en", "nature": "noun", "usage": "Plural keyboards", "gender": ""}, {"word": "keyboard", "key": "ahB2b2NhYnVsYXJpdW0tYXBwcgoLEgRXb3JkGBoM", "language": "en", "nature": "verb", "usage": "Regular verb", "gender": ""}, {"word": " mouse", "key": "ahB2b2NhYnVsYXJpdW0tYXBwcgoLEgRXb3JkGB4M", "language": "en", "nature": "noun", "usage": "Plural mousemice", "gender": ""}, {"word": " mouse", "key": "ahB2b2NhYnVsYXJpdW0tYXBwcgoLEgRXb3JkGDIM", "language": "en", "nature": "verb", "usage": "Regular verb", "gender": ""}, {"word": " hard", "key": "ahB2b2NhYnVsYXJpdW0tYXBwcgoLEgRXb3JkGDoM", "language": "en", "nature": "adj", "usage": "Comparative harder, superlative hardest", "gender": ""}...] 

ウェブサイトのルートで、私は（私が最初に非常に単純なタスクを開始したい）空白のWebページを持っています、単純なjavascriptファイル（依存関係、json2、jQuery、アンダースコア、バックボーンと一緒に）

私はjavascriptの初心者ですので、構文はPythonで実際に知っているものと比較的似ているので、私はCoffeescriptを使用しました。学習曲線はそれほど急峻ではないと思いました。ここに私のコーヒーファイルがあります：

class Word extends Backbone.Model 

class WordList extends Backbone.Collection 
    model: Word 
    url: 'words' 

Words = new WordList 

class WordView extends Backbone.View 
    tagName: 'p' 
    render: -> 
     word = @model.get 'word' 
     $(@el).html word 
     @ 

class WordListView extends Backbone.View   
    el: $ 'body' 
    initialize: -> 
     _.bindAll @, 'addOne', 'addAll' 
     Words.bind 'add',  @addOne 
     Words.bind 'refresh', @addAll 
     Words.fetch() 

    addOne: (word) -> 
     view = new WordView model: word 
     @.$ 'body'.append view.render().el 

    addAll: -> 
     Words.each @addOne  
-> WordList = new WordListView 

私がここで書いたことを要約すると、Wordと呼ばれるモデルとすべての単語を含むコレクションが作成されています。このコレクションは、JSON URLを使用してサーバーからすべてのデータを取得する必要があります。 各単語は、段落pの独自の特定のビュー（WordView）でレンダリングできます。 アプリケーションビュー（WordListView）では、単にaddアクションをaddOne関数にバインドするだけでなく、addAll関数のリフレッシュアクションをバインドします。そして、私はこの時点ですべての言葉を取得しようとします。 addOne関数は、対応する単語の新しいビューを作成し、その単語を含む新しい段落を本文に追加します。新しい単語が追加されるたびに、バインドによってaddOne関数がトリガーされ、各単語がレンダリングされます。

私は考え方が正しいかどうかは分かりません。

Answer 1

質問が正しく理解されている場合、Words.fetch()を実行するとWordsが入力されない理由を理解しようとしています。

1. WordList.urlの値は何ですか？あなたの例では"/words"にする必要があります。
2. fetch methodは（ブラウザを仮定すると、デベロッパーコンソールを持っている）次のようにデバッグできることを意味することに

... successとerrorコールバックを受け入れる：

Words.fetch 
    success: (collection, response) -> console.log "success: #{response}" 
    failure: (collection, response) -> console.log "failure: #{response}" 

あなたはそれを行うと、どのようなあなたはコンソールで見ますか？