Design paginated list UI and pagination API

Scenario

You are building a web page that displays a list of items (e.g., posts, products, or users). The list must be paginated, and users can click page numbers / Next / Prev to navigate.

Requirements

1. Frontend UI
   • Display a list of items for the current page.
   • Provide pagination controls: page numbers (optional), Next/Prev , and current page indicator.
   • Handle loading states and empty states.
2. Backend API (you may write pseudocode)
   • Design an API to fetch a page of results.
   • Support stable ordering (e.g., newest-first by created_at , tie-break by id ).
   • Include any metadata the UI needs (e.g., whether there is a next page; optionally total count).
3. Data model
   • Propose a minimal data model for the listed entity.
   • Describe database indexing needed for efficient pagination.
4. Corner cases to consider
   • Items inserted/deleted while the user is paging.
   • Very large datasets (cannot scan all rows).
   • Out-of-range pages, empty results.
   • Changing sort/filter while paging.

Deliverables

• High-level architecture for frontend ↔ API ↔ database.
• API request/response design.
• Data model + indexes.
• Discussion of tradeoffs (e.g., offset vs cursor pagination).