docs: refresh 1.2.0

website/i18n/en.json

@@ -5,6 +5,9 @@
     "previous": "Previous",
     "tagline": "A framework for building conversational user interfaces.",
     "docs": {
+      "advanced-guides-custom-server": {
+        "title": "Running Bottender with Custom Servers"
+      },
       "advanced-guides-deployment": {
         "title": "Deployment"
       },
@@ -65,6 +68,9 @@
       "channel-line-handling-events": {
         "title": "Handling LINE Events"
       },
+      "channel-line-liff": {
+        "title": "LINE Front-end Framework (LIFF)"
+      },
       "channel-line-migrating-from-sdk": {
         "title": "Migrating from LINE SDK for Node.js"
       },
@@ -452,9 +458,15 @@
       "version-1.1.0/version-1.1.0-the-basics-routing": {
         "title": "Routing"
       },
+      "version-1.2.0/version-1.2.0-advanced-guides-custom-server": {
+        "title": "Running Bottender with Custom Servers"
+      },
       "version-1.2.0/version-1.2.0-advanced-guides-nlu": {
         "title": "Natural Language Understanding"
       },
+      "version-1.2.0/version-1.2.0-channel-line-liff": {
+        "title": "LINE Front-end Framework (LIFF)"
+      },
       "version-1.2.0/version-1.2.0-channel-line-sending-messages": {
         "title": "Sending LINE Messages"
       },

website/versioned_docs/version-1.2.0/advanced-guides-custom-server.md

@@ -0,0 +1,261 @@
+---
+id: version-1.2.0-advanced-guides-custom-server
+title: Running Bottender with Custom Servers
+original_id: advanced-guides-custom-server
+---
+
+## The Concept
+
+`bottender dev` and `bottender start` are the default npm scripts generated by [create-bottender-app](getting-started#create-a-new-bottender-app).
+
+Thus, You can find those lines in your generated `package.json`:
+
+```json
+{
+  ...
+  "scripts": {
+    "dev": "bottender dev",
+    "start": "bottender start",
+    ...
+  },
+  ...
+}
+```
+
+When executing one of `bottender dev` or `bottender start` command, under the hood, it setups a default express server for Bottender and load `index.js` from the project root directory as the root action of the chatbot.
+
+To run Bottender with the custom HTTP server, we need to prepare an HTTP server, delegate the webhook routes to Bottender, and modify the setting of `package.json`.
+
+## Express
+
+### Creating A New Project with Custom Express Server
+
+If you want to have a clean project with the custom express, you could start from [this example](https://github.com/Yoctol/bottender/tree/master/examples/custom-server-express) to develop your project. There are four steps you could follow to create your project:
+
+1. Download the code from [this example](https://github.com/Yoctol/bottender/tree/master/examples/custom-server-express).
+2. Run `yarn` or `npm install` command to install all dependencies.
+3. Fill the `.env` file with correct value.
+4. Run `yarn dev` or `npm run dev` to start the dev server.
+
+If you want to have the folder structure we recommended, you could start with [create-bottender-app](getting-started#create-a-new-bottender-app) command and migrate it to the custom express server by following the migration instructions below.
+
+### Migrating An Existing Project to Custom Express Server
+
+Suppose that you already have a project built from [create-bottender-app](getting-started#create-a-new-bottender-app), and you want to develop some additional APIs using express server. In this case, you need to write a custom express server and delegate all chatbot's webhook requests to the Bottender app.
+
+To achieve that, you could follow the instructions, as shown below:
+
+1. Run `yarn add express body-parser nodemon` or `npm install express body-parser nodemon` command to install dependencies we need.
+2. Create a `server.js` file in the root directory of the project and copy the following code into it.
+
+```js
+const bodyParser = require('body-parser');
+const express = require('express');
+const { bottender } = require('bottender');
+
+const app = bottender({
+  dev: process.env.NODE_ENV !== 'production',
+});
+
+const port = Number(process.env.PORT) || 5000;
+
+// the request handler of the bottender app
+const handle = app.getRequestHandler();
+
+app.prepare().then(() => {
+  const server = express();
+
+  server.use(
+    bodyParser.json({
+      verify: (req, _, buf) => {
+        req.rawBody = buf.toString();
+      },
+    })
+  );
+
+  // your custom route
+  server.get('/api', (req, res) => {
+    res.json({ ok: true });
+  });
+
+  // route for webhook request
+  server.all('*', (req, res) => {
+    return handle(req, res);
+  });
+
+  server.listen(port, err => {
+    if (err) throw err;
+    console.log(`> Ready on http://localhost:${port}`);
+  });
+});
+```
+
+3. Modify scripts in the `package.json` to `nodemon server.js` and `node server.js` instead:
+
+```json
+{
+  ...
+  "scripts": {
+    "dev": "nodemon server.js",
+    "start": "node server.js",
+    ...
+  },
+  ...
+}
+```
+
+That's all you need to do, and you can have you bot hosting on the custom express server!
+
+## Koa
+
+### Creating A New Project with Custom Koa Server
+
+If you want to have a clean project with the custom koa, you could start from [this example](https://github.com/Yoctol/bottender/tree/master/examples/custom-server-koa) to develop your project. There are four steps you could follow to create your project:
+
+1. Download the code from [this example](https://github.com/Yoctol/bottender/tree/master/examples/custom-server-koa).
+2. Run `yarn install` command to install dependencies.
+3. Fill the `.env` file with correct value.
+4. Run `yarn dev` to start server.
+
+If you want to have the folder structure we recommended, you could start with [create-bottender-app](getting-started#create-a-new-bottender-app) command and migrate it to the custom koa server by following the migration instructions below.
+
+### Migrating An Existing Project to Custom Koa Server
+
+Suppose that you already have a project built from [create-bottender-app](getting-started#create-a-new-bottender-app), and you want to develop some additional APIs using koa server. In this case, you need to write a custom koa server and delegate all chatbot's webhook requests to the Bottender app.
+
+To achieve that, you could follow the instructions, as shown below:
+
+1. Run `yarn add koa koa-router koa-bodyparser nodemon` or `npm install koa koa-router koa-bodyparser nodemon` command to install dependencies we need.
+2. Create a `server.js` file in the root directory of the project and copy the following code into it.
+
+```js
+const Koa = require('koa');
+const Router = require('koa-router');
+const bodyParser = require('koa-bodyparser');
+const { bottender } = require('bottender');
+
+const app = bottender({
+  dev: process.env.NODE_ENV !== 'production',
+});
+
+const port = Number(process.env.PORT) || 5000;
+
+const handle = app.getRequestHandler();
+
+app.prepare().then(() => {
+  const server = new Koa();
+  const router = new Router();
+
+  router.get('/api', ctx => {
+    ctx.response.body = { ok: true };
+  });
+
+  router.all('*', async ctx => {
+    await handle(ctx.req, ctx.res);
+    ctx.respond = false;
+  });
+
+  server.use(bodyParser());
+  server.use((ctx, next) => {
+    ctx.req.body = ctx.request.body;
+    ctx.req.rawBody = ctx.request.rawBody;
+    return next();
+  });
+  server.use(router.routes());
+
+  server.listen(port, err => {
+    if (err) throw err;
+    console.log(`> Ready on http://localhost:${port}`);
+  });
+});
+```
+
+3. Modify scripts in the `package.json` to `nodemon server.js` and `node server.js` instead:
+
+```json
+{
+  ...
+  "scripts": {
+    "dev": "nodemon server.js",
+    "start": "node server.js",
+    ...
+  },
+  ...
+}
+```
+
+That's all you need to do, and you can have you bot hosting on the custom koa server!
+
+## Restify
+
+### Creating A New Project with Custom Restify Server
+
+If you want to have a clean project with the custom restify, you could start from [this example](https://github.com/Yoctol/bottender/tree/master/examples/custom-server-restify) to develop your project. There are four steps you could follow to create your project:
+
+1. Download the code from [this example](https://github.com/Yoctol/bottender/tree/master/examples/custom-server-restify).
+2. Run `yarn install` command to install dependencies.
+3. Fill the `.env` file with correct value.
+4. Run `yarn dev` to start server.
+
+If you want to have the folder structure we recommended, you could start with [create-bottender-app](getting-started#create-a-new-bottender-app) command and migrate it to the custom restify server by following the migration instructions below.
+
+### Migrating An Existing Project to Custom Restify Server
+
+Suppose that you already have a project built from [create-bottender-app](getting-started#create-a-new-bottender-app), and you want to develop some additional APIs using restify server. In this case, you need to write a custom restify server and delegate all chatbot's webhook requests to the Bottender app.
+
+To achieve that, you could follow the instructions, as shown below:
+
+1. Run `yarn add restify nodemon` or `npm install restify nodemon` command to install dependencies we need.
+2. Create a `server.js` file in the root directory of the project and copy the following code into it.
+
+```js
+const restify = require('restify');
+const { bottender } = require('bottender');
+
+const app = bottender({
+  dev: process.env.NODE_ENV !== 'production',
+});
+
+const port = Number(process.env.PORT) || 5000;
+
+const handle = app.getRequestHandler();
+
+app.prepare().then(() => {
+  const server = restify.createServer();
+
+  server.use(restify.plugins.queryParser());
+  server.use(restify.plugins.bodyParser());
+
+  server.get('/api', (req, res) => {
+    res.send({ ok: true });
+  });
+
+  server.get('*', (req, res) => {
+    return handle(req, res);
+  });
+  server.post('*', (req, res) => {
+    return handle(req, res);
+  });
+
+  server.listen(port, err => {
+    if (err) throw err;
+    console.log(`> Ready on http://localhost:${port}`);
+  });
+});
+```
+
+3. Modify scripts in the `package.json` to `nodemon server.js` and `node server.js` instead:
+
+```json
+{
+  ...
+  "scripts": {
+    "dev": "nodemon server.js",
+    "start": "node server.js",
+    ...
+  },
+  ...
+}
+```
+
+That's all you need to do, and you can have you bot hosting on the custom restify server!