Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Ember.js Meetup - Koblenz and Neuwied

Ember.js Meetup - Koblenz and Neuwied

Slides from my talk at the Ember.js meetup in Koblenz at the rz-Druckhaus.

696b46d6cd1045f43ee8390db45518b7?s=128

Kasper Tidemann

September 11, 2014
Tweet

More Decks by Kasper Tidemann

Other Decks in Programming

Transcript

  1. September 11, 2014 Ember.js Meetup Koblenz und Neuwied

  2. { name: “Kasper Tidemann”, profession: “Software developer”, company: “Tidemann&Co”, codes:

    [“JavaScript”, “Go”], likesTo: “Be nice and drink beer.”, places: [“Copenhagen”, “San Francisco”], alsoDoes: “Blogging”, website: “kaspertidemann.com” } string
  3. Meeho! is a CRM system and my first company.

  4. My favorite editor is Atom. Now you know everything about

    me.
  5. A bit about where we came from and where we’re

    headed. Status quo
  6. Back then…

  7. Now: Unreal 4 in the browser thanks to asm.js, a

    subset of JavaScript.
  8. Seriously, that’s crazy! OMG LOOOOOOOL

  9. Let’s talk Ember.js! App.inject( );

  10. First things first. A framework for creating ambitious web applications.

  11. … there’s more to it, but let’s stick to the

    basic. Ember.js has routes, templates and controllers. Core concepts App.Router.map(function() { this.route(‘koblenz’); this.route(‘neuwied’); }); <script type=“text/x-handlebars” id=“koblenz”> <p>Welcome to Koblenz!</p> <p>Today is {{date}}.</p> </script> App.KoblenzController = Em.Controller.extend({ date: Em.computed(function() { return (new Date()).getTime(); }) });
  12. A brief overview of what comes from where. App.Router.map(function() {

    this.route(‘koblenz’); this.route(‘neuwied’); }); <script type=“text/x-handlebars” id=“koblenz”> <p>Welcome to Koblenz!</p> <p>Today is {{date}}.</p> </script> App.KoblenzController = Em.Controller.extend({ date: Em.computed(function() { return (new Date()).getTime(); }) });
  13. Essentially, anyway. The router takes care of turning the URL

    into meaningful state. It invokes controllers, views, and has templates appear in the browser. Router
  14. Like partials in Ruby on Rails and so on. Templates

    contain the HTML to show in the browser. Ember.js uses Handlebars for templating, a string-based solution soon to be replaced by HTMLBars. Templates
  15. Glueing everything together! Controllers are typically instantiated by the router.

    Each route has a corresponding controller for working with data, variables, bindings and so on. Controllers
  16. Demonstration

  17. We’ve only just touched upon the surface of what Ember.js

    is. There is way more to Ember.js than just that: models, mixins, helpers, bindings, components and so on.
  18. Sharing is caring. <3 https://github.com/KasperTidemann/emberjs-meetup-koblenz-neuwied Example files are available on

    GitHub:
  19. Enough talk! Who actually uses this magnificent piece of software?

    Who uses Ember.js?
  20. None
  21. Because of the sensible conventions, the rapid development experience, the

    helpful bindings… Why should you use Ember.js? (And because you really don’t want to setInterval() for checking hash changes nor fiddle with push states yourself. Believe me, I did that once. All you want is to build an awesome app.)
  22. http://www.kaspertidemann.com/ Thank you!