ASH-Michael

import Ember from 'ember';

export default Ember.Component.extend({
  classNames: ['first-component component']
});

ASH-Michael

import Component from '@ember/component';
import { computed, get } from '@ember/object';
import { htmlSafe } from '@ember/string';

export default Component.extend({
  centerName: 'Orange Theory',
  centerProfile: 'https://fakeimg.pl/120x120/',
  centerAddress: '32435 Temecula Pkwy',
  centerCity: 'Temecula',
  centerState: 'CA',

ASH-Michael

import Ember from 'ember';

export default Ember.Component.extend({
  classNames: ['profile-widget'],
  classNameBindings: ['isInset:content-inset:content-full'],
  
  isInset: true,
  hasArgs: false,
  
  didReceiveAttrs() {

ASH-Michael

import Ember from 'ember';

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

ASH-Michael

import Ember from 'ember';

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

ASH-Michael

import Ember from 'ember';

export default Ember.Component.extend({
  tagName: 'li',
  classNameBindings: ['status'],
  
  status: 'notok'
});

ASH-Michael

import Ember from 'ember';

export default Ember.Component.extend({
  classNames: ['my-component']
});

ASH-Michael

import Ember from 'ember';

export default Ember.Component.extend({
  classNames: ['addon-component']
});

ASH-Michael

import Component from '@ember/component';
import { computed, set } from '@ember/object';
import { inject as service } from '@ember/service';

export default Component.extend({
  myService: service(),
  
  computeComponentProperties: computed('componentProp1', 'componentProp2', function() {
    const statement = `The computed properties on the component are <b>property1: "${this.componentProp1}"</b> and <b>property2: "${this.componentProp2}"</b>`;
    console.log(statement);

ASH-Michael

import Controller from '@ember/controller';
import { computed, set } from '@ember/object';
import { alias, oneWay } from '@ember/object/computed';

export default Controller.extend({
  // demo 1
	color1: 'red',
  color2: 'blue',
  color3: computed('color1', 'color2', function() {
    const same = this._checkIfSame(this.color1, this.color2);