Ember JS and Multiple single page apps

Question

Say I have a web app - a large, complex, rails app, like an accounting application. I see a use for several single page apps instead of the typical rails round tripping pages. For example, I can see a user better served with an intuitive single page/dynamic app for:

• Creating Bank Reconciliation
• Creating an Invoice
• Filling out a Time Report
• etc..

These are all distinct one page apps...

All the ember apps I see are single page and single purpose.

I want to have many single page apps, built with ember. How would that look with respect to:

Routes: I'd have a combination of server routes and client routes. How would that look in Ember? Serve different Ember applications, each with their own application router and routes?

Templates: Would all my "applets" get compiled and pushed down to the client on load? Or would I leverage require.js and load each single page app depending on if they're navigated to? ...

Can anyone help with those two questions? Thanks in advance!

Answer 1

Routes: I'd have a combination of server routes and client routes. How would that look in Ember? Serve different Ember applications, each with their own application router and routes?

Depends on how much overlap there is in terms of features. For sure you could serve different Ember applications with their own router and routes. In that case you would probably also write a shared library with common base classes and mixins.

An alternative would be to have a single ember application that looks and behaves very differently depending on the route. That's where I would start until you have a good feel for ember and see a compelling reason to split things apart.

Templates: Would all my "applets" get compiled and pushed down to the client on load? Or would I leverage require.js and load each single page app depending on if they're navigated to? ...

Path of least resistance in rails is to use sprockets to compile and package your templates - once compiled they are just javascript. Typically a rails app will bundle all javascript into application.js and include that on load. An alternative would be to split application-specific code and templates into app1.js, app2.js, etc. and load each when the app is navigated to.

Answer 2

I would suggest using a PODS structure and then you can have routes like

/app1/
  /route1
  /route2  
/app2/
  /route1
  /route2
etc...

If you generate with pods structure you folders e.g. ember generate route app1\route1

you will end up with a good folder structure that you can split up later, something like:

   /app
       /pods/
            /app1
                 /route1
                    route.js
                    controller.js
                    template.hbs
                 /route2
                    route.js
                    controller.js
                    template.hbs
            /app2
                 /route1
                    route.js
                    controller.js
                    template.hbs
                 /route2
                    route.js
                    controller.js
                    template.hbs