Learn Faunadb, React-storybook and Tachyons

This application serves as an introduction to building products with a JAMStack and Serverless approach. We cover everything from the beginning:

* starting with the Gatsby client
* handling authentication with Netlify Identity
* Shipping a GraphQL server on Netlify Functions
* Building in access control with a serverless capable database

It uses tools that remove as many of the barriers as possible while also allowing upgrading in the future. Netlify Functions can grow into AWS Lambda, Netlify Identity can grow into Auth0 or Cognito, and FaunaDB can grow into DynamoDB.

Gatsby is a blazing fast static site generator built with React. Gatsby gives you all of the modern JavaScript tools you want; set up and ready to go out of the box.

gatsby

Building a Serverless JAMStack Todo app with Netlify, Gatsby, GraphQL, and FaunaDB

This collection is a sequel to the [Building a Serverless JAMStack Todo app with Netlify, Gatsby, GraphQL, and FaunaDB](https://egghead.io/playlists/building-a-serverless-jamstack-todo-app-with-netlify-gatsby-graphql-and-faunadb-53bb) collection. In this collection we take the TODO application we built and convert it to run using Netlify Identity, AWS Lambda (using the serverless framework) and DynamoDB. We cover

* Fauna vs DynamoDB and when to use each
* Setting up AWS accounts
* Creating DynamoDB tables and data modeling differences between Fauna and Dynamo
* Converting our Netlify Functions deployment to a Serverless Framework deployment
* Implementing Custom authorizer functions on AWS

It uses tools that remove as many of the barriers as possible. Netlify Functions grows into Serverless Framework adn AWS Lambda, Netlify Identity is kept around, and FaunaDB can grows into DynamoDB.



FaunaDB is a global serverless database that gives you ubiquitous, low latency access to app data, without sacrificing data correctness. It eliminates layers of app code for manually handling data anomalies, security, and scale, creating a friendlier dev experience for you and better app experience for your users.

faunadb

Converting a Serverless App to run on AWS Lambda and DynamoDB with Serverless Framework

FaunaDB is a global serverless database that gives you ubiquitous, low latency access to app data, without sacrificing data correctness. It eliminates layers of app code for manually handling data anomalies, security, and scale, creating a friendlier dev experience for you and better app experience for your users.

Fauna is inspired by [Calvin](https://blog.acolyer.org/2019/03/29/calvin-fast-distributed-transactions-for-partitioned-database-systems/), has [built-in GraphQL integration](https://docs.fauna.com/fauna/current/api/graphql/), and a query language based on lambda calculus. Be sure to check out the [Jepsen analysis](https://jepsen.io/analyses/faunadb-2.5.4) and the associated [chart of consistency models](https://jepsen.io/consistency)

The Complete Guide to FaunaDB

React is one of the web’s most popular frameworks for building JavaScript applications. 

If you know what you’re doing, React can drastically simplify how you build, use, and maintain code.

Whether you’re a React newbie or you’re ready for advanced techniques, you can level-up with egghead. Explore our in-depth courses, lessons, and community resources to build more powerful applications and crack open your career.

react

Storybook is a UI component development environment for React, Vue, and Angular. With that, you can develop UI components without running your app.

Here I show how best to configure a React Storybook to use [Typescript](/q/typescript) (with TSX). This lets you write your reusable components with maximal type safety. Please see the provided code for the full source.

Configure React Storybook for use with Typescript

FaunaDB is a Calvin inspired hosted database marketed towards JAMStack and serverless users. It is geo-replicated across multiple providers (AWS, GCP, and soon Azure), uses a lambda calculus based query language (FQL) or the built-in GraphQL support, and is quick to get started with. Don't worry about the vocabulary here (Consistency, lambda calculus, etc), FaunaDB can be quickly put to work without reading any papers and without knowing what lambda calculus is.

* [Calvin Paper](http://cs.yale.edu/homes/thomson/publications/calvin-sigmod12.pdf) (warning: pdf link)
  - [Morning Paper Overview of Calvin Paper](https://blog.acolyer.org/2019/03/29/calvin-fast-distributed-transactions-for-partitioned-database-systems/) if you don't want to read the whole paper
* [jepsen report](https://jepsen.io/analyses/faunadb-2.5.4)

An Introduction to FaunaDB

FQL is the main query language for interacting with FaunaDB. It supports all JSON types, plus some additional types like Ref, Date, and Set. FQL is based in expressions and as such everything returns a value. This makes it easy to compose logic into larger queries.

Code shown in the shell:

```
Match(Index("all_customers"))
```

Overview of the FaunaDB Query Language

When working with FQL it's often the case that you'll encounter `Ref`s. `Ref`s don't have any fields on them though! So how do we access the fields? `Get`.

```
Collections()
```

```
Collection("customers")
```

```
Ref(Collection("customers"), "244075679454331401")
```

```
Get(Ref(Collection("customers"), "244075679454331401"))
```

```
Get(Collection("customers"))
```



Refs and Get in FaunaDB

FQL Page objects have additional fields like `before`, and `data`, that may make it seem like you need to `Select` to get at the underlying array of results. However, FQL supports passing Page objects directly to functions that operate on arrays and the function will transparently operate on the contained `data` field.

```
Paginate(Match(Index("all_customers")))
```

```
Drop(1, Paginate(Match(Index("all_customers"))))
```

```
Take(1, Paginate(Match(Index("all_customers"))))
```

FQL Page objects can be arguments to array functions

`Ref`s are opaque. To access the fields on a document associated with a Ref, we first need to run `Get` on our results and then we can access fields using `Select`

```
Map(
  Paginate(Match(Index("all_customers"))),
  Lambda("X", Get(Var("X")))
)
```

```
Map(
  Paginate(Match(Index("all_customers"))),
  Lambda("X", Select(["data", "firstName"], Get(Var("X"))))
)
```

Accessing fields through Refs with Select

We walk through creating a new Database in the FaunaDB console complete with some demo data. We do some exploration of the data, introducing concepts like Collections and Indexes, before showing an example FQL query that runs against the database. This sets us up to talk about FQL in future videos

Creating your first FaunaDB database

Overview of the FaunaDB Query Language (FQL)

When working with FQL it's often the case that you'll encounter Refs. Refs don't have any fields on them though! So how do we access the fields? Get.

```
Collections()
```

```
Collection("customers")
```

```
Ref(Collection("customers"), "244075679454331401")
```

```
Get(Ref(Collection("customers"), "244075679454331401"))
```

```
Get(Collection("customers"))
```

Getting fields out of Refs with Get

FQL Page objects have additional fields like before, and data, that may make it seem like you need to Select to get at the underlying array of results. However, FQL supports passing Page objects directly to functions that operate on arrays and the function will transparently operate on the contained data field.

```
Paginate(Match(Index("all_customers")))
```

```
Drop(1, Paginate(Match(Index("all_customers"))))
```

```
Take(1, Paginate(Match(Index("all_customers"))))
```

FQL Page objects can be arguments to Array functions

Lambdas allow you to use functions like Map or Filter effectively in FQL. In this lesson we should the Lambda syntax by operating on some paginated results.

```
Paginate(Match(Index("all_customers")))
```

```
Map(
  Paginate(Match(Index("all_customers"))),
  Lambda("X", Get(Var("X")))
)
```

Using FQL Lambda in Array functions

`Ref`s are opaque. To access the fields on a document associated with a `Ref`, we first need to run `Get` on our results and then we can access fields using `Select`

```
Map(
  Paginate(Match(Index("all_customers"))),
  Lambda("X", Get(Var("X")))
)
```

```
Map(
  Paginate(Match(Index("all_customers"))),
  Lambda("X", Select(["data", "firstName"], Get(Var("X"))))
)
```

FaunaDB supports access keys with four sets of permissions, or roles. You need an access token to use a language driver like the Go driver to access FaunaDB. It is not exposed by default. The four roles are: Admin, Server, Server-ReadOnly, and Client. We'll go over what these roles are and how to choose one for your use case.

Creating an access token and choosing a role for it

You can use array and object literals to compose multiple selections into a single query, such as within a lambda.

```
Map(
  Paginate(Match(Index("all_customers"))),
  Lambda(
    "X",
    Select(["data", "firstName"], Get(Var("X")))
  )
)
```

with arrays

```
Map(
  Paginate(Match(Index("all_customers"))),
  Lambda(
    "X",
    [
      Select(["data", "firstName"], Get(Var("X"))),
      Select(["data", "lastName"], Get(Var("X")))
    ]
  )
)
```

with objects

```
Map(
  Paginate(Match(Index("all_customers"))),
  Lambda(
    "X",
    [
      Select(["data", "firstName"], Get(Var("X"))),
      Select(["data", "lastName"], Get(Var("X")))
    ]
  )
)
``````
Map(
  Paginate(Match(Index("all_customers"))),
  Lambda(
    "X",
    {
      firstName: Select(["data", "firstName"], Get(Var("X"))),
      lastName: Select(["data", "lastName"], Get(Var("X")))
    }
  )
)
```

Selecting multiple fields in an FQL query

The FaunaDB CLI is distributed on NPM and includes an interactive shell as well as the ability to send queries from a file.

```
npm i -g fauna-shell
fauna cloud-login
fauna -h
fauna list-databases
```

open a shell to a database:

```
fauna shell test-demo
```

```
Match(Index("all_customers"))
```

```
Paginate(Match(Index("all_customers")))
```

Running queries from a file

```
fauna eval test-demo --file=./fauna.fql
```






Installing the FaunaDB CLI and using it to send queries from a local file

The FaunaDB [hosted product pricing](https://fauna.com/pricing) charges you based on read ops (in addition to write ops, storage, and data transfer). This can make it important to reduce the number of read ops in a heavily used query to stay within your expected limits on a given day.

```
Map(
  Paginate(Match(Index("all_customers"))),
  Lambda("X", Get(Var("X")))
)
```

```
Paginate(Match(Index("all_customers_with_fields"))),
```

The number of read ops can be found by inspecting the headers for a given query.

```
X-Read-Ops: 4
```

Reducing the number of read ops in a query using indexes

How to create a document in a collection using the FaunaDB shell. Note that when sending the document in, you have to make it a value of the `data` key.

```
Create(
  Collection("customers"),
  {
    data: {
      firstName: "Jane",
      lastName: "Doe",
      address: {
        street: "87856 Mendota Court",
        city: "Idaho Falls",
        state: "ID",
        zipCode: "83405"
      },
      telephone: "208-346-0715",
      creditCard: {
        network: "Visa",
        number: "4556781272473393"
      }
    }
  }
)
```

Topics

Instructors

Content Type

Building a Serverless JAMStack Todo app with Netlify, Gatsby, GraphQL, and FaunaDB

Converting a Serverless App to run on AWS Lambda and DynamoDB with Serverless Framework

The Complete Guide to FaunaDB

Configure React Storybook for use with Typescript

An Introduction to FaunaDB

Overview of the FaunaDB Query Language

Refs and Get in FaunaDB

FQL Page objects can be arguments to array functions

Accessing fields through Refs with Select

An Introduction to FaunaDB

Creating your first FaunaDB database

Overview of the FaunaDB Query Language (FQL)

Getting fields out of Refs with Get

FQL Page objects can be arguments to Array functions

Using FQL Lambda in Array functions

Accessing fields through Refs with Select

Creating an access token and choosing a role for it

Selecting multiple fields in an FQL query

Installing the FaunaDB CLI and using it to send queries from a local file

Reducing the number of read ops in a query using indexes

Inserting a document