Added additional comments to App.jsx and Messages.jsx

[Kamarasinghe]

I chose to use modals throughout because I believe it makes for a better user experience if the user isn't redirected from page to page. The state stored in each component is changed according to user input whereas the Redux store is used to set persistent data such as username and if their admin. I chose to do conditional rendering if the user is signed in so that they aren't shown to sign in or sign up, plus greeting the user when they are signed in would make for a good user experience.

The messages component handles the bulk of functionality within the site. This component is basically one big table for easy placement of individual placement like message information, pagination, message input, and the edit/delete icons. I chose to set the number of messages visible at a time to 5 so that I can show the functionality of the pagination filtering effectively. Conditional rendering of the edit and trashcan icons is so that the user can only edit/delete their own message if they are not an admin(can edit/delete any users' message). I limited the number of characters a user can input to at least 4 so that they are not able to spam small messages and at most 70 characters to maintain the structural integrity of the table. Instead of redirecting a user to a different page to edit their message, that conditionally renders depending on if the user has selected a message.

For unit testing, I chose to use Jest since they are known for their zero configuration and is a pretty popular testing framework among devs. I paired it with Enzyme due to it being pretty much the go to testing utility for testing React components. I was mainly testing functionality of the component, making sure the functions/events changed the state as it was supposed to and making sure elements rendered properly.

For the overall look of the site, I used Bootstrap with Reactstrap on top which just makes it easier to use Bootstrap 4 components within React.