diff --git a/README.md b/README.md index 17d2d9e..3d4872a 100644 --- a/README.md +++ b/README.md @@ -120,7 +120,7 @@ Head over to [https://app.fauna.com/sign-up](https://app.fauna.com/sign-up) to c ![Copy API key for future use](https://user-images.githubusercontent.com/532272/42112934-6d6499e0-7b9e-11e8-81ea-be57249895b1.png) -5. Create your FaunaDB database +5. **Create your FaunaDB database** Set the FaunaDB API key locally in your terminal @@ -183,14 +183,14 @@ We are going to use the `faunadb` npm package to connect to our Fauna Database a Lets rock and roll. -1. Create a `./functions` directory with there +1. **Create a `./functions` directory** ```bash # make functions directory mdkir functions ``` -2. Install `netlify-lambda` +2. **Install `netlify-lambda`** [Netlify lambda](https://github.com/netlify/netlify-lambda) is a tool for locally emulating the serverless function for development and for bundling our serverless function with third party npm modules (if we are using those) @@ -219,7 +219,9 @@ Lets rock and roll. This will proxy requests we make to `/.netlify/functions` to our locally running function server at port 9000. -3. Add our `start` & `build` command to npm scripts in `package.json` +3. **Add our `start` & `build` commands** + + Lets go ahead and add our `start` & `build` command to npm scripts in `package.json`. These will let us running things locally and give a command for netlify to run to build our app & functions when we are ready to deploy. We are going to be using the `npm-run-all` npm module to run our frontend & backend in parallel in the same terminal window. @@ -287,7 +289,7 @@ Lets rock and roll. ``` -4. Install FaunaDB and write the create function +4. **Install FaunaDB and write the create function** We are going to be using the `faunadb` npm module to call into our todos index in FaunaDB. @@ -299,18 +301,21 @@ Lets rock and roll. Then create a new function file in `/functions` called `todos-create.js` - + ```js - /* Import faunaDB sdk */ - import faunadb from 'faunadb' - + /* code from functions/todos-create.js */ + import faunadb from 'faunadb' /* Import faunaDB sdk */ + + /* configure faunaDB Client with our secret */ const q = faunadb.query const client = new faunadb.Client({ secret: process.env.FAUNADB_SECRET }) - + + /* export our lambda function as named "handler" export */ exports.handler = (event, context, callback) => { + /* parse the string body into a useable JS object */ const data = JSON.parse(event.body) console.log("Function `todo-create` invoked", data) const todoItem = { @@ -320,12 +325,14 @@ Lets rock and roll. return client.query(q.Create(q.Ref("classes/todos"), todoItem)) .then((response) => { console.log("success", response) + /* Success! return the response with statusCode 200 */ return callback(null, { statusCode: 200, body: JSON.stringify(response) }) }).catch((error) => { console.log("error", error) + /* Error! return the error with statusCode 400 */ return callback(null, { statusCode: 400, body: JSON.stringify(error) @@ -337,12 +344,11 @@ Lets rock and roll. ### 3. Connect the function to the frontend app -Inside of your react app. You can now wire up the `/.netlify/functions/todos-create` endpoint to an AJAX request +Inside of the react app, we can now wire up the `/.netlify/functions/todos-create` endpoint to an AJAX request. ```js // Function using fetch to POST to our API endpoint function createTodo(data) { - console.log('run new create function') return fetch('/.netlify/functions/todos-create', { body: JSON.stringify(data), method: 'POST' @@ -358,8 +364,9 @@ const myTodo = { } // create it! -createTodo(myTodo).then(() => { - +createTodo(myTodo).then((response) => { + console.log('API response', response) + // set app state }).catch((error) => { console.log('API error', error) }) diff --git a/functions/todos-create.js b/functions/todos-create.js index c353543..ad858e9 100644 --- a/functions/todos-create.js +++ b/functions/todos-create.js @@ -1,12 +1,14 @@ -/* Import faunaDB sdk */ -import faunadb from 'faunadb' +import faunadb from 'faunadb' /* Import faunaDB sdk */ +/* configure faunaDB Client with our secret */ const q = faunadb.query const client = new faunadb.Client({ secret: process.env.FAUNADB_SECRET }) +/* export our lambda function as named "handler" export */ exports.handler = (event, context, callback) => { + /* parse the string body into a useable JS object */ const data = JSON.parse(event.body) console.log("Function `todo-create` invoked", data) const todoItem = { @@ -16,12 +18,14 @@ exports.handler = (event, context, callback) => { return client.query(q.Create(q.Ref("classes/todos"), todoItem)) .then((response) => { console.log("success", response) + /* Success! return the response with statusCode 200 */ return callback(null, { statusCode: 200, body: JSON.stringify(response) }) }).catch((error) => { console.log("error", error) + /* Error! return the error with statusCode 400 */ return callback(null, { statusCode: 400, body: JSON.stringify(error) diff --git a/functions/todos-delete-batch.js b/functions/todos-delete-batch.js index d671fc5..3e0479c 100644 --- a/functions/todos-delete-batch.js +++ b/functions/todos-delete-batch.js @@ -1,4 +1,3 @@ -/* Import faunaDB sdk */ import faunadb from 'faunadb' import getId from './utils/getId' diff --git a/functions/todos-delete.js b/functions/todos-delete.js index 93b25cb..122f028 100644 --- a/functions/todos-delete.js +++ b/functions/todos-delete.js @@ -1,4 +1,3 @@ -/* Import faunaDB sdk */ import faunadb from 'faunadb' import getId from './utils/getId' diff --git a/functions/todos-read-all.js b/functions/todos-read-all.js index 403dbf5..05e81a8 100644 --- a/functions/todos-read-all.js +++ b/functions/todos-read-all.js @@ -1,4 +1,3 @@ -/* Import faunaDB sdk */ import faunadb from 'faunadb' const q = faunadb.query diff --git a/functions/todos-read.js b/functions/todos-read.js index 92e382a..f5b388b 100644 --- a/functions/todos-read.js +++ b/functions/todos-read.js @@ -1,4 +1,3 @@ -/* Import faunaDB sdk */ import faunadb from 'faunadb' import getId from './utils/getId' diff --git a/functions/todos-update.js b/functions/todos-update.js index 3333d71..76486fc 100644 --- a/functions/todos-update.js +++ b/functions/todos-update.js @@ -1,4 +1,3 @@ -/* Import faunaDB sdk */ import faunadb from 'faunadb' import getId from './utils/getId' diff --git a/package.json b/package.json index 3ced196..32d5dd8 100644 --- a/package.json +++ b/package.json @@ -22,7 +22,7 @@ "test": "react-scripts test --env=jsdom" }, "devDependencies": { - "markdown-magic": "^0.1.22", + "markdown-magic": "^0.1.23", "netlify-lambda": "^0.4.0", "npm-run-all": "^4.1.3" },