# 2.1 Create Backend API

Before we start creating our app, we first need to create an API connected to a database. For this purpose, we will use a free tool called [Supabase](https://supabase.io).

### Step 1: Sign up

Go to [supabase.com](https://supabase.com) and Sign up to create a new account.

![](https://3369392052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LPjsIbS1DfhqT8BS3Ui%2Fuploads%2F1CsYQwUOzQwowqfnL3Vg%2Fsupabase%20homepage.png?alt=media\&token=413332b4-8632-4c77-a990-dca1371b0db2)

### **Step 2: Create a New Project**

Next, we need to create a new project. Click the "New Project" button once you login into the Supabase app, and follow the wizard to create your API project.

![2a. Click "New Project"](https://3369392052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LPjsIbS1DfhqT8BS3Ui%2Fuploads%2F9q95GsvauL1mn3Wysprs%2FScreenshot%202022-04-21%20at%2011.13.00%20PM.png?alt=media\&token=ff127fe7-2e25-45bf-bbd1-4ba17fc2b0af) ![2b. Enter Organization Name](https://3369392052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LPjsIbS1DfhqT8BS3Ui%2Fuploads%2FK8ZqDqBpN4CK8SXtiFdW%2FScreenshot%202022-04-21%20at%2011.13.22%20PM.png?alt=media\&token=1cef9ec9-43f4-4d82-9cc9-29d8e788c745) ![2c. Enter project details](https://3369392052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LPjsIbS1DfhqT8BS3Ui%2Fuploads%2FyfoLYN4WaPc3ihFGWUyE%2FScreenshot%202022-04-21%20at%2011.14.01%20PM.png?alt=media\&token=e00c6eb9-57ee-4444-bd82-73ebf6d456b2) ![2d. Project dashboard](https://3369392052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LPjsIbS1DfhqT8BS3Ui%2Fuploads%2FGIdvHeYvaf6WDuWjuOIb%2FScreenshot%202022-04-21%20at%2011.14.31%20PM.png?alt=media\&token=a79de31b-9e60-4c02-aaaf-27b0417d0f73)

### **3. Create Database Table**

Now we need to create our database table to store our to-do tasks.

Start by clicking the Table Editor button on the left sidebar menu. Once you're on this page, press the "Create a new table" button.

![Press the "Create a new table" button](https://3369392052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LPjsIbS1DfhqT8BS3Ui%2Fuploads%2FMZ4QwTYQR9R3CtKUm71q%2FScreenshot%202022-04-21%20at%2011.24.47%20PM.png?alt=media\&token=94efaacc-ef1a-482f-9649-2715104d86f3)

When the form opens, add the following columns to match the screenshot below:

1. id (uuid)
2. title (varchar)
3. description (text)
4. completed (bool)
5. created\_at (timestamptz)

Make sure "Enable Row Level Security" is <mark style="color:red;">**NOT**</mark> checked.

![Add table columns](https://3369392052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LPjsIbS1DfhqT8BS3Ui%2Fuploads%2FwobLXirauayByt4Brm5j%2FScreenshot%202022-04-21%20at%2011.27.30%20PM.png?alt=media\&token=a9f9a48e-7bfc-4bff-94f1-3a6ae67fc238)

### **4. Build GraphQL Schema**

Since we are going to be building our app on top of [GraphQL](https://graphql.org/) query language, we need to tell Supabase to build its schema.

On the left sidebar menu click the "SQL Editor" button. Once on this screen, press the "+ New Query" button.&#x20;

![](https://3369392052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LPjsIbS1DfhqT8BS3Ui%2Fuploads%2Fsw2K11UauMGyhqnsVx6N%2FScreenshot%202022-04-21%20at%2011.33.47%20PM.png?alt=media\&token=fda81ce2-e116-4d64-97b7-ae36c0dd3301)

Now enter the following code snippet in the editor and press "RUN"

```sql
-- Rebuild the GraphQL Schema Cache
select graphql.rebuild_schema();
```

![](https://3369392052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LPjsIbS1DfhqT8BS3Ui%2Fuploads%2FZFliWRVD2a6G16MGNzG7%2FScreenshot%202022-04-21%20at%2011.40.13%20PM.png?alt=media\&token=0d8374f8-a89d-422e-9d0d-293a40c099ed)

### 5. API Details

Go to `Settings => API` page. Here you can find the API URL and Key as shown in the screenshot below.

![](https://3369392052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LPjsIbS1DfhqT8BS3Ui%2Fuploads%2FOAdd6G88XHRqRk1iS8To%2FScreenshot%202022-04-23%20at%201.24.38%20PM.png?alt=media\&token=16a231c3-0efc-4c88-a362-02f5c4c02bc7)

That's all. We're done with creating our API for the project. All we need to do is consume it now.