The slides I used while giving an introduction to Ember.JS at Codecamp Cluj Napoca in November 2016. It is a gist for all the things ember provide and why it enables teams to deliver products without blocking them in the past, as far as approaches and technology goes.

2. DELIVERING WITH
EMBER.JS

3. They used EmberJS to
build a product

4. ABOUT ME
Market-like apps
Lots of events
Time critical
User interactions are
not that complex
Application Suite
Occasional events
Responsive
CRM-like features
User interactions
are somewhat
complex
Large number of
development teams
Consumer apps
Rare events
Device tailored
custom experience
Focused
User interactions
are very complex

5. Instead of working on my
app, I
▸ Hooked a Router
▸ Configured Webpack /
Whatever
▸ Set up a testing
solution
▸ Put together the best
environment
▸ Tweaked that
environment
aka REINVENTING THE WHEEL

6. EXCITEMENT

7. React
A problem
React

8. “I probably had my
personal moment of truth
around the beginning of
Doom 3's development,
when it became clear that it
is no longer possible to
deeply understand every
single part of a modern
application. There is just
too much...”
https://raw.githubusercontent.com/ESWAT/john-carmack-pl
an-archive/master/by_year/johnc_plan_2007.txt

9. WANT GOOD
APPS?
Have good
teams.

10. TODAY’S
AGENDA
Ember.js from a business perspective
Ember.js from a developer’s perspective
TechnoMagicDemo

11. Why should you care about
Ember?

12. Why should you care about
Ember?
Because getting the latest and greatest
often means rewriting parts of your apps
once a year, as the community abandons
existing solutions in search of
improvements.

13. INITIAL RELEASES
MV* Frameworks

14. Ember’s biggest strength
COMMUNITY

15. Core philosophy: Stability without stagnation
Identify common patterns that emerge from the web
development community and roll them into a
complete front-end stack.

16. The Ember community works hard to introduce new
ideas with an eye towards migration.
This makes it easy to get started on new projects
and jump into existing ones.
Core philosophy: Stability without stagnation

17. The direction in which the framework is taken does
not depend on a particular business choice.
No Angular 2 fiasco.
Not driven by a company

18. AN INDUSTRY SHIFT
Components
“Unidirectional data flow”
Virtual DOM
Isomorphic apps

19. The request for
comments process is
intended to provide a
consistent and
controlled path for new
features to enter the
framework.
Changes done via RFC

20. Explosion of innovation

21. React’s true innovation
COMPONENTS*
* Predictable unidirectional data flow, explicit
mutation, component boundaries, lack of
two-way binding

22. Transition to 2.X
- Ember CLI
- ES6 Modules
- Revamped components
with “virtual DOM”
- API simplification
- and a lot more

23. Transition to 2.X
“Hopefully, this plan demonstrates that staying on
the cutting-edge can be done without rewriting your
app.
There are a huge number of Ember apps in
production today, and we're looking forward to a
time in the very near future where they can start to
take advantage these new features.”
https://github.com/emberjs/rfcs/pull/15

24. Ember comes with
- separation of concerns
- object model (classes,
inheritance, mixins)
- router
- observers
- computed properties
- isolated components
- container
- templating system
- run loop

25. Explosion of innovation

26. JavaScript Fatigue(?)

27. 2.9.0
2.10­beta
2.8.0
2.9­beta
2.7.0
2.8­beta
2.6.0
2.7­beta
2.8­LTS2.4­LTS
Sep 23Aug 12Jul 1May 20
2.5.0
2.6­beta
2.4.0
2.5­beta
master
2.3.0
Jan 15
Canary
Beta
Release
LTS
2.4­beta
Feb 26 Apr 8
LTS releases will receive critical bugfixes for 6 release cycles (36 weeks).
LTS releases will receive security patches for 10 release cycles (60 weeks).
Ember’s release channels

28. Ember-cli provides
- Package manager
- Directory structure and file
naming conventions
- Build system (broccoli)
- jsHint on every run
- Livereload
- Module system
- ES6 transpilation
- Generators
- Test Framework
- Addon system

29. CONVENTION
OVER
CONFIGURATION
Decrease the number of
decisions that developers need
to make, gaining simplicity, but
not necessarily losing
flexibility.

30. CONVENTION
OVER
CONFIGURATION
A developer only needs to
specify unconventional
aspects of the application.

31. CONVENTION
OVER
CONFIGURATION
The combination of
conventions over configuration,
Glimmer, and DDAU means that
Ember developers can easily
find the sweet spot of having
both productivity and
performance.

32. npm install -g ember-cli
ember new demo-playground
ember s

33. let’s start a business

34. Recap
▸ We wrote some code

35. 2 groups of components
Container
Components act like
the “backend of the
frontend” in a way.
They are “connected”
to the datasource and
delegate to other
components for any
html that is rendered
on the page.

36. 2 groups of components
Presentational
Components render
HTML given some
object/data

37. 2 groups of components
Container
Components and
Presentational
Components
vs.
Business
Components and
Toolkit Components

38. EMBER 2.X
DATA DOWN,
ACTIONS US

39. COMPUTED
PROPERTIES
Computed properties let you
declare functions as properties.
It takes one or more normal
properties and creates a new
value.
They observe any changes
made to the properties they
depend on and are dynamically
updated when they're called
They can be chained.

40. COMPUTED
PROPERTIES

41. COMPUTED
PROPERTIES

42. Ember Data
Ember Data is a library for
managing model data in Ember.
It’s designed to be agnostic to
the underlying persistence
mechanism, so it works just as
well with JSON APIs over HTTP
as it does with streaming
WebSockets or local IndexedDB
storage.
ember install ember-data

43. Ember Data
Ember Data is a library for
managing model data in Ember.
It’s designed to be agnostic to
the underlying persistence
mechanism, so it works just as
well with JSON APIs over HTTP
as it does with streaming
WebSockets or local IndexedDB
storage.
XHR XHR
returns
Promise
Resolves
with JSON
Promise
Resolves
with Record
find()
find()
Application
Store
Adapter
Network

44. Ember Data
Ember Data is a library for
managing model data in Ember.
It’s designed to be agnostic to
the underlying persistence
mechanism, so it works just as
well with JSON APIs over HTTP
as it does with streaming
WebSockets or local IndexedDB
storage.

45. Ember FastBoot
Convention over config
isomorphic apps.
FastBoot works by running your
Ember application in Node.js.
When a user visits your site, the
initial HTML is rendered and
served to the user.
ember install ember-cli-fastboot

46. Ember Redux
You can use Redux together
with React, or with any other
view library.
ember install ember-redux
http://www.ember-redux.com/ddau/

47. Ember comes with
For a heavy RESTful front-
end apps, Ember is the best
framework.
It cuts out almost all boiler
plate and makes many
convention based
decisions for you.
http://emberjs.com/

48. THANKS!
Any questions?
You can find me at @Andrei_Cimpean