Skip to content

Latest commit

 

History

History
37 lines (25 loc) · 1.27 KB

File metadata and controls

37 lines (25 loc) · 1.27 KB

Star Wars Character Browser

A React app for browsing Star Wars characters using the SWAPI. Search, filter, and view detailed character information.

Running the Project

  1. Install dependencies:
npm install
  1. Start the development server:
npm run dev

The app will be available at http://localhost:5173.

What's Implemented

  • Character listing with pagination
  • Search by name
  • Filter by homeworld, species, or films
  • Character details modal with enriched data (homeworld info, species, films)
  • Custom accessible select component with keyboard navigation
  • Page caching for faster navigation
  • Responsive design for mobile and desktop

Design Choices & Trade-offs

Data Loading: All characters are loaded upfront for instant filtering, which increases initial load time. Paginated browsing only loads 10 characters per page.

Custom Components: Built a custom select dropdown instead of using a library to keep bundle size small and have full control over styling and behavior.

API Rate Limiting: Added throttling when enriching character data to avoid hitting SWAPI rate limits. This slightly slows initial load but prevents errors.

Caching: Pages are cached in memory for instant navigation when returning to previously viewed pages.