COPS-IITBHU / COPS-IITBHU/hackalog-frontend
Pagination in Hackathon Detail Page
- Dominant language
- TypeScript
- Stars
- 17
- Forks
- 49
- PR merge metrics
- No merged PRs in 30d
Description
### Description
The "Participants" tab on the hackathon details page requires pagination to improve on the participants' list load time. This requires some changes in the backend as well as the frontend. On frontend side, this can be achieved by using some packages like `react-pagination` or by creating custom pagination components.
### Details
File: `pages/hackathon/slug/index.js` (E.g. slug = "debug-it-2021")
Tab: Participants
Example Link: https://hackalog.copsiitbhu.co.in/hackathon/debug-it-2021
Contributor guide
Research direction
Start in pages/hackathon/slug/index.js and inspect how the Participants tab loads and renders its list for a hackathon such as debug-it-2021. Trace the related backend request before choosing a pagination approach. Done means the Participants list loads paged results and the page supports moving through those results without loading the full list at once.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- next.js, react, typescript
- Domain
- backend, frontend, full-stack
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100