Managing our daily tasks can be quite a challenge, especially when we need a reliable and efficient way to keep track of them. In this blog post, I will guide you through creating a self-host and efficient ToDo List API using Node.js, Prisma, SQLite, GraphQL, and Docker. By the end of this tutorial, you'll have a fully functional and scalable API that can handle your daily tasks effectively.

Overview

Our ToDo List API will have the following features:

Create, read, update, and delete (CRUD) operations for managing tasks.
Efficient data handling and validation with Prisma and SQLite.
GraphQL integration for flexible and powerful data querying.
Containerized deployment using Docker for easy scaling and portability.

Prerequisites

Before we begin, make sure you have the following installed on your system:

Node.js (version 14.x or higher)
Docker (for containerization)
Prisma CLI (for database management)
A code editor (such as Visual Studio Code)

Step 1: Setting Up the Project

First, let's set up the basic structure of our project by creating a new directory and initializing it with a package.json file.

mkdir todo-list
cd todo-list
npm init -y

Next, install the required dependencies for our project:

npm install express graphql apollo-server prisma sqlite

Step 2: Setting Up the Database with Prisma

Create a prisma folder in the project root.
Inside the prisma folder, create a schema.prisma file with the following content:

datasource db {

	provider = "sqlite"
	
	url = env("DATABASE_URL")

}

generator client {

	provider = "prisma-client-js"

}

model Todo {

	id Int @id @default(autoincrement())
	
	title String
	
	completed Boolean @default(false)
	
	createdAt DateTime @default(now())

}

Run npx prisma generate to generate the Prisma client.

Step 3: Integrating GraphQL and Creating Resolvers

Create a graphql folder in the project root.
Inside the graphql folder, create a typeDefs.graphql file with the following content:

type Todo {

	id: ID!
	
	title: String!
	
	completed: Boolean!
	
	createdAt: String!
}

input TodoInput {

	title: String!
	
	completed: Boolean
}

type Query {

	todos: [Todo!]!

}  

type Mutation {

	createTodo (input: TodoInput!): Todo!
	
	updateTodo (id: ID!, input: TodoInput!): Todo!
	
	deleteTodo (id: ID!): Todo!

}

Inside the graphql folder, create a resolvers.js file to implement the resolvers using the Prisma client.

const { PrismaClient } = require('@prisma/client');

const prisma = new PrismaClient();

const resolvers = {

Query: {

	todos: async () => {
	
		return await prisma.todo.findMany();
	
	},

},

Mutation: {

	createTodo: async (_, { input }) => {
	
		return await prisma.todo.create({
		
			data: input
	
		});

},

updateTodo: async (_, { id, input }) => {

	return await prisma.todo.update({
	
		where: { id: parseInt(id) },
	
		data: input
	
	});

},

deleteTodo: async (_, { id }) => {

	return await prisma.todo.delete({
		
		where: { id: parseInt(id) }
		
			});
		
		},
	
	},

};

module.exports = resolvers;

Step 4: Create GraphQL Server

In the project root, create a server.js file to start the GraphQL server using apollo-server.

const { ApolloServer, gql } = require('apollo-server');

const { importSchema } = require('graphql-import');

const resolvers = require('./graphql/resolvers');

const typeDefs = gql(importSchema('./graphql/schema.graphql'));

const server = new ApolloServer({ typeDefs, resolvers });


server.listen({ port: 4000 }).then(({ url }) => {

	console.log(`🚀 Server ready at ${url}`);

});

Step 5: Containerizing the Application with Docker

Create .env

DATABASE_URL="file:./dev.db"

Create a Dockerfile in the project root with the following content:

# Use the official Node.js image as the base image

FROM node:14

# Set the working directory to /app

WORKDIR /app

# Copy package.json and package-lock.json to the working directory

COPY package*.json ./

# Install the dependencies

RUN npm install

# Copy the prisma folder and generate the Prisma client

COPY prisma ./prisma

RUN npx prisma generate

COPY .env ./

RUN npx prisma migrate deploy

# Copy the rest of the application code to the working directory

COPY . .

# Expose the port on which the server will run

EXPOSE 4000

# Start the server

CMD ["node", "server.js"]

Create a .dockerignore file in the project root to exclude unnecessary files and folders from the Docker build context:

node_modules
npm-debug.log

Build the Docker image: docker build -t todo-list .
Create a docker-compose.yml file in the project root to define and run the application in a Docker container:

version: "3.8"

services:

	todo-list:
	
		image: todo-list
		
		build: .
		
		ports:
		
			- "4000:4000"
		
		environment:
		
			- DATABASE_URL=file:/app/prisma/dev.db
		
		volumes:
		
			- ./prisma/dev.db:/app/prisma/dev.db

make sure you have a migration created by running the following command npx prisma migrate dev --name init. However, since prisma migrate dev is meant for developement and includes features such as automatically applying migrations, it's not recommended to use it in a production environment. Instead, use prisma migrate deploy top apply the migrations during the build in Dockerfile.

Start the application using Docker Compose:

docker-compose up

How to test

To test the GraphQL API, you can use tools like GraphQL Playground, Insomnia, or Postman. Here, I'll describe how to test the API using GraphQL Playground.

Install GraphQL Playground on your machine:

You can download and install the desktop version of GraphQL Playground from the following link: https://github.com/graphql/graphql-playground/releases

Access the GraphQL API:

After you have installed GraphQL Playground, open it and set the API URL in the address bar. Since your server is running on localhost on port 4000, use the following URL: http://localhost:4000

Write and execute queries:

In the GraphQL Playground, you can write queries and mutations to test your API. Here's an example of a query to fetch all todos:

query {
  todos {
    id
    title
    completed
  }
}

To create a new todo, you can use the following mutation:

graphqlCopy code

mutation {
  createTodo(input: {
    title: "Sample Todo",
    completed: false
  }) {
    id
    title
    completed
    createdAt
  }
}

You can also test the API using other tools like Insomnia or Postman by setting up GraphQL requests in a similar way.

Conclusion

In this tutorial, we've built a robust and efficient ToDo List API using Node.js, Prisma, SQLite, GraphQL, and Docker. With GraphQL integration, our API allows flexible and powerful data querying, while containerization with Docker ensures easy scaling and portability.

Now that you've successfully built your ToDo List API, you can further enhance it by implementing features like user roles, pagination, and filtering. Happy coding!

人生如棋，落子无悔。

你好，我是 Zhihao。