Assignment:
//database structure: id (serial int)| task (text)| completed (boolean)
//html (using jQuery): input (text), button (submit), list with checkboxes to note completed, button to delete completed
//css: USE BOOTSTRAP, grey out completed
//js: add task to database and append tasks to html, boolean change with complete is checked, function to change 'complete' boolean in database, delete function deletes from both page and database - both functions refresh list
//HARD MODE - delete popup? https://codyhouse.co/gem/simple-confirmation-popup/
Create a front end experience that allows a user to create a task. When the task is created, it should be stored inside of a database (SQL) Whenever a task is created the front end should refresh to show all tasks that need to be completed. Each task should have an option to 'Complete' or 'Delete'. When a task is complete, its visual representation should change on the front end (for example, the background of the task container could change from gray to green, as well as the complete option 'checked off'. Each of these are accomplished in CSS, but will need to hook into logic to know whether or not the task is complete) Whether or not a task is complete should also be stored in the database. Deleting a task should remove it both from the Front End as well as the Database. Make sure that you also show us your best styling chops.
We would recommend you spend some time thinking about how to approach this problem. Think through all the logic that will be needed prior to writing any code. Take your time, relax, remember that impostor syndrome is real, and that you are capable of knocking this out of the park!
Additionally, please include some way to recreate your initial database schema. This can be a .sql file with CREATE TABLE statements or you can create your schema automatically when your app loads.
HARD MODE
In whatever fashion you would like, create an 'are you sure: yes / no' option when deleting a task. Once again, you can interrupt this however you would like.
PRO MODE
Adjust the logic so that completed tasks are brought to the bottom of the page, where the remaining tasks left to complete are brought to the top of the list.