Home Ask Login Register

Developers Planet

Your answer is one click away!

erwin February 2016

Angular.js - Do I need to design 2 apps or only one?

I defined 2 virtual servers with Nginx to handle

marketing stuff and user authentication on the master domain www.example.com and

the admin app on the subdomain admin.example.com once the user is authenticated

        server {
            listen       8080;
            server_name  example.com;
            root html;
            location / {
                index  index.html index.htm;
        server {
            listen       8080;
            server_name  admin.example.local;
            root   html/admin;
            location / {
                index  index.html index.htm;

I would like to handle the marketing stuff with an Angular.js one-page app and the admin stuff with an Angular.js multi-page app..

is it possible ? should I design 2 apps or 1 ap only ?


kuzyn February 2016

I don't think that you should split them as they are likely to require lots of the same functions / data. Think DRY design.

You do not want to have to maintain two codebases for one project or have to patch things twice everytime there is a change in the API.

Look closely into the $route documentation and plan your implementation accordingly: you can have an isolated path for your admin without having to duplicate anything. Also, even on the same domain you might run into some weird XHR issues that you will have to code specifically for.

In short, here's my answer: don't split it. If you absolutely want to have admin.domain.com, just do a redirect from your DNS to domain.com/admin and deal with it within a single codebase. Down the line you can slightly refactor your code to match the exact behavior you want. Have a look here for some inspiration: Dynamic routing by sub domain with AngularJS

Walfrat February 2016

You can get separated code with modules.

Here is ideally how you you should make it 3 separated projects :

  1. a common module - no index with ng-app or angular.bootstrap. it's alibrary to be shared.
  2. an application module contains a index.html with an ng-app and a bootstrap module
  3. an admin module contains another index.html file wit another bootstrap module

Then you set up 2 builds :

  1. the application build : merging 1 & 2
  2. ther admin build : merginig 1 & 3

But this can be rather difficult to do. So if you can't really made it properly then you merge the application module in the admin one too for the admin build. This shouldn't be a problem.

Post Status

Asked in February 2016
Viewed 3,926 times
Voted 7
Answered 2 times


Leave an answer

Quote of the day: live life