marcoow

import Ember from 'ember';

export default Ember.Component.extend({
});

marcoow

Moduliarzing Ember.js while keeping sane defaults

These are some thoughts I had about Ember.js' future and potential areas to focus on. I did miss the #EmberJS2019 (by quite a lot) but I still though this might be worth sharing.

In the EmberConf 2017 keynote, Tom and Yehuda announced Glimmer.js and the idea of starting apps with Glimmer.js and then allowing people to install their way up to full Ember.js package by package. I've always been a huge fan of the idea (we even built and open-sourced a showcase PWA with Glimmer.js and our own website simplabs.com is a Glimmer.js app as well) but it never really took off.

I think it's time to go back to this idea and make it a reality. Providing a slimmer subset of Ember.js would open it up for many more use-cases that are not currently great fits (obviously mobile apps with hard requirements on minimal bundle size come t

marcoow

<h1>ember-test-selectors and ...attributes</h1>
<p>Have a look at the markup generated by this component.</p>
<MyComponent data-test-foo="bar" class="test" />

marcoow

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle',

  init() {
    this._super(...arguments);
 
    console.log(Ember.get(undefined, 'property'));
  }

marcoow

import Ember from 'ember';
import { equal, raw, collect } from 'ember-awesome-macros';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle',
  isGood: equal(collect(raw('test')), collect(raw('test'))),
});

marcoow

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle',
  actions: {
    clickcircle() {
      debugger;
      alert('clicked');
    }
  }

marcoow

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle'
});

marcoow

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle'
});

marcoow

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle',
 
  things: Ember.A([1,2,3]),
  firstA: Ember.computed.oneWay('things.firstObject'),
  firstB: Ember.computed.oneWay('things.0'),
  firstC: Ember.computed(function() {
    return this.get('things').objectAt(0);

marcoow

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle',
  things: [
    1,
    2
  ],
 
  hasManyThings: Ember.computed.gte('things.length', 3),