add simple dynamic html example

DavidWells · DavidWells · commit 86cf1c34b911 · 2016-11-26T18:33:14.000-08:00
diff --git a/aws-node-serve-dynamic-html/README.md b/aws-node-serve-dynamic-html/README.md
@@ -0,0 +1,22 @@
+# Serving Dynamic HTML via API Gateway Example
+
+These examples illustrate how to hookup an API Gateway endpoint to a Lambda function to render HTML on a `GET` request.
+
+Instead of returning the default `json` from requests to an endpoint, you can display custom dynamic HTML by setting the `Content-Type` header.
+
+```js
+const response = {
+  statusCode: 200,
+  headers: {
+    'Content-Type': 'text/html',
+  },
+  body: html,
+};
+// callback will send HTML back
+callback(null, response);
+```
+
+## Use-cases
+
+- landing pages for marketing activities
+- dynamic single use webpages
diff --git a/aws-node-serve-dynamic-html/handler.js b/aws-node-serve-dynamic-html/handler.js
@@ -0,0 +1,33 @@
+
+// Your function handler
+module.exports.serveHtml = (event, context, callback) => {
+  let dynamicHtml;
+  /* check for GET params and use if available */
+  if (event.queryStringParameters && event.queryStringParameters.name) {
+    // yourendpoint.com/{stage}/landing-page?name=bob
+    dynamicHtml = `<p>Hey ${event.queryStringParameters.name}</p>`;
+  } else {
+    dynamicHtml = '';
+  }
+
+  const html = `
+  <html>
+    <style>
+      h1 { color: blue; }
+    </style>
+    <body>
+      <h1>Landing Page</h1>
+      ${dynamicHtml}
+    </body>
+  </html>`;
+
+  const response = {
+    statusCode: 200,
+    headers: {
+      'Content-Type': 'text/html',
+    },
+    body: html,
+  };
+  // callback will send HTML back
+  callback(null, response);
+};
diff --git a/aws-node-serve-dynamic-html/serverless.yml b/aws-node-serve-dynamic-html/serverless.yml
@@ -0,0 +1,14 @@
+# Serving HTML through API Gateway for AWS Lambda
+service: serve-html
+
+provider:
+  name: aws
+  runtime: nodejs4.3
+
+functions:
+  staticHtml:
+    handler: handler.serveHtml
+    events:
+      - http:
+          method: get
+          path: landing-page
