Challenge Overview
Challenge Overview
Topcoder has rewritten the challenge listings page using React. The new version is an overhaul, with a brand new look, feel, and user experience.
At the same time we've been working on this, we've been working on a rewrite of the API that supplies data to this front-end code. For this challenge, we want to update some key API calls on the challenge listings page to switch over from the v2 API to the v3 API.
High-Level Requirements
The v2 API for the challenge listings looks like this. This v3 API for the listings looks like this. For calls to the /challenges endpoint that look at develop and design challenges, we want to switch from using v2 to v3.
In making this change, we want to preserve all functionalities of the challenge listings page. There are some places where this update will improve performance and simplify things, like on the challenge timeline. With all phase information now in the API, we shouldn't need to make a second call to the challenge details page to get the full timeline information. The same will be true of prizes, which now appear in an array.
To make sure that no functionality is broken, you'll need to do things like make sure that the new track and subtrack names are mapping correctly to what's in the front-end code. In some places, you will likely need to update the code's logic to fit new data formats.
There may be places where a piece of information is missing. If information is missing that will impact page functionality, please post in the forums to ask how to proceed. If there are some minor problems, we should be able to proceed with the challenge and update the API afterward.
To call for just develop challenges, use this call: https://api.topcoder-dev.com/v3/challenges/?filter=track%3Ddevelop
For design, use: https://api.topcoder-dev.com/v3/challenges/?filter=track%3Ddesign
For past, use: https://api.topcoder-dev.com/v3/challenges/?filter=status%3Dcompleted
For a list of parameters, look here (where I use one incorrectly): https://api.topcoder-dev.com/v3/challenges/?filter=challengeType%3Ddesign
Before the listings components, we hadn't done much development in this repo, so please ignore all the Coffeescript components you see.
Your code should not break any styling or functionality, unless explicitly approved by the copilot.
Your code should match the Airbnb React Styleguide. Use ES6 syntax and build functional components.
If you want to pull in outside components or other JS libraries, GET THEM APPROVED! If someone has already written a good version of another one of the components you're working on, there's no need to reinvent the wheel, but confirm it with the copilot before you pull it in.
Submissions should be a git patch. Make sure the patch has a user email so that we don't have to add it manually. Please provide a short deployment guide, and an accompanying video that shows a) your components in action and b) a brief code walkthrough.
Topcoder has rewritten the challenge listings page using React. The new version is an overhaul, with a brand new look, feel, and user experience.
At the same time we've been working on this, we've been working on a rewrite of the API that supplies data to this front-end code. For this challenge, we want to update some key API calls on the challenge listings page to switch over from the v2 API to the v3 API.
High-Level Requirements
The v2 API for the challenge listings looks like this. This v3 API for the listings looks like this. For calls to the /challenges endpoint that look at develop and design challenges, we want to switch from using v2 to v3.
In making this change, we want to preserve all functionalities of the challenge listings page. There are some places where this update will improve performance and simplify things, like on the challenge timeline. With all phase information now in the API, we shouldn't need to make a second call to the challenge details page to get the full timeline information. The same will be true of prizes, which now appear in an array.
To make sure that no functionality is broken, you'll need to do things like make sure that the new track and subtrack names are mapping correctly to what's in the front-end code. In some places, you will likely need to update the code's logic to fit new data formats.
There may be places where a piece of information is missing. If information is missing that will impact page functionality, please post in the forums to ask how to proceed. If there are some minor problems, we should be able to proceed with the challenge and update the API afterward.
To call for just develop challenges, use this call: https://api.topcoder-dev.com/v3/challenges/?filter=track%3Ddevelop
For design, use: https://api.topcoder-dev.com/v3/challenges/?filter=track%3Ddesign
For past, use: https://api.topcoder-dev.com/v3/challenges/?filter=status%3Dcompleted
For a list of parameters, look here (where I use one incorrectly): https://api.topcoder-dev.com/v3/challenges/?filter=challengeType%3Ddesign
Final Submission Guidelines
We want you to build this component in our react-components repo. Create a branch that forks off of the tom-styling-fixes branch.Before the listings components, we hadn't done much development in this repo, so please ignore all the Coffeescript components you see.
Your code should not break any styling or functionality, unless explicitly approved by the copilot.
Your code should match the Airbnb React Styleguide. Use ES6 syntax and build functional components.
If you want to pull in outside components or other JS libraries, GET THEM APPROVED! If someone has already written a good version of another one of the components you're working on, there's no need to reinvent the wheel, but confirm it with the copilot before you pull it in.
Submissions should be a git patch. Make sure the patch has a user email so that we don't have to add it manually. Please provide a short deployment guide, and an accompanying video that shows a) your components in action and b) a brief code walkthrough.