waylon/netlify-faunadb-example2
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

update post

Browse source
This commit is contained in:
DavidWells 2018-07-01 18:43:11 -07:00
parent 17a9ba47a8
commit ec8155b161
1 changed files with 23 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

30
README.md
View file

@ -7,11 +7,12 @@ Example of using [FaunaDB](https://fauna.com/) with [Netlify functions](https://
- [Setup & Run Locally](#setup--run-locally) - [Setup & Run Locally](#setup--run-locally)
- [TLDR; Quick Deploy](#tldr-quick-deploy) - [TLDR; Quick Deploy](#tldr-quick-deploy)
- [Tutorial](#tutorial) - [Tutorial](#tutorial)
* [Background](#background)
* [1. Create React app](#1-create-react-app) * [1. Create React app](#1-create-react-app)
* [2. Setup FaunaDB](#2-setup-faunadb) * [2. Setup FaunaDB](#2-setup-faunadb)
* [3. Create a function](#3-create-a-function) * [3. Create a function](#3-create-a-function)
+ [Anatomy of a Lambda function](#anatomy-of-a-lambda-function) + [Anatomy of a Lambda function](#anatomy-of-a-lambda-function)
+ [Setup](#setup) + [Setting up functions for local development](#setting-up-functions-for-local-development)
* [4. Connect the function to the frontend app](#4-connect-the-function-to-the-frontend-app) * [4. Connect the function to the frontend app](#4-connect-the-function-to-the-frontend-app)
* [5. Finishing the Backend Functions](#5-finishing-the-backend-functions) * [5. Finishing the Backend Functions](#5-finishing-the-backend-functions)
* [Wrapping Up](#wrapping-up) * [Wrapping Up](#wrapping-up)
@ -71,15 +72,24 @@ This application is using [React](https://reactjs.org/) for the frontend, [Netli
## Tutorial ## Tutorial
Lets run through how to create Netlify functions and connect them to our frontend application. ### Background
1. Create React app This application is using [React](https://reactjs.org/) for the frontend, [Netlify Functions](https://www.netlify.com/docs/functions/) for API calls, and [FaunaDB](https://fauna.com/) as the backing database.
2. Setup FaunaDB
3. Create a function We are going to explore how to get up and running with netlify functions and how to deploy your own serverless backend.
4. Connect the function to the frontend app
So, lets dive right in!
### 1. Create React app ### 1. Create React app
We are using React for this demo app, but you can use whatever you want to manage the frontend.
Into VueJS? Awesome use that.
Miss the days of jQuery? Righto jQuery away!
Fan of vanillaJS? By all means, have at it!
1. Install create react app 1. Install create react app
```bash ```bash
@ -102,7 +112,9 @@ Lets run through how to create Netlify functions and connect them to our fronten
### 2. Setup FaunaDB ### 2. Setup FaunaDB
First things first, we need to setup a FaunaDB account and get our API key we will use to scaffold out our todos database. We are using FaunaDB to hold and store all of our todo data.
So setup a FaunaDB account and get our API key we will use to scaffold out our todos database.
Head over to [https://app.fauna.com/sign-up](https://app.fauna.com/sign-up) to create a free Fauna Account. Head over to [https://app.fauna.com/sign-up](https://app.fauna.com/sign-up) to create a free Fauna Account.
@ -181,7 +193,7 @@ exports.handler = (event, context, callback) => {
We are going to use the `faunadb` npm package to connect to our Fauna Database and create an item We are going to use the `faunadb` npm package to connect to our Fauna Database and create an item
#### Setup #### Setting up functions for local development
Lets rock and roll. Lets rock and roll.
@ -379,6 +391,8 @@ Requests to `/.netlify/function/[Function-File-Name]` will work seamlessly on lo
We will be skipping over the rest of the frontend parts of the app because you can use whatever framework you'd like to build your application. We will be skipping over the rest of the frontend parts of the app because you can use whatever framework you'd like to build your application.
All the demo React frontend code is [available here](https://github.com/netlify/netlify-faunadb-example/tree/17a9ba47a8b1b2408b68e793fba4c5fd17bf85da/src)
### 5. Finishing the Backend Functions ### 5. Finishing the Backend Functions
So far we have created our `todo-create` function done and we've seen how we make requests to our live function endpoints. It's now time to add the rest of our CRUD functions to manage our todos. So far we have created our `todo-create` function done and we've seen how we make requests to our live function endpoints. It's now time to add the rest of our CRUD functions to manage our todos.