This document discusses the benefits of single page applications (SPAs) and how to create one using Ember.js and Rails. It explains that SPAs allow redrawing parts of a website without additional server requests by using AJAX. Some pros of SPAs are better user experience, support for mobile, and complete control over loading. Potential cons include needing JavaScript and URLs without paths. Frameworks like Ember.js, Angular, and Meteor can help build SPAs. Ember is a good choice as it is fast and uses MVC patterns. The document provides steps for integrating Ember into a Rails app using the ember-cli-rails gem.

1. Why would a programmer
fall in love with SPA?
Creating Single Page Applications with Rails && Ember.js
Created by / fromMaria Stokłosa @mariastoklosa netguru.co

2. Idea of Single Page
Applications
Single Page Applications allow to redraw any part of the
website without additional server requests to get the HTML
code.

3. Traditional page lifecycle
CLIENT creates an initial request

4. Traditional page lifecycle
SERVER responds with HTML code

5. Traditional page lifecycle
CLIENT creates HTTP request

6. Traditional page lifecycle
SERVER responds with HTML code

7. Traditional page lifecycle
Website reloads

8. SPA page lifecycle
CLIENT creates an initial request

9. SPA page lifecycle
SERVER responds with HTML code

10. SPA page lifecycle
CLIENT creates an AJAX request

11. SPA page lifecycle
SERVER responds with JSON

12. SPA page lifecycle
Website does not reload! :))))))

13. SPA websites - pros
Better from the UX point of view
Mobile preferred
Provide separation of client and server responsibilities
Complete control of the loading experience because of
AJAX calls

14. SPA websites - cons
Client has to have JavaScript enabled
Good SPA apps are hard to develop
Unnatural URLs (fragment identifiers)
Indexing a website may be complicated

15. How to create a SPA
application?
Ember.js
AngularJS
Meteor
Backbone.js

16. How to choose a proper
framework?
Routing
Templating
Testability
Browser compatibility
API integrations

17. Why Ember.js?
Ember is now fast (isemberfastyet.com)
Using MVC framework has many benefits
Getting 15 jQuery plugins to work together might be
problematic
Binding templates to variables is cool

18. Is Ember.js better than
AngularJS?
NO

19. Creating SPA websites
won't fix your poor
UX/design problems

20. Ways to use Ember with
Rails
2 separate applications
Ember.js embedded in Rails application

21. How to start?
Include in your Gemfile && run bundle install
gem 'ember-cli-rails'

22. Use generator to guide you
rails generate ember-cli:init

23. Hook ember app to your
page
EmberCLI.configure do |config|
config.app :enrollment, path: 'app/ember/frontend'
config.app :admin #=> path will be app/admin
end
= include_ember_script_tags :enrollment

24. Mount EmberCLI test
engine in config/routes.rb
mount EmberCLI::Engine => "ember-tests", if: -> { Rails.env.development? }

25. Add root element to
config/environment.js
APP: {
rootElement: '.enrollment'
}

26. Create a rake task for
running ember tests
task default: 'ember:test'

27. THE END - Q & A
-
-
Ember.js documentation
Ember-cli-rails