Init Backend Todo Application
Tags: webdev, javascript, devops, aws
Published: 2023-12-10 00:12:25

For this part, we will create a Todo App for our backend application using Express, PostgreSQL, and TypeScript. We have already initialized our project in the last part, and we will begin working on the API in this section. You can find the full code for this part [here](https://github.com/akbarnafisa/aws-devops-fullstack/tree/2-init-backend-todo-application).

## Initialize Database

You must have PostgreSQL installed on your computer, or you can use Docker. For this project, we will use Docker. To initialize the container, you can run this command.

```bash
docker run --name postgres-local-container -e POSTGRES_PASSWORD=mysecretpassword -p 5432:5432 -d postgres
```

To initiate the container, we can execute this command.

```bash
docker container start postgres-local-container
```

## Create Database

To make our life easier, we will use the [VSCode extension](https://marketplace.visualstudio.com/items?itemName=cweijan.vscode-mysql-client2) to connect and create our database. You can use the same password that we used when creating the Docker container.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mk71obyy3tqjxi3yrign.png)

Next, we will create the database by clicking the + button. Then, we will enter the database name and click `Execute` in the `.sql` file.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zea6plif9t3cnk6r2ml0.png)

## **Initialize** Database Table

I've already created the **`create_tables.sql`** file to generate tables and insert data into the database.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7ho4920210hegyue3ihl.png)

After selecting the connection to PostgreSQL, we choose the database we just created.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xhrtpf5eboxhrws9rs7w.png)

Finally, we execute all the SQL commands to create tables and insert data into them.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h1y35q2soz5a1u8s5ty9.png)

## **Initialize Database Connection**

To connect our Express app to database we are using [pg](https://www.npmjs.com/package/pg) library. We initialize the connection in `db.ts`

```jsx
import { Pool } from "pg";

const pool = new Pool({
  user: "postgres",
  host: "127.0.0.1",
  database: "my_db",
  password: "mysecretpassword",
  port: 5432,
});

export default pool;
```

## Development Mode

In this App we wave three routes

- GET `/api/todo` → get all task
- POST `/api/todo` → create new task
- DELETE `/api/todo/:id` → delete  task by ID

To run the the server on the development mode we can run this command at the root folder

```bash
yarn workspace libs build
yarn workspace validation build
yarn workspace server dev
```

To test the API, open the **`request.http`** file.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7cn6rizkv4bt0xl7am1p.png)

To interact with the API, select 'Send Request.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b5x5owmy5j30a8wdgh0a.png)

The response will then be displayed.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qpgavs5hkmx7lsav6iw3.png)