Spreadsheet

A dynamic spreadsheet created with React.js.

Run in local enviroment. Type in the root folder of the project:

• npm install
• npm run

Structure

• components folder: All React components devided between Header ("Add column" button, "Add 10 rows" button) and the Spreadsheet
• helpers folder: Various helpers methods can be found here
• api/spreadsheet.js: Future handler to interact with the backend. Is the intermediate between the components and the Redux store
• state folder: contains the redux action, reducer and store
• style folder: css for the components

Libraries

• Create React App used to create the project with no build configuration
• Redux used to manage the state of the project and to simulate the backend
• Prop types Runtime type checking for React props

Future enhancements

• The row validation message is displayed for the current action. If other action takes place, it is overwritten by a new messages even if the error was not corrected by the user. Design a better system to display these warnings.
• Unit tests
• CI and Linters
• Improve UX
• Persist the data
• The user should add as many options to the dropdown column as desired
• Allowed more interactions with the columns (Delete, Edit all the proprierties etc.)