Skip to content

onlybond/todo-pesto

Repository files navigation

Full Stack Assignment for Pesto-tech 💻

Technologies Getting Started API Endpoints Collaborators Contribute

we can add update and delete todos. we can change the status of the todos, this project has a frontend backend and REST api which is built upon the Nextjs framework.

📱 Visit this Project

💻 Technologies


  • Next.js - framework(used this because i can create the backend and api in this itself)
  • react - library(component based js library used widely for web applications and next is framework built on react)
  • shadCn - Ui library(used pre-made components from this library which saved me a lot of time)
  • tailwindCSS- CSS framework(used for styling)
  • MongoDB - DB (used for storing the data on the cloud)
  • zod - schema validation library
  • react-hook-form - used for creating form validation
  • typescript - used for type safety

🚀 Getting started

first clone the project in your local machine

git clone https://github.com/onlybond/todo-pesto

go to the projet directory and open it in a code editor (i use vscode no offense for vim)

cd todo-pesto && code .

in the terminal run this command to run it in the localhost

npm i && npm run dev

note : if you are a windows user try to give the commands seperately for example

npm i 

and then

npm run dev 

Config .env variables

Use the .env.example as reference to create your configuration file .env with your AWS Credentials

MONGODB_URI= {YOUR_MONGODB_URI/DATABASENAME}

Starting

How to start your project

cd project-name
npm run dev

📍 API Endpoints


Route Description
GET api/todos Retrieves todos from the database. See response details.
POST api/todos Adds a todo to the database. See request details.
PATCH api/todos/[:id] Updates a todo in the database according to the ID. See request details.
DELETE api/todos/[:id] Deletes a todo in the database according to the ID. See response details.

GET api/todos

RESPONSE

[
  {
    "id": "1",
    "title": "Learn React",
    "desc": "Complete React tutorial",
    "status": "todo",
    "updatedAt": "2024-07-11T14:48:00.000Z",
    "createdAt": "2024-07-11T14:48:00.000Z"
  },
  {
    "id": "2",
    "title": "Learn Next.js",
    "desc": "Build a Next.js app",
    "status": "inprogress",
    "completedby": null,
    "updatedAt": "2024-07-11T14:48:00.000Z",
    "createdAt": "2024-07-11T14:48:00.000Z"
  }
]

POST api/todos

REQUEST

{
  "title": "Learn TypeScript",
  "desc": "Complete TypeScript tutorial",
  "status": "todo"
}

RESPONSE

{
  "id": "3",
  "title": "Learn TypeScript",
  "desc": "Complete TypeScript tutorial",
  "status": "todo",
  "completedby": null,
  "createdAt": "2024-07-11T14:48:00.000Z",
  "updatedAt": "2024-07-11T14:48:00.000Z"
}

PATCH api/todos/[:id]

REQUEST

{
  "title": "Learn TypeScript",
  "desc": "Complete advanced TypeScript tutorial",
  "status": "inprogress"
}

RESPONSE

{
  "id": "3",
  "title": "Learn TypeScript",
  "desc": "Complete advanced TypeScript tutorial",
  "status": "inprogress",
  "completedby": null,
  "createdAt": "2024-07-11T14:48:00.000Z",
  "updatedAt": "2024-07-11T15:00:00.000Z"
}

DELETE api/todos/[:id]

RESPONSE

{
  "message": "Todo  deleted successfully."
}

Usage

To interact with the API, use the provided routes and their respective request formats as shown above. Each route allows you to perform operations on todos stored in the database.