title: Grunt - How to manage both client-side and server side development?
body: <p>I'm developing my first web app, using <em>grunt</em>, <em>yo</em>, <em>angular.js</em>, ... I also need some server-side service (which I will implement in <em>PHP</em>).</p>
  
  <p>Which is the "standard" way to handle this scenario, which is - I suppose - quite widespread?<br>
  I mean, a setup which can be used both during development (<em>grunt</em> server for client-side, and <em>apache</em> for server-side) and production (<em>apache</em> or <em>nginx</em> server for both client-side and server side).</p>
  
  <p>I make an example to clarify my doubts: I have an angular service like this:</p>
  
  <pre><code>var serverUrl = '//localhost:80';
  app.factory('myFactory', function($resource) {
      $resource(serverUrl + '/api/getDataFromServer/:reqId', { ... }
  );
  </code></pre>
  
  <p>While developing, I have two distinct servers for client-side (<em>grunt</em> on port 9000, for example), and server-side (<em>apache</em> on port 80, for example), so - to avoid CORS issues - I will have to - at least - add a <code>header("Access-Control-Allow-Origin: http://localhost:9000")</code> to server (<em>JSON</em>) output.</p>
  
  <p>In production, conversely, I will have a single server to serve both static (angular app) and dynamic (data from <em>PHP</em>) content, so I will not need any additional <em>Access-Control</em> meta tag...</p>
  
  <p>Of course I can take the current environment status (<em>development</em> / <em>production</em>) into account, and accordingly output or not the additional meta tag...</p>
  
  <p>My question is: is this approach common with web apps (which need custom data services)?
  Do you follow a different approach, or do you see any 'architectural' improvement possible with this design?</p>