Two-Way Data Binding
Let’s build a temperature converter app in Backbone, React, Angular, Meteor and vanilla JavaScript. Vanilla JS °C ⇄ °F Vanilla JS is our baseline. Input values are synchronised using two event handlers, one on each input field. function c2f(c) { return 9/5 * c + 32 } function f2c(f) { return 5/9 * (f - 32) } var celsius = document.getElementById('celsius') var fahrenheit = document.getElementById(
データãƒã‚¤ãƒ³ãƒ‡ã‚£ãƒ³ã‚°ã«ã¤ã„ã¦Vue.js㨠Backbone.stickitを比較ã™ã‚‹ - mizchi's blog
ã“ã‚Œã¯ä¼šç¤¾ã§vue.jsを採用を説得ã™ã‚‹ãŸã‚ã®è³‡æ–™ãªã®ã§stickitを罵倒ã™ã‚‹ vue.js http://vuejs.org/ backbone.stickit http://nytimes.github.io/backbone.stickit/ Backbone.stickitã¨Vue.jsã®æ¯”較 「#menuを押ã—ãŸã‚‰å³ã«100pxå‹•ãã€ã¿ãŸã„ãªã‚³ãƒ¼ãƒ‰ã‚’書ã„ã¦ã¿ã‚‹ã¨ã™ã‚‹ã€‚ template関数ã¯Jadeテンプレートを展開ã™ã‚‹é–¢æ•°ã ã¨æ€ã£ã¦ã»ã—ã„ Backbone.stickit ã®å ´åˆ class MenuView extends Backbone.View initialize: -> @model = new Backbone.Model() @render() render: -> @$el.html template(""" #menu.js-open """) @stic
Backbone.js
Backbone's only hard dependency is Underscore.js ( >= 1.8.3). For RESTful persistence and DOM manipulation with Backbone.View, include jQuery ( >= 1.11.0). (Mimics of the Underscore and jQuery APIs, such as Lodash and Zepto, will also tend to work, with varying degrees of compatibility.) Getting Started When working on a web application that involves a lot of JavaScript, one of the first things yo
Ractive.js入門 - lxyuma BLOG
ã“ã‚Œã¯ã€jsCafe18ã§è©±ã—ãŸSlideã§ã™ã€‚ æ¦‚è¦ ã“ã‚Œã‹ã‚‰ã€ã€ŒRactive.jsã€ã¨ã„ㆠjs上ã§ReactiveãªUIã‚’ ã¨ã¦ã‚‚simpleã«buildã™ã‚‹ãŸã‚ã®libraryã®è©±ã‚’ã—ã¾ã™ 目次 reactive programming ractive.js ä»–ã®frameworkã¨ã®æ¯”較 Backboneã«å…¥ã‚Œã¦ã¿ã‚‹ ãã‚‚ãã‚‚Reactive Programmingã¨ã¯ï¼Ÿ å¤ãã¯ã€2003å¹´é ƒã‹ã‚‰æ—¥æœ¬ã®blogã§ã‚‚å¹¾ã¤ã‹è¨€åŠã•ã‚Œã¦ã‚‹æ¨¡æ§˜ 去年ã€æ›´ã«è‰²ã€…ã¨å‹•ããŒå‡ºã¦ããŸã€‚ 2013/7 ガートナーã®2013å¹´ã®reportã§æ‰±ã‚ã‚Œã¦ã‚‹ 2013/9 リアクティブマニフェストãŒå‡ºãŸã€‚ã“れ訳ã•ã‚Œã¦ã‚‹æ–¹ãŒã„ãŸã€‚ 2013/9 infoQã®è¨˜äº‹è¦‹ã‚‹ã¨å¤§ä½“ã®æµã‚Œã‚„概è¦ãŒåˆ†ã‹ã‚‹ ãƒã‚ºã‚Šã¨æ„味ã®åºƒãŒã‚Š ãªã‚“ã‹å¾ã€…ã«ãƒã‚ºã‚Šæ„ŸãŒã‚ã‚‹ ä»–ã®ãƒã‚ºã‚Šãƒ¯ãƒ¼ãƒ‰(cloudç‰)ã¨åŒã˜ã‚ˆã†ã«æ„味ãŒåºƒç¾©ã«ã€ã‚ˆã‚ŠæŠ½
Marionette.js in Single Page Application
Marionette.jsã®View周りã«ã¤ã„ã¦ã‚’ä¸å¿ƒã«Single Page Applicationを作るã¨ãã®è©±
Marionette.js in Single Page Applicationã¨ã„ã†è©±ã‚’ã—㟠- 車輪をå†ç™ºæ˜Ž / koba04ã®æ—¥è¨˜
最近Marionette.jsを使ã£ã¦ã„ã‚‹ã®ã§ãã®è©±ã‚’社内勉強会ã§ã‚„ã£ãŸè³‡æ–™ã§ã™ã€‚ https://speakerdeck.com/koba04/marionette-dot-js-in-single-page-application SinglePageAppã‚’Backbone.jsã§ã¤ãã‚ã†ã¨ã™ã‚‹ã¨ã©ã†ã—ã¦ã‚‚View周りã§ç‹¬è‡ªå®Ÿè£…ã‚’ã›ã–ã‚‹ã‚’å¾—ãªãã¦ã€ã§ã‚‚オレオレフレームワークã¯ä½œã‚ŠãŸããªã„ãªãã¨æ€ã£ã¦ãŸã¨ã“ã‚ã€Marionette.jsãŒã„ã„æ„Ÿã˜ã«ã‚„ã£ã¦ãã‚ŒãŸã®ã§ãã®è¾ºã‚Šã«ã¤ã„ã¦æ›¸ã„ã¦ã„ã¾ã™ã€‚ 蛇足(Marionette.jsã¨Angular.js) Marionette.js å‰ã®ãƒ—ãƒã‚¸ã‚§ã‚¯ãƒˆã§ã¯Angular.jsを使ã£ã¦ã„ã¦ä»Šå›žBackboneç³»ãªMarionette.jsを使ã£ã¦ã¿ã¦ã®æ„Ÿæƒ³ã¨ã—ã¦ã¯ã€Marionette.jsã¯View周りもå«ã‚æ§‹é€ åŒ–ã—ã¦æ›¸ãã“ã¨ãŒå‡ºæ¥ã¦ãƒ¡ãƒ¢ãƒªç®¡
BackPlug.io - Backbone Plugins
Listing all Backbone.js plugins
Backboneã¨Angularを比較ã™ã‚‹
Spring Bootã«ã‚ˆã‚‹APIãƒãƒƒã‚¯ã‚¨ãƒ³ãƒ‰æ§‹ç¯‰å®Ÿè·µã‚¬ã‚¤ãƒ‰ 第2版 何åƒäººã‚‚ã®é–‹ç™ºè€…ãŒã€InfoQã®ãƒŸãƒ‹ãƒ–ック「Practical Guide to Building an API Back End with Spring Bootã€ã‹ã‚‰ã€Spring Bootを使ã£ãŸREST API構築ã®åŸºç¤Žã‚’å¦ã‚“ã 。ã“ã®æœ¬ã§ã¯ã€å‡ºç‰ˆæ™‚ã«æ–°ã—ãリリースã•ã‚ŒãŸãƒãƒ¼ã‚¸ãƒ§ãƒ³ã§ã‚ã‚‹ Spring Boot 2 を使用ã—ã¦ã„る。ã—ã‹ã—ã€Spring Boot3ãŒæœ€è¿‘リリースã•ã‚Œã€é‡è¦ãªå¤‰...
Backbone Antipatterns - Shine Solutions Group
Backbone.js deserves a lot of credit for bringing MVC to mainstream client-side Javascript development. That said, many beginners ask what the ‘right way’ of doing something with Backbone is. The bad news is that there’s not necessarily a ‘right way’ – it all depends on the problem you are trying to solve. The good news is that there are definitely some ‘wrong ways’ that you should avoid on your w
BackboneマンãŒAngular勉強会ã„ã£ã¦ããŸã‘ã©ãã‚“ãªã«å¥½ãã«ãªã‚Œãªã‹ã£ãŸè©± #ng_jp - mizchi's blog
最åˆã«åƒ•ã®ãƒã‚¸ã‚·ãƒ§ãƒ³ã¯è¡¨æ˜Žã—ã¦ãŠãã‘ã©ã€ä»Šã¾ã§backbone.js, ã¨ã„ã†ã‹ãã®ãƒ©ãƒƒãƒ‘ーã§ã‚ã‚‹chaplin.jsã¹ã£ãŸã‚Šã®ç’°å¢ƒã§é–‹ç™ºã—ã¦ã¦ã€ä»Šã®ãƒ—ãƒã‚¸ã‚§ã‚¯ãƒˆã‚’ゼãƒã‹ã‚‰ä½œã‚Šç›´ã™æ©Ÿä¼šãŒã‚ã‚‹ã®ã§æ¬¡ãƒãƒ¼ã‚¸ãƒ§ãƒ³ã®ãŸã‚ã®ãƒ©ã‚¤ãƒ–ラリé¸å®šã®ãŸã‚ã«ã¨ã‚Šã‚ãˆãšæ¯”較ã¨ã—㦠angularを試ã—ãŸè¦‹ãŸç¨‹åº¦ã®äººé–“ãªã®ã§ã€æ·±ãã¯ç†è§£ã—ã¦ãªã„。 Angularã®ãƒ¡ãƒªãƒƒãƒˆ 僕ã®æµ…ã„ç†è§£ã¨å‹‰å¼·ä¼šã§ã®è©±ã‚’ç·åˆã—ãŸæ„Ÿã˜ レールã«ä¹—り切ã£ãŸæ™‚ã®é–‹ç™ºåŠ¹çŽ‡ãŒåŠç«¯ãªã„ レールãŒã—ã£ã‹ã‚Šæ•·ã‹ã‚Œã¦ã„ã‚‹ã®ã§é–‹ç™ºè€…ã®èƒ½åŠ›å·®ãŒå•é¡Œã«ãªã‚‰ãªã„ HTMLãŒãƒ†ãƒ³ãƒ—レートãªã®ã§æ„味的ãªä¹–離ãŒå°‘ãªã„ ビューモデルã«å¯¾ã™ã‚‹æ“作ãŒä¸€è²«ã—ã¦ã„ã¦ãƒ†ã‚¹ã‚¿ãƒ“リティãŒã‚ã‚‹ 自分もモジュラリティãŒã‚ã‚‹HTML/CSSã¯å¹»æƒ³ã ã¨æ€ã£ã¦ã„ã‚‹ã®ã§ã€HTMLã«ç›´æŽ¥å±žæ€§ã‚’書ãã®ã¯åˆ¥ã«æ§‹ã‚ãªã„ã¨æ€ã£ã¦ã„る。 ãŸã ã€é›†å›£é–‹ç™ºã§ã‚‚開発者ã®èƒ½åŠ›å·®ãŒå•é¡Œã«ãªã‚‰ãªã„ã€ã¨ã„ã†ç™ºè¡¨ã‚’ã—ã¦ã„
普通ã®railsアプリã®Backboneã«Marionette付ã‘ã¦æ€ã£ãŸäº‹ - lxyuma BLOG
以å‰æ›¸ã„ãŸè¨˜äº‹ã®åçœã‚’å…ƒã«Marionetteã«ç§»è¡Œã—ãŸã€‚ æ€ã£ãŸä»¥ä¸Šã«å¿«é©ï¼ 大è¦æ¨¡ã«ãªã£ãŸã‚‰Marionette.js使ãˆã¨ã‹æ›¸ã„ã¦ã„ã‚‹ã®ã¯å˜˜ã§ã€æ™®é€šã«Backbone使ã†ã¨ãã¯ã€åˆã‚ã‹ã‚‰ä½¿ã†ã¹ã。 Backboneã§ä¸€ç•ªæã‚ã—ã„ã®ã¯ã€å„ç¾å ´/å„開発者毎ã«ç•°ãªã‚‹ã‚ªãƒ¬ã‚ªãƒ¬å®Ÿè£…。オレオレ実装作るコストã«åŠ ãˆã€ä½¿ã†äººã®æ€ã‚ã¬ãƒã‚°ã‚„å¦ç¿’コストやスイッãƒãƒ³ã‚°ã‚³ã‚¹ãƒˆç‰è«¸ã€…考ãˆã‚‹ã¨ã€ç‰¹åˆ¥ãªç†ç”±ãŒãªã„é™ã‚ŠMarionetteã¿ãŸã„ãªæ—¢å˜ã®framework使ã†ã¹ã。 ã‚ã‚“ã©ã€‚データãƒã‚¤ãƒ³ãƒ‡ã‚£ãƒ³ã‚°ã‚’æä¾›ã—ã¦ãれるã€stickitã¨ä¸€ç·’ã«ä½¿ã†ã¨ã€ã‚ˆã‚Šä¸€å±¤åŠ¹æžœçš„。 ã‚ã£ã¡ã‚ƒã€ã‚½ãƒ¼ã‚¹ã‚³ãƒ¼ãƒ‰ã®é‡ãŒæ¸›ã£ã¦ã€ã‚½ãƒ¼ã‚¹ã®æ„図ãŒæ˜Žå¿«ã«ãªã£ãŸã€‚æ‚©ã¿ã‚‚å°‘ãªã„。工数も勿論減る。 ã“ã“ã‹ã‚‰ã€å¹¾ã¤ã‹æ€ã£ãŸäº‹ã‚’ã€ã‚µãƒƒã‚«ãƒ¼è¦‹ãªãŒã‚‰ãŠé…’飲ã¿ãªãŒã‚‰ã€ãƒ€ãƒ©ãƒ€ãƒ©æ›¸ã。※ã¡ãªã¿ã«ã€æ—¥æœ¬vsオランダ戦見ã¦ã‚‹ã€‚ railsアプリã§ã®js周辺ã®ä½œã‚Šã®
ã‚„ã¯ã‚ŠãŠã¾ãˆã‚‰ã® MVC ã¯é–“é•ãˆã¦ã„ã‚‹ in ãƒãƒƒã‚¯ãƒœãƒ¼ãƒ³ã‚¸ã‚§ãƒ¼ã‚¨ã‚¹ - 猫型ã®è“„音機㯠1 分間㫠45 回ã«ã‚ƒã‚ã¨é³´ã
続編ã®ç´¹ä»‹ 続編 ã‚„ã¯ã‚Šä¿ºã®MVCã¯é–“é•ãˆã¦ã„ã‚‹ in Backbone.js を書ã„ãŸã€‚ãã£ã¡ã®ã»ã†ãŒæœ‰ç›Šãªæƒ…å ±ãŒä¹—ã£ã¦ã‚‹ã¨æ€ã†ã‘ã©é¢ç™½ããªã„ã‹ã‚‚ã—ã‚Œãªã„ 以下本編 MVC ã®è©±ã¨å®—æ•™ã®è©±ã¨æ”¿æ²»ã®è©±ã¨é‡Žçƒã®è©±ã¯ã—ã¦ã¯ã„ã‘ãªã„ãã†ã§ã™ãŒãã‚“ãªã®çŸ¥ã‚‹ã‹ä¿ºã¯ã™ã‚‹ãž クライアントサイド MVC ã®è©± ãã‚‚ãã‚‚ MVC ã®å‡ºè‡ªãŒ GUI アプリケーションã®ãŸã‚ã«ç”Ÿã¾ã‚Œã¦ããŸã‚‚ã®ãªã®ã§ã€Œã‚¯ãƒ©ã‚¤ã‚¢ãƒ³ãƒˆã‚µã‚¤ãƒ‰ MVCã€ãªã©ã¨è¨€ã†è¨€ã„方をã—ãªã‘ã‚Œã°ãªã‚‰ãªã„状æ³ãŒã™ã§ã«æ†Žã„ã®ã ã‘ã‚Œã©ã€ã¾ã‚ãã‚Œã¯ãŠã„ã¦ãŠã。 「ã†ã¡ã¯ Backbone.js を使ã£ã¦ã„ã‚‹ã‹ã‚‰ MVC ã§ã‚¯ãƒ©ã‚¤ã‚¢ãƒ³ãƒˆã‚µã‚¤ãƒ‰ãŒä½œã‚‰ã‚Œã¦ã„ã¦ä¿å®ˆæ€§ãŒé«˜ã„ã§ã™ã€ã¿ãŸã„ãªã“ã¨ã‚’言ã†äººé–“ãŒãŸã¾ã«ã„ã‚‹ãŒã€Backbone.js ã‚’ã¤ã‹ã£ãŸã‹ã‚‰ï¼ˆã‚ã‚‹ã„㯠Marionette.js を使ã£ãŸã‚‰ã‹ã‚‰ï¼‰ã¨ã„ã£ã¦è‡ªå‹•çš„ã«ãŠå‰ã®ã‚¢ãƒ—リケーション㌠MVC ã«ãªã‚‹ã‚ã‘
Angular.jsã¨Backbone.jsã®DOMä¾å˜ã‚’図解ã™ã‚‹ - ã‚¸ãƒ³ã‚¸ãƒ£ãƒ¼ç ”ç©¶å®¤
果敢ã«ã‚‚MVCフレームワークã®å›³è§£ã‚’試ã¿ãŸã®ã§ã€ã©ã†ãžï¼ MVCã®å‹•æ©Ÿ MVCã¨ã„ã†è¨€è‘‰ãŒåˆã‚ã¦ç™»å ´ã—ã¦ã‹ã‚‰30年以上ãŸã£ãŸä»Šã€æœ€æ—©ãªã‚“ã ã£ãŸã®ã‹åˆ†ã‹ã‚‰ãªã„ã»ã©MVCã®å®šç¾©ã¯æ··è¿·ã‚’ããŸã—ã¦ã„ã‚‹ã‚ã‘ã ãŒã€ã©ã‚ŒãŒMVCã§MVVMã§MVPã§ã‚ã‚‹ã¨ã„ã†å®šç¾©ã«ã¤ã„ã¦ã‚ã‚Œã“れ考察ã™ã‚‹ã®ã¯å€‹äººçš„ã«ã¯å¥½ãã§ãªãã¦ã€ã€Œçµå±€ä½•ãŒã—ãŸã„ã®ã‹ã€ã¨ã„ã†å‹•æ©ŸãŒã¶ã‚Œã¦ã„ãªã‘ã‚Œã°ä½•ã§ã‚‚良ã„ã¨æ€ã£ã¦ã„る。 ã˜ã‚ƒã‚ãã‚Œã¯ä¸€ä½“何ãªã®ã‹ã¨ã„ã†ã“ã¨ã‚’自分ãªã‚Šã«è€ƒãˆã¦ã¿ãŸã¨ã“ã‚ã€æ¬¡ã®ä¸€è¨€ã«è½ã¡ç€ã„ãŸã€‚ 「Modelã¯Viewã«ä¾å˜ã—ãŸããªã„〠世間的ã«ã¯ï¼ˆï¼Ÿï¼‰Modelã¨Viewã‚’å˜ã«ã€Œåˆ†ã‘ã‚‹ã€ã¨èª¬æ˜Žã•ã‚Œã‚‹ã“ã¨ãŒå¤šã„ãŒã€ç§ã¯ãã‚Œã ã‘ã§ã¯ç´å¾—ã—ã¦ã„ãªãã¦ã€ä¾å˜ã®æ–¹å‘ã“ããŒé‡è¦ã ã¨æ€ã£ã¦ã„る。ãŸã¨ãˆåˆ†ã‹ã‚Œã¦ã„るよã†ã«è¦‹ãˆã¦ã‚‚ModelãŒViewã‚’å‚ç…§ã—ã¦ã„ãŸã‚‰ã€æƒ…å ±ã®å–得先や表ç¾æ–¹æ³•ã¯å›ºå®šåŒ–ã•ã‚Œã¦ã—ã¾ã†ã€‚ Modelã¯Viewã®äº‹æƒ…ã‹ã‚‰
Unsuck your backbone
Video here : http://bit.ly/13D8tNZ Backbone.js is a popular, super lightweight JavaScript framework which helps you structure your code MVC style. If…
ã€ã‚ãˆã¦è‹±èªžè¨˜äº‹ã‚ªãƒ³ãƒªãƒ¼ã€‘Backbone.jsã‚’å¦ã¹ã‚‹ãƒšãƒ¼ã‚¸ã¾ã¨ã‚ - Qiita
Backbone.jsã®æƒ…å ±ã‚’æŽ¢ã—ã¦ã„ã‚‹ã¨è‹±èªžã®è¨˜äº‹ã«å½“ãŸã‚‹ã“ã¨ãŒå¤šã„ã®ã§ã€ã“ã“ã¯ã‚€ã—ã‚割り切ã£ã¦æœ€è¿‘èªã‚“ã Backbone.jsã«ã¤ã„ã¦è‹±èªžã§æ›¸ã‹ã‚ŒãŸãƒšãƒ¼ã‚¸ã‚’ã¾ã¨ã‚ã¦ãŠãã¾ã—ãŸã€‚ ãªã‚“ã‹è‹±èªžã®è¨˜äº‹èªã‚€ã¨ã€Œã‚„ã£ã¦ã‚„ã£ãŸãœï¼ã€ã¨ã„ã†æ°—æŒã¡ã«ã‚‚ãªã‚‹ã— シンプルãªã‚¹ãƒ©ã‚¤ãƒ‰ã‚‚ã® Client-side MVC with Backbone.js ã”ãåˆæ©ã®ã€Œãªã‚“ã§Backbone使ã£ãŸã‚‰ã„ã„ã®ï¼Ÿã€ã‹ã‚‰ã€ã‚¢ãƒ¼ã‚テクãƒãƒ£ã®èª¬æ˜Žã‚„利用例ã€ãƒ¢ãƒ‡ãƒ«ã®é–¢é€£ã‚’作るtipsãªã©ãƒšãƒ¼ã‚¸æ•°ã¯å¤šã„ã‘ã©ã©ã‚“ã©ã‚“èªã‚る系。 Unit Testing JavaScript and Backbone.JS Backboneã®Modelã¨ã‹Viewã¨ã‹ã‚’å˜ä½“テストã™ã‚‹æ–¹æ³•ã‚’分ã‹ã‚Šã‚„ã™ã紹介ã—ã¦ãれるプレゼンテーションスライド。 å‰åŠã§ã”ã明快ã«ãƒ†ã‚¹ãƒˆãŒå¿…è¦ãªç†ç”±ã‚„箇所ã€å¾ŒåŠã«Backboneを使ã†ã¨ã©ã†ã„ã†é¢¨ã«ç°¡å˜ã§ãã‚Œã„ã«æ›¸ã‘ã‚‹
リリースã€éšœå®³æƒ…å ±ãªã©ã®ã‚µãƒ¼ãƒ“スã®ãŠçŸ¥ã‚‰ã›
最新ã®äººæ°—エントリーã®é…ä¿¡
j次ã®ãƒ–ックマーク
kå‰ã®ãƒ–ックマーク
lã‚ã¨ã§èªã‚€
eコメント一覧を開ã
oページを開ã
Backbone.js 1.1.1ãŒBrowserifyã§ãƒã‚°ã£ãŸä»¶ - Qiita
実践Backbone.Marionette ç¾å ´ã®æ‚©ã¿ã¨è§£æ±ºã¾ã§
Rendr入門: サーãƒã‚µã‚¤ãƒ‰ã§(ã‚‚)å‹•ã‹ã™ã€Backbone.js
GitHub - Maluen/Backbone-Debugger: Chrome Developer Tools extension for debugging Backbone.js applications
– Tech Pro Shopping
{{#tags}}- {{label}}
{{/tags}}