How to deploy an angularjs application frontend with Nginx and dropwizard

I would use the nginx as a API Gateway which route your requests to your backend.

Implement an API gateway that is the single entry point for all clients. The API gateway handles requests in one of two ways. Some requests are simply proxied/routed to the appropriate service. It handles other requests by fanning out to multiple services.

With a Gateway you have the flexibility to change your backend as you like. Because the nginx works only as a gateway he can also serve your static files (angularjs). A gateway has more advantage like logging, authentication etc.

Following this answer You can use this nginx configuration file in order to proxy the Dropwizard application inside your server from port 8080 to port 80:

server {listen 80;server_name api.example.com;location / {    proxy_pass http://127.0.0.1:8080;    proxy_set_header  Host             $http_host;    proxy_set_header  X-Real-IP        $remote_addr;    proxy_set_header  X-Forwarded-For  $proxy_add_x_forwarded_for;    }}

For your Angular application you can either serve static assets from Dropwizard or set a virtual host via Nginx

As a side note, remember to configure CORS in your mainClass from your Dropwizard application:

  @Override  public void run(Configuration configuration, Environment environment) throws Exception {    configureCors(environment);    environment.jersey().register(new HelloWorldResource(template));  }  private void configureCors(Environment environment) {    FilterRegistration.Dynamic filter = environment.servlets().addFilter("CORS", CrossOriginFilter.class);    filter.addMappingForUrlPatterns(EnumSet.allOf(DispatcherType.class), true, "/*");    filter.setInitParameter(CrossOriginFilter.ALLOWED_METHODS_PARAM, "GET,PUT,POST,DELETE,OPTIONS");    filter.setInitParameter(CrossOriginFilter.ALLOWED_ORIGINS_PARAM, "*");    filter.setInitParameter(CrossOriginFilter.ACCESS_CONTROL_ALLOW_ORIGIN_HEADER, "*");    filter.setInitParameter("allowedHeaders", "Content-Type,Authorization,X-Requested-With,Content-Length,Accept,Origin");    filter.setInitParameter("allowCredentials", "true");  }

Serving static files like your angularjs app from nginx will reduce the load on dropwizard.

EDIT: Turns out dropwizard does have support for serving static files. However, I still believe nginx would do a better job of it.