Проект "Персонажи Рика и Морти" является веб-приложением, разработанным с использованием Vue 3 Composition API, для удобного просмотра информации о персонажах из популярного анимационного сериала "Рик и Морти". Api - https://rickandmortyapi.com
Приложение позволяет пользователям:
- Просматривать персонажей в виде карточек.
- Использовать пагинацию для перехода между страницами с персонажами.
- Фильтровать персонажей по их имени и статусу.
- Адаптивный дизайн для удобного просмотра на различных устройствах.
Проект организован в соответствии со следующей структурой:
-
Файл
App.vue
содержит основную структуру приложения. -
Файл
useCharacters.js
в папкеcomposables
содержит основную логику приложения. -
В папке
api
находится модульcharacters.js
для взаимодействия с API Rick and Morty. -
В папке
components
содержатся компоненты UI, такие как карточка персонажа, загрузчик, пагинация, кнопка, текстовое поле, кнопка вверх и выпадающий список. -
В папке
layouts
находятся компоненты, определяющие структуру страницы, такие как заголовок и подвал. -
Файл
main.css
в папкеassets
содержит глобальные стили приложения. -
src/
- api/
characters.js
- components/
- ui/
Button.vue
Input.vue
Select.vue
ScrollToTop.vue
Loader.vue
CharacterCard.vue
Pagination.vue
- ui/
- composables/
useCharacters.js
- layouts/
Header.vue
Footer.vue
- assets/
main.css
base.css
- api/
-
App.vue
-
main.js
Чтобы запустить проект локально, выполните следующие шаги:
- Клонируйте репозиторий на свой компьютер.
- Установите зависимости, выполнив команду
npm install
. - Запустите приложение, используя команду
npm run serve
.