CRUD vanilla JS project, HTML table with buttons in table head, which allow to sort the content of the column.
https://img.shields.io/badge/status-stable-green.svg
https://img.shields.io/badge/WIP-work%20in%20progress-yellow.svg
// adding gif, must be in repo
Table content: ID number of intelligence agents, their names and status.
| Agent's ID | Agents Name | Agent's status |
|---|---|---|
| 999 | Eric Cartman | inactive |
| 155 | Kyle Broflovski | active |
- Table head with sort buttons
- Sort the items of an array, alphabetic and numeric, ascending or descending. Highlight active sorting button/method
- All CRUD features
- In the first row checkbox, which highlight the whole row
- Display number of elements in the table's footer
- Dropdown menu in footer to limit amount of displayed rows
- [Lint/Prettier] - Prevent stylistic errors
- [JSDoc] - Document the code
- [Git] - Create repository on github and push/upload it
- [DRY] - Don't repeat yourself and provide clean code
- Project preparation (set up project, lint/prettier, git repo)
- To ease testing: Data from input fields saved to array as object, displayed in table
- HTML Table build based on data in array
- Sort through array (A-Z, Z-A, 1-9, 9-1)
- Style
- Calculate how much pages needed, if usear want see two per page
- Show current and max page, with working next/previous page
- Split table to multiple pages
Others:
- Safe array (table content) to DB?
- 22nd march
- 19nd feedback about progress
CRUD table design reference(https://material.io/design/components/data-tables.html#behavior)