- Notifications
You must be signed in to change notification settings - Fork7
A practical web application built with Node.js, Express, and MySQL for you to readily record, view, and manage your tasks with an account: Create, view, edit, delete, filter, and sort expenses are as easy as pie 🥧
smallpaes/todo-list
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
A practical web application built with Node.js, Express, and MySQL for you to readily record, view, and manage your tasks with an account: Create, view, edit, delete, filter, and sort todos are as easy as pie 🥧
To increase user experience
- Animate.css is used to show animation for certain actions
To enhance security
- csurf is used to prevent CSRF Attacks
- express-validator is used for server side validation
| Functions | Detail | URL |
|---|---|---|
| Sign up for an account | 1. User can sign up an account by inputting name, email, password 2. User can get a warning message for invalid input format | /users/register |
| Log in with email | 1. User can log in using registered email 2. User can get a warning message for incorrect password or unregistered account | /users/login |
| Log in with Facebook account | User can log in via Facebook with a Facebook account | /auth/facebook |
| Log out | 1. User can log out of an account 2. User can get a reminder for successful logout | /users/logout |
| View all todos | 1. User can view todos list with name, due date and status after login 2. User can get an error message when no todo to display after login | / |
| View a todo | User can view name, due date, status, and detail of a todo after login | /todos/view/:id |
| Create a todo | 1. User can add a todo with detail after login 2. User can get a warning message for invalid input format | /todos/new |
| Edit a todo | User can update detail info of a todo after login | /todos/edit/:id |
| Delete a todo | 1. User can delete a todo after login 2. User can receive a warning message before actual delete | /todos/delete/:id |
| Filter todos | User can filter todos based on status and due date | /search |
| Sort todos | User can sort todos based on status, due date, or name | /search |
| Page not found | User can get an error message when travelling to a page not existing | /:any_other_URL |
The following instructions will get you a copy of the project and all the setting needed to run it on your local machine.
Clone this repository to your local machine
$ git clone https://github.com/smallpaes/todo-list.gitCreate and use todo-sequelize database via MySQL Workbench
Run the following code
drop database if exists todo_sequelize;create database todo_sequelize;use todo_sequelize;1. Create a Facebook account
2. Create a Facebook App and get the App ID & Secret
My Apps -> Create App -> Scenario: Integrate Facebook Login -> Settings -> Basic3. Enter the project folder
$ cd todo-list4. Install packages via npm
$ npm install5. Create .env file
$ touch .env6. Store API Key in .env file and save
FACEBOOK_ID=<YOUR_FACEBOOK_APP_ID>FACEBOOK_SECRET=<YOUR_FACEBOOK_APP_SECRET>FACEBOOK_CALLBACK=<YOUR_FACEBOOK_REDIRECT_URI>7. Edit password in config.json file
/config/config.json
"development": { "username": "root", "password": "<YOUR_WORKBENCH_PASSWORD>", "database": "todo_sequelize", "host": "127.0.0.1", "dialect": "mysql", "operatorsAliases": false}8. Create models
run the following code in the console
$ npx sequelize db:migrate9. Activate the server
$ npm run dev10. Find the message for successful activation
> App is running on port 3000!You may visit the application on browser with the URL:http://localhost:3000
About
A practical web application built with Node.js, Express, and MySQL for you to readily record, view, and manage your tasks with an account: Create, view, edit, delete, filter, and sort expenses are as easy as pie 🥧