- $ git clone devkishor_project_todo
- $ cd todo-project
- $ npm install
- add .env file as given the .env.example file, copy it and add your own
- localhost:5000
- GET /api/v1/todos
- GET /api/v1/todo/{id}
- POST /api/v1/todo
- PATCH /api/v1/todo/{id}
- DELETE /api/v1/todo/{id}
- nodejs, expressjs, mongodb, ejs(template engine), typescript
- yup for validate
- morgan allows you to log HTTP requests made to your application in a standardized format
- cors helps security feature implemented by web browsers
- dotenv is a zero-dependency module that loads environment variables from a .env file
- helmet helps secure your Express.js app by setting various HTTP headers.
- ts-node allows you to run TypeScript scripts without first compiling them to JavaScript
- nodemon helps automatically restarts a Node.js app when file changes are detected
- todo: add, create, delete, update
- filterable todo by status
- try to handle errors
After setup, start the server $ npm run dev
, you can see on your terminal server running on http://localhost:5000!
; wait for the connection of mongodb connection and if ok hint the url on any browser, this given below image is open on your browser. Basically, this page is the opening page!!
- And you have the idea of what should you gona do. And you can do as you wanted to do.
And you can see the view todo
button and hint button and you see the no todo found
message because you have not added any todo.
to add todo you can go hint back button as you can see there.
And we back to come with the first page, there is a todo form so without fill up form, if you hint the submit button you can see the error message, And while you fill the form without missing any field, then your first todo is created.
Great, you have some todo, while check the view todo
button, you can have as same as the image you can see, I have two todo, that means I have fill up form two times.
And you see the id
value and if you click the id value i.e 1
then you can see only one todo like as the image bellow
to update todo you can go hint back button as you can see there.
on the right side, you can see the
action
and In the action section there are two things i.e. edit and delete icon and which work while you click. As you can see the images, when you have the edit todo, at that case you can select theedit icon action
as you need delete some todo, then you can click thedelete icon action
while todo is delete successfully
Happy New Year 2023