docs(server): add `do` to peek at results in console

public/docs/_examples/server-communication/ts/app/toh/hero.service.ts

@@ -18,11 +18,14 @@ export class HeroService {
   // #docregion methods
   // #docregion error-handling
   getHeroes () {
-    // #docregion http-get
+    // #docregion http-get, http-get-v1
     return this.http.get(this._heroesUrl)
                     .map(res => <Hero[]> res.json().data)
+                    // #enddocregion v1, http-get-v1, error-handling
+                    .do(data => console.log(data)) // eyeball results in the console
+                    // #docregion v1, http-get-v1, error-handling
                     .catch(this.handleError);
-    // #enddocregion http-get
+    // #enddocregion http-get, http-get-v1
   }
   // #enddocregion error-handling
   // #enddocregion v1

public/docs/ts/latest/guide/server-communication.jade

@@ -92,7 +92,7 @@ figure.image-display
   With our basic intuitions about the component squared away, we can turn to development of the backend data source
   and the client-side `HeroService` that talks to it.
   
-  ### Fetching data
+  ### Fetch data
   
   In many of our previous samples we faked the interaction with the server by
   returning mock heroes in a service like this one:
@@ -112,7 +112,7 @@ figure.image-display
 +makeExample('server-communication/ts/index.html', 'http', 'index.html')(format=".")
 :marked
   Look closely at how we call `http.get`
-+makeExample('server-communication/ts/app/toh/hero.service.ts', 'http-get', 'app/toh/hero.service.ts (http.get)')(format=".")
++makeExample('server-communication/ts/app/toh/hero.service.ts', 'http-get-v1', 'app/toh/hero.service.ts (http.get)')(format=".")
 :marked
   We pass the resource URL to `get` and it calls the server which returns
   data from the `heroes.json` file.  
@@ -159,7 +159,7 @@ figure.image-display
 :marked
   ### Map the response object
   Let's come back to the `HeroService` and look at the `http.get` call again to see why we needed `map()`
-+makeExample('server-communication/ts/app/toh/hero.service.ts', 'http-get', 'app/toh/hero.service.ts (http.get)')(format=".")
++makeExample('server-communication/ts/app/toh/hero.service.ts', 'http-get-v1', 'app/toh/hero.service.ts (http.get)')(format=".")
 :marked
   The `response` object does not hold our data in a form we can use directly. 
   It takes an additional step — calling `response.json()` — to transform the bytes from the server into a JSON object.
@@ -217,9 +217,25 @@ figure.image-display
     Try messing with the value of the api endpoint in the `HeroService` and watch it fail
   +makeExample('server-communication/ts/app/toh/hero.service.ts', 'endpoint', 'app/toh/hero.service.ts (endpoint)')
   
-
+<a id="do"></a>
+<a id="console-log"></a>
 :marked
-  ### Sending data to the server
+  ### Peek at results in the console
+  During development we're often curious about the data returned by the server.
+  Logging to console without disrupting the flow would be nice.
+  
+  The Observable `do` operator is perfect for the job. 
+  It passes the input through to the output while we do something with a useful side-effect such as writing to console.
+  Slip it into the pipeline between `map` and `catch` like this.
++makeExample('server-communication/ts/app/toh/hero.service.ts', 'http-get', 'app/toh/hero.service.ts')(format=".")
+:marked
+  Remember to comment it out before going to production!
+  
+<a id="update"></a>
+<a id="post"></a>
+.l-main-section
+:marked
+  ## Send data to the server
   
   So far we've seen how to retrieve data from a remote location using Angular's built-in `Http` service. 
   Let's add the ability to create new heroes and save them in the backend.
@@ -258,7 +274,7 @@ code-example(format="." language="javascript").
 +makeExample('server-communication/ts/app/toh/hero-list.component.ts', 'addHero', 'app/toh/hero-list.component.ts (addHero)')(format=".")
 
 :marked
-  ## Falling back to Promises
+  ## Fall back to Promises
   
   Although the Angular `http` client API returns an `Observable` we can turn it into a 
   [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) if we prefer.
@@ -303,10 +319,10 @@ code-example(format="." language="javascript").
     
     Learn more about observables to understand the implications and consequences of subscriptions.
 :marked
-  ## Communication with `JSONP`
+  ## Get data with `JSONP`
 
   We just learned how to make `XMLHttpRequests` using Angulars built-in `Http` service. This is the most common approach for 
-  server Communication. It doesn't work in all scenarios though.
+  server communication. It doesn't work in all scenarios though.
 
   For security reasons web browser do not permit to make `XHR` calls if the origin of the remote server is different from the one the web page runs in.
   The origin is defined as the combination of URI scheme, hostname and port number. The policy that prevents such `XHR` requests is called [Same-origin Policy](https://en.wikipedia.org/wiki/Same-origin_policy) accordingly.
@@ -320,7 +336,7 @@ code-example(format="." language="javascript").
   But let's not go too deep into the rabbit hole of `JSONP`. If you like to learn how this technique works under the cover, you may like to read up on this [answer](http://stackoverflow.com/questions/2067472/what-is-jsonp-all-about/2067584#2067584) on StackOverflow.
   For now, let's focus on how we can use `JSONP` in Angular.
 
-  ### Let's fetch some data from wikipedia
+  ### Search wikipedia
   
   Wikipedia offers a `JSONP` search api. Let's build a simple search that shows suggestions from wikipedia as we type in a text box.
 figure.image-display
@@ -368,7 +384,7 @@ code-example.
   There are a bunch of things in our wikipedia demo that we could do better. This is a perfect opportunity to show off some nifty
   `Observable` tricks that can make server communication much simpler and more fun.
   
-  ## Taking advantage of Observables
+  ## More fun with Observables
 
   If you ever wrote a search-as-you-type control yourself before, you are probably aware of some typical corner cases that arise with this task.