add async example

Author: swyx

README.md

@@ -2,7 +2,7 @@ This project is based on [Create React App v2](https://github.com/facebookincuba
 
 The main addition is a new folder: `src/lambda`. Each JavaScript file in there will automatically be prepared for Lambda function deployment.
 
-As an example, we've included a small `src/lambda/hello.js` function, which will be deployed to `/.netlify/functions/hello`.
+As an example, we've included a small `src/lambda/hello.js` function, which will be deployed to `/.netlify/functions/hello`. We've also included an async lambda example using async/await syntax in `async-chuck-norris.js`.
 
 [![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/netlify/create-react-app-lambda)
 

package.json

@@ -3,6 +3,7 @@
   "version": "0.4.0",
   "private": true,
   "dependencies": {
+    "node-fetch": "^2.3.0",
     "react": "^16.6.3",
     "react-dom": "^16.6.3",
     "react-scripts": "^2.1.1"

src/App.js

@@ -8,11 +8,11 @@ class LambdaDemo extends Component {
     this.state = { loading: false, msg: null };
   }
 
-  handleClick = e => {
+  handleClick = api => e => {
     e.preventDefault();
 
     this.setState({ loading: true });
-    fetch('/.netlify/functions/hello')
+    fetch('/.netlify/functions/' + api)
       .then(response => response.json())
       .then(json => this.setState({ loading: false, msg: json.msg }));
   };
@@ -22,9 +22,12 @@ class LambdaDemo extends Component {
 
     return (
       <p>
-        <button onClick={this.handleClick}>
+        <button onClick={this.handleClick('hello')}>
           {loading ? 'Loading...' : 'Call Lambda'}
         </button>
+        <button onClick={this.handleClick('async-chuck-norris')}>
+          {loading ? 'Loading...' : 'Call Async Lambda'}
+        </button>
         <br />
         <span>{msg}</span>
       </p>

src/lambda/async-chuck-norris.js

@@ -0,0 +1,25 @@
+// example of async handler using async-await
+// https://github.com/netlify/netlify-lambda/issues/43#issuecomment-444618311
+
+import fetch from 'node-fetch';
+export async function handler(event, context) {
+  try {
+    const response = await fetch('https://api.chucknorris.io/jokes/random');
+    if (!response.ok) {
+      // NOT res.status >= 200 && res.status < 300
+      return { statusCode: response.status, body: response.statusText };
+    }
+    const data = await response.json();
+
+    return {
+      statusCode: 200,
+      body: JSON.stringify({ msg: data.value })
+    };
+  } catch (err) {
+    console.log(err); // output to netlify function log
+    return {
+      statusCode: 500,
+      body: JSON.stringify({ msg: err.message }) // Could be a custom message or object i.e. JSON.stringify(err)
+    };
+  }
+}

yarn.lock

@@ -6046,6 +6046,11 @@ no-case@^2.2.0:
   dependencies:
     lower-case "^1.1.1"
 
+node-fetch@^2.3.0:
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.3.0.tgz#1a1d940bbfb916a1d3e0219f037e89e71f8c5fa5"
+  integrity sha512-MOd8pV3fxENbryESLgVIeaGKrdl+uaYhCSSVkjeOb/31/njTpcis5aWfdqgNlHIrKOLRbMnfPINPOML2CIFeXA==
+
 [email protected]:
   version "0.7.5"
   resolved "https://registry.yarnpkg.com/node-forge/-/node-forge-0.7.5.tgz#6c152c345ce11c52f465c2abd957e8639cd674df"