desktop/mobile application on the same codebase

[Riad Bahri]

Hi,

i am developing a mobile browser application with angular and soon want to create a desktop browser application of the same app.

Since i would like to reuse the code as much as possible, i've done a little research on how to do this best and the concept of states/mulitple views and anguluar-ui/ui-router came up a lot.

Could someone just give me a quick pointer on how the ui-router and or multiple views can help me with developing mobile apps/desktop app with the same codebase? What are best practices?

I really appreciate your help. Resources on this topic are scarce. 

[Zygimantas Berziunas]

It depends on the technologies you are planning to use. The trick is, it does not have to be 2 physically separate applications, but you should make clear separations between reusable application layers. I would create the the following layers:

1. Core layer with domain entities (depends on nothing, single place to model your domain, reusable in both applications).

2. Infrastructure layer with repositories for domain access (depends on 1, single place to change if you will need to change database, reusable in both applications).

3. Multiple paralell UI layers:

    3.1 The RESTful web service (depends on 1 and 2, reusable in both applications).

    3.2 The container application (reusable in both applications).

        3.2.1 Mobile browser application (depends on 3.1, if required, on 1 and 2).

        3.2.2 Desktop browser application (depends on 1 and 2, if required, on 3.1).

3.2 would be a single application, built using any MVC framework. The main goals of 3.2 are:

        1. Route requests to 3.2.1 or to 3.2.2 depending on URL or other conditions.

        2. Provide unified security mechanisms and shared layout if needed. In example, it is really useful if you want to split your large AngularJS application into smaller application modules with the same layout.

        3. Provide the same start-up view data if needed.

I use ASP.NET MVC, I found the Areas to work the best for separating client side applications. I strongly recommend to use server side MVC framework in addition to AngularJS to get the best reusability.

If you want to reuse UI components between Desktop and Mobile applications, I would suggest to forget it. It is not practical.

For Desktop (server side) + Mobile applications (client side, AngularJS), reuse web services and container application.

For AngularJS + AngularJS applications, reuse  web services, container application, layouts and directives.