Backbone.js apps with Authentication Tutorial
At my current company I am working on my first large-scale production backbone.js app and I couldn’t be happier. After using backbone.js for a few months I have caught the vision and I am becoming more and more proficient. But every once and a while I still run into problems I would consider basic, but I can’t seem to find much help on the interwebs. Authentication with backbone.js apps was one of
しまもん | はすみきん | Backbone.jsでOAuth2.0のためのAuthorizationヘッダを仕込む
フロントにBackbone.js（今回の例ではMarionetteJSでも同様です）、バックエンドにRailsなどによるAPIサーバという構成を考えましょう。 OAuth2.0には、アクセストークンをAuthorizationヘッダに入れて認証状態をサーバに通知するという仕様があります（これ以外の仕様もありますがここでは触れません）。これを全リクエストに自動でセットするにはどうしたらよいでしょうか？ Backbone.Modelのインスタンスは、#fetch()、#save()、#destroy()のメソッド発行時に内部でかならず#sync()という関数を通ります、ですからこの部分でAuthorizationヘッダをセットするようにオーバライドしてあげればいいのです。 ファイル名：AuthedModel.coffee # RequireJSを利用しています define [ "backbo
JavaScriptフレームワーク比較用サンプルアプリ 「TODO-Module-Backbone」を作る - フルスタックエンジニアに
前回 はTODO-ModuleのクライアントをAngularJSで作成しましたが、 今回はBackbone.jsを使って作っていきます。 Backbone.jsはAngularJSとくらべて薄いフレームワークで、シンプルな作りになっています。 そのため自由度が高いフレームワークになっています デモアプリとソースコードはこちらに公開しています。 TODO-Module-Backbone ソースコード 前回同様このクライアントアプリの動作確認にはAPIが必要なので、 前回までの記事を参考にローカルで動作させておくかか、 デモアプリのAPIを利用してください。 TODO-Module デモアプリ www.full-stack-engineer.com www.full-stack-engineer.com 動作環境 OS X Yosemite node v0.10.37 npm 2.7.3 前回
快適アプリ開発Backbone.Marionette | 第1回 Backbone.Marionetteとは
それぞれ、このシリーズの後続の回で詳しく触れていきますが、Application、AppRouter、ControllerはViewやModelの間を取り持つ機能を担っています。ItemView、CollecttonView、CompositeView、Region、Layoutはそれぞれ異なった役割で、View周りのコーディングに役立つ機能を持っています。 Marionette.jsにできること Marionette.jsから得られる恩恵は大小さまざまで、細かいものを挙げていくときりがないほどですが、大きなものを挙げるとすれば、次のような点があります。 モジュール化のサポート 開発者が書かなければならないコード量の減少 機能の部分的な利用 モジュール化のサポート Marionette.jsの機能の中で大きなものとして、モジュール化のサポートがあります。モジュール化というのは、ある機能を表
試して学ぶ Backbone.js 入門のまとめ - Taste of Tech Topics
皆さん、こんにちは。id:KenichiroMurataです。 今回はKnowledge Noteにて連載させて頂いていた 「試して学ぶBackbone.js入門」が全５回分公開されたため、そのまとめをしたいと思います。 記事のコンセプト タイトルに含めた通り、実際にコードを書いて試してみることでBackbone.jsの理解を深めることを一番の目的としています。 なので、ぜひ実際に記事の中に出てくるコードを書いて、動かして、コンソールのログや動作を確認することをおススメします。 各記事の概要 第１回 試して学ぶBackbone.js入門 Backbone.jsの概要から、インストール方法、Model、Collectionの基本を説明しています。 目次 はじめに セットアップ Modelの基本 Collectionの基本 Collectionの便利な関数 第２回 試して学ぶBackbone.
普通のrailsアプリのBackboneにMarionette付けて思った事 - lxyuma BLOG
以前書いた記事の反省を元にMarionetteに移行した。 思った以上に快適！ 大規模になったらMarionette.js使えとか書いているのは嘘で、普通にBackbone使うときは、初めから使うべき。 Backboneで一番恐ろしいのは、各現場/各開発者毎に異なるオレオレ実装。オレオレ実装作るコストに加え、使う人の思わぬバグや学習コストやスイッチングコスト等諸々考えると、特別な理由がない限りMarionetteみたいな既存のframework使うべき。 あんど。データバインディングを提供してくれる、stickitと一緒に使うと、より一層効果的。 めっちゃ、ソースコードの量が減って、ソースの意図が明快になった。悩みも少ない。工数も勿論減る。 ここから、幾つか思った事を、サッカー見ながらお酒飲みながら、ダラダラ書く。※ちなみに、日本vsオランダ戦見てる。 railsアプリでのjs周辺の作りの
Backbone.js入門 | Webエンジニアブログ
Modelの動作確認からはじめるBackbone.js HTML Backbone.jsの入門記事です。Modelを定義してBackbone.jsのメソッドを実際に使用してみます。 アプリケーションのHTMLを作成します。 <!DOCTYPE html> <html> <head> <title>Backbone.jsの動作確認</title> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" type="text/css"> </head> <body> <h1>Engineers List</h1> <ul></ul> <script src="https://code.jquery.com/jquery-2.1.1.min.js"></s
BACKBONE.JSによるWebアプリケーション開発について
フロントエンドとJavaScript JavaScriptのMV*向けライブラリ BACKBONE.JSによるWebアプリケーション開発について 「オープンソースカンファレンス 2013 福岡」の HTML5と最近のフロントエンド事情で発表した資料です。 Read less
いまさら聞けない！？Backbone.js 超入門
フロントエンドとJavaScript JavaScriptのMV*向けライブラリ BACKBONE.JSによるWebアプリケーション開発について 「オープンソースカンファレンス 2013 福岡」の HTML5と最近のフロントエンド事情で発表した資料です。
JavaScriptエンジニア養成読本Backbone.js特集の訂正 - text.ykhs.org
先日発売されたJavaScriptエンジニア養成読本ですが、特集1のBackbone.jsの記事について、Underscore.jsのバージョンが執筆時の 1.6.0 から 1.7.0 に変わっている関係で現状だといくつかのコードが動作しないようでした。確認漏れですすみません…。 _.template()が常にコンパイル済みのテンプレートを持った関数を返すようになった関係で文中のサンプルにある次のようなコードが動かなくなっています。
「JavaScriptエンジニア養成読本」でUnderscore.jsの_.templateメソッドを使うところが動かない - 主に技術的なことを書くブログ
JavaScriptエンジニア養成読本 [Webアプリ開発の定番構成Backbone.js+CoffeeScript+Gruntを1冊で習得! ] (Software Design plus) 作者: 吾郷協,山田順久,竹馬光太郎,和智大二郎出版社/メーカー: 技術評論社発売日: 2014/10/18メディア: 大型本この商品を含むブログ (3件) を見る 「JavaScriptエンジニア養成読本」というムック本（？）を読んでまして、JavaScriptもできてないので、かなり背伸びしてBackbone.jsを紐解いていたんですけども。 どうやっても掲載されているサンプルコードが動かず。ここ2、３日、毎日コンソールのエラーを見ては、頭を抱えていました。 どうやら、Underscore.js関係のところで Uncaught ReferenceError: firstName is not d
Backbone.js ではじめるクライアントサイド MVC プログラミング | CYOKODOG
MVC と言えば Apache Struts をはじめとするサーバサイド・フレームワークを想像しますが、 今回は JavaScript による大規模開発の際に採用されるクライアントサイド MVC フレームワーク「Backbone.js」の使い方についてまとめてみました。 (厳密にはクライアントサイドの場合、MVC とは呼ばず MVVM とか MV* とか呼ばれてるようです。) 前提 Backbone.js の構成を簡単に言ってしまうと 単一データの管理を行うモデル 複数件のモデルの管理を行うコレクション 画面の管理を行うビュー の３つの主要モジュールを軸に構成されており、Underscore.js、jQuery(Zepto）に依存するかたちで動作するようになっています。 利用の際は、underscore.js、jquery.js、backbone.js の順で読み込みます。 //cdnjs
Backbone.js を基礎からやってみよう - akiyoko blog
JavaScript製の MV*フレームワークと言えば、世間では「React.js」や「AngularJS」などの SPA (Single Page Application) が話題を集めていて、「Backbone.js」と言うと今更感がありますが、黒魔術の少ない薄いラッパーとしての Backbone.js は SPA の学習教材として最適なのではないかと考え、スキルセットの一つとして基礎からやってみようと思い立ちました。 ・・と思い立ったのが、半年ほど前。 書き途中のまま止まっていたこの記事を最近発見したので、ひとまず最後まで書いてアップしてみることにしました。 基本は、 に沿って学習しました。 なお、古い情報がいろいろあったので、2013年以降の情報を中心にまとめています。 1. JavaScript まずは、基礎中の基礎、JavaScriptの仕組みをしっかり理解するところから始めて
FuelPHPのRestコントローラでBackbone.jsからPOSTのデータを受け取る方法 | Bamboo lath 日々の記録
今頃「Backbone.jsアプリケーション開発ガイド」を 写経してみているのですが、チュートリアル2 「ライブラリ（RESTを使ったBackbone.jsアプリケーション）」 ではまったのでメモ。 バックエンドをFuelPHPのRestコントローラで 記述していたのですが、Backbone側でcollection.create（model.save）した 際に$_POSTが空っぽでデータが受け取れなかった。 調べてみると同様の症状を発見。 Backbone.emulateJSON = true; 上記を記述すればバックエンド側で以下のように取得できるようになった。 $model = json_decode(Input::post('model')); Backbone.jsには以下のように書いてありました。 // Turn on `emulateJSON` to support lega
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
忙しい人のためのBackbone.jsとAngular.js入門
Home
実践Backbone.Marionette 現場の悩みと解決まで
Backbone.jsを使ってみて気になったこと - Give it a shot
Nyle Engineering Blog