Add docs example for Connect middleware (#442)

Summary:
**Summary**

The current docs are lacking an example for creating a Connect middleware. I've added an example and also addressed an issue on the docs page regarding a layout issue on the platforms

![image](https://user-images.githubusercontent.com/10043789/62825330-3b958580-bbaa-11e9-9bb0-848ab0e01a40.png)
Pull Request resolved: #442

Differential Revision: D17317360

Pulled By: cpojer

fbshipit-source-id: e7c896db4e4352ba305848da8fb77ae62767d19f

docs/API.md

@@ -11,26 +11,44 @@ title: API
 
 ## Quick Start
 
-  - Compile a file
+- Compile a file
 
-    ```
-    const config = await Metro.loadConfig();
+  ```js
+  const config = await Metro.loadConfig();
 
-    await Metro.runBuild(config, {
-      entry: 'index.js',
-      out: 'bundle.js',
-    });
-    ```
+  await Metro.runBuild(config, {
+    entry: 'index.js',
+    out: 'bundle.js',
+  });
+  ```
 
-  - Run a server & watch the filesystem for changes
+- Run a server and watch the filesystem for changes
 
-    ```
-    const config = await Metro.loadConfig();
+  ```js
+  const config = await Metro.loadConfig();
 
-    await Metro.runServer(config, {
-      port: 8080,
-    });
-    ```
+  await Metro.runServer(config, {
+    port: 8080,
+  });
+  ```
+
+- Create a Connect middleware and plug it into a server
+
+  ```js
+  const Metro = require('metro');
+  const express = require('express');
+  const app = express();
+  const server = require('http').Server(app);
+
+  Metro.loadConfig().then(async config => {
+    const connectMiddleware = await Metro.createConnectMiddleware(config);
+    const {server: {port}} = config;
+
+    app.use(connectMiddleware.middleware);
+    server.listen(port);
+    connectMiddleware.attachHmrServer(server);
+  });
+  ```
 
 ## Reference
 

docs/CLI.md

@@ -15,7 +15,7 @@ Generates a JavaScript bundle containing the specified entrypoint and its descen
 | Option   | Alias    | Description    | Value |
 |----------|----------|----------|----------|
 | `out`    | `O` | File name where to store the output | String |
-| `platform` | `p` | Which platform to bundle for | `web` \| `android` \| `ios` |
+| `platform` | `p` | Which platform to bundle for | `web`, `android`, `ios` |
 | `minify` | `z` | Whether Metro should minify the bundle | Boolean |
 | `dev` | `g` | Create a development version of the build (`process.env.NODE_ENV = 'development'`) | Boolean |
 | `config` | `c` | Location of the `metro.config.js` to use | String |

docs/GettingStarted.md

@@ -5,13 +5,13 @@ title: Getting Started
 
 Install Metro using [`npm`](https://www.npmjs.com/):
 
-```
+```bash
 npm install --save-dev metro metro-core
 ```
 
 Or via [`yarn`](https://yarnpkg.com/):
 
-```
+```bash
 yarn add --dev metro metro-core
 ```
 
@@ -74,7 +74,7 @@ app.use(
 app.listen(8081);
 ```
 
-### Method `runServer(Config, Options)`
+### Method `runServer(config, options)`
 
 Starts a development server based on the given configuration and options. Returns the server.
 We recommend using `runMetro` instead of `runServer`, `runMetro` calls this function.
@@ -88,7 +88,15 @@ We recommend using `runMetro` instead of `runServer`, `runMetro` calls this func
 * `secureCert (string)`: The cert to use for `https` when `secure` is on.
 * `hmrEnabled (boolean)`: Whether Hot Module Replacement is turned on.
 
-### Method `runBuild(Config, Options)`
+```js
+const config = await Metro.loadConfig();
+
+await Metro.runServer(config, {
+  port: 8080,
+});
+```
+
+### Method `runBuild(config, options)`
 
 Given a configuration and a set of options that you would typically pass to a server, plus a set of options specific to the bundle itself, a bundle will be built. The return value is a Promise that resolves to an object with two properties, `code` and `map`. This is useful at build time.
 
@@ -107,6 +115,40 @@ Given a configuration and a set of options that you would typically pass to a se
 * `sourceMap (boolean)`: Whether Metro should generate source maps.
 * `sourceMapUrl (string)`: URL where the source map can be found. It defaults to the same same URL as the bundle, but changing the extension from `.bundle` to `.map`. When `inlineSourceMap` is `true`, this property has no effect.
 
+```js
+const config = await Metro.loadConfig();
+
+await Metro.runBuild(config, {
+  platform: 'ios',
+  minify: true,
+  out: '/Users/Metro/metro-ios.js'
+});
+```
+
+### Method `createConnectMiddleware(config)`
+
+Instead of creating the full server, creates a Connect middleware that answers to bundle requests. This middleware can then be plugged into your own servers. The `port` parameter is optional and only used for logging purposes.
+
+#### Options
+
+* `port (number)`: Port for the Connect Middleware (Only for logging purposes).
+
+```js
+const Metro = require('metro');
+const express = require('express');
+const app = express();
+const server = require('http').Server(app);
+
+Metro.loadConfig().then(async config => {
+  const connectMiddleware = await Metro.createConnectMiddleware(config);
+  const {server: {port}} = config;
+
+  app.use(connectMiddleware.middleware);
+  server.listen(port);
+  connectMiddleware.attachHmrServer(server);
+});
+```
+
 ## Available options
 
 ### Configuration