Challenge Overview
Trending Evil Aliens
This is the HARD 1000 points competition that the Evil Aliens have given to the people of Earth. Learn More and Register for this competition before submitting a solution to this problem.
For more challenge context info, please refer to the host challenge launched here: https://www.topcoder.com/challenges/30138038
The evil aliens need to find out what the world is saying about their demands and to know that they need us to create a listing of Reddit posts with a feature for them to filter on keywords. They want you to integrate Reddit APIs that return stories and implement a filter option on the page to filter stories about them. (for example ‘alien’)
What do you need to do?
- Create a React List Component that can load the data from Reddit API.- Create a React Card Component that renders each data item.
- Add a new tab in the header at the left side of ‘About’ tab name it ‘Reddit’ https://monosnap.com/file/mYO8xcnOzHePI73ERdigYO6ImSBwIA
- Once clicked on the ‘Reddit’ tab, the List data should be rendered on the website.
- Create a Filter panel under the main navigator to allow the Evil Alien to filter stories based on hashtags. This needs to be a server-side filter, so once you change the filter, you should re-fetch the list data from your API.
- Make sure there is pagination implemented in your stories listing by creating a pagination control at the bottom of your list component. The data at the client-side should not have more than one-page data. That means, each page navigation, you need to re-fetch the corresponding page data from Reddit API.
As you know Alien's don't need a fancy UI, so keep it simple and readable.
Skill Builder Instructions:
- We have prepared three problems: Easy, Medium, and Hard, which are worth 250, 500, 1000 points respectively.- The competitions may or may not be related to each other. But they are all competitions relating to the React tech stack.
- The links to the problems/competitions are provided below.
Problems
- Easy: 250 Points, Challenge Link: https://www.topcoder.com/challenges/30139564- Medium: 500 Points, Challenge Link: https://www.topcoder.com/challenges/30139565
- Hard: 1000 Points, Challenge Link: https://www.topcoder.com/challenges/30139566
Final Submission Guidelines
- You can submit a patch file against the provided codebase.- You can also submit your whole codebase to us