There are several ways to create a single page application (SPA) using libraries like React. There are many serverless options to choose from when picking a tech stack for a SPA. One popular option is to integrate FaunaDB into React apps.

FaunaDB is a database as a service (DBaaS) that helps to save time by using a preexisting infrastructure to build web applications without setting up a custom API server.

In this post, we’ll take a look at how to get started using FaunaDB to create APIs that can be used directly in React applications.

What are we building?

Here is what the final app is going to look like:

For learning purposes, I am going to keep the UI minimal.

Prerequisites

To take full advantage of this tutorial, make sure you have the following installed on your local development environment:

• Node.js version >= 12.x.x installed
• Have access to one package manager such as npm or yarn
• create-react-app CLI installed as a global package or use npx
• Access to FaunaDB dashboard
• Basic knowledge of React Hooks

Why FaunaDB?

Here are some points to consider when using FaunaDB:

• It supports transactions and follows the ACID (Atomicity, Consistency, Isolation, Durability) convention
• It scales well. The architecture of FaunaDB lets the database scale according to the demand and load balancing. The database instance is distributed among many instances all over the world such that the users of your application will always have access to the closest instance
• The data is stored as enhanced JSON documents and such that a document can have nested complex references
• Another reason why FaunaDB works well with React apps is it is easy to use overall. As a developer or a team of developers, you can focus on building your application instead of setting up and running a backend environment to create APIs
• It has a GraphQL playground in its dashboard that you can use to import your GraphQL schema using a .gql or .graphql file

Getting started with FaunaDB

Start by registering a new account either using email credentials or using a GitHub account. You can register a new account here:

Once you have created a new account or signed in, you are going to be welcomed by the dashboard screen:

That’s it! Now we have our account set up.

#react #faunadb #javascript #web-development #developer