Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/sanjsanj/react-tv
https://github.com/sanjsanj/react-tv
Last synced: 3 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/sanjsanj/react-tv
- Owner: sanjsanj
- License: mit
- Created: 2019-07-26T18:03:03.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2022-12-09T00:01:43.000Z (almost 2 years ago)
- Last Synced: 2024-05-16T01:13:56.141Z (6 months ago)
- Language: JavaScript
- Size: 741 KB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 15
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# React-TV
A simple React + Redux project to retrieve, render and manipulate data returned from an API.
## Commands
- **yarn start**: Runs the web application in developer mode
- **yarn test**: Executes Jest tests that have the `.test.js` extension## Tasks
Feel free to create new files to help you complete these tasks. Additional dependencies can be installed, if you think they are necessary
`index.js` in src directory is your react entry point, it is connected to the redux store
`data` directory is a mocked-API which exposes methods to get message information and member information from a chat room.
It has two publicly exposed functions `getMessages` and `getMembers`. Your tasks will be to add further logic to display and manipulate the data returned from these functions, without modifying `data/index.js`
Do not modify `data.js` to achieve these tasks, and do not worry about the styling. Code addition should be unit tested.
1. Render the list of messages from the redux store
2. Display the user's email when you hover over the message (using javascript).
3. Display the avatar of the user next to the message
4. Display and format the timestamp of the message to be human readable
5. Sort the messages by time
## Submission
Please upload your solution to your github account as a public repository, and send the URL to us.