This project implements a multi-select component suitable for various designs. It utilizes React, TypeScript, and Apollo Client with GraphQL to fetch data from the Rick and Morty API.
- Multi-select implementation suitable for various designs
- Fetching data from the Rick and Morty API based on the query entered in the input field
- Displaying character images, names, and the number of episodes they appear in for each result
- Highlighting the queried word in the displayed results
- Adding and removing selected results from the input field
- Keyboard navigation support for all operations, including arrow keys and tab usage
- Loading state display
- Exception handling and displaying error states in the interface
- Clone the repository:
git clone https://github.com/enespcetin/rick-morty-multi-select-app.git- Navigate to the project directory:
cd rick-morty-multi-select-app- Install dependencies:
npm or pnpm install- Start the development server:
npm or pnpm run dev- Open your browser and visit
http://localhost:5173/rick-morty-multi-select-app/to view the app.
- @types/react
- @types/react-dom
- @typescript-eslint/eslint-plugin
- @typescript-eslint/parser
- @vitejs/plugin-react
- autoprefixer
- eslint
- eslint-plugin-react-hooks
- eslint-plugin-react-refresh
- gh-pages
- postcss
- prettier
- prettier-plugin-tailwindcss
- tailwindcss
- typescript
- vite
This project is licensed under the MIT License - see the LICENSE file for details.