Starwars-Search-App

A Star Wars search app with autocomplete, built using Shadcn UI, Tailwind CSS, Redux Toolkit Query, and SWAPI api.

Screenshots

Features

• Autocomplete Search:
  Search across all Star Wars entities (people, planets, films, species, vehicles, starships) as you type, with dynamic suggestions.

• Category-Based Results:
  Search results are grouped by category, displaying the top 3 matches per category for a more organized experience.

• "View All" Button:
  Easily view all results for a specific category with a "View All" button, leading to a dedicated category page.

• Category Pages:
  Each category page displays a complete list of results for a selected category, pulled directly from the SWAPI API.

• Edit Feature:
  Each result can be edited directly on the category page, allowing for flexible data interaction.

• Create Feature:
  You can add a new character to the table using the “Create” button, allowing you to expand the list of characters.

Technologies Used

Frontend:

• ReactJS
• Vite
• TypeScript
• Tailwind
• Redux Toolkit Query
• shadcn/ui
• Radix UI
• React Hook Form
• yup
• Lucide
• ESLint

Demo

Starwars-Search-App

Installation

To run this application locally, follow these steps:

1. Clone the repository:

   git clone https://github.com/zivab/Starwars-Search-App.git

2. Access the project

   cd Starwars-Search-App
   

3. Install Frontend dependencies

    pnpm install
   

4. Start the Frontend development server

   pnpm run dev
   

5. The Frontend will run on http://localhost:5173

Authors

• @zivab