Привет! Это музыкальное приложение, созданное для удобного прослушивания музыки с использованием плеера, удобного поиска видео на YouTube и эффективного распределения данных.
- 🎵 Плеер: Встроенный музыкальный плеер для комфортного прослушивания треков.
- 🔍 Поиск видео: Удобный поиск видео на YouTube прямо из приложения.
- 📊 Распределение данных: Эффективная организация и отображение данных для удобства пользователя.
Для получения полного функционала приложения необходимо войти в систему как администратор.
Логин Администратора:
- Имя пользователя: admin
- Пароль: 123
Ссылка на фронтенд: https://music-app-client.vercel.app/
Технологии:
- React: библиотека для создания пользовательских интерфейсов.
- Material-UI: компоненты и стили для React приложений.
- Redux Toolkit: упрощенное управление состоянием приложения.
- Axios: для выполнения HTTP-запросов.
- React Router: для навигации внутри приложения.
- Redux Persist: для сохранения состояния Redux в localStorage.
- Google OAuth: для аутентификации через Google.
Команды запуска:
▶️ npm start: запускает разработочный сервер React.- 🏗️
npm run build: создает оптимизированную сборку для продакшена. - 🧪
npm test: запускает тесты React приложения. - 🧹
npm run lint: проверяет стили кода с использованием линтера. - 🖌️
npm run format-all: форматирует весь код с использованием Prettier.
Зависимости:
@emotion/react,@emotion/styled: библиотеки для работы с эмоциональными стилями.@mui/icons-material,@mui/lab,@mui/material: компоненты и стили Material-UI.@react-oauth/google: компонент для аутентификации через Google.@reduxjs/toolkit,react-redux: для управления состоянием.axios: для выполнения HTTP-запросов.react-scripts: скрипты для создания React-приложения.typescript: язык программирования для добавления статической типизации.
Ссылка на бэкенд: https://music-app-five-flame.vercel.app/
Технологии:
- Express: фреймворк для создания веб-приложений на Node.js.
- MongoDB Atlas: облачная база данных для хранения данных.
- Cloudinary: облачное хранилище для изображений.
Команды запуска:
- 🚀
npm run dev: запускает сервер в режиме разработки с использованием nodemon. - 🌱
npm run seed: выполняет заполнение базы данных тестовыми данными. - 🧹
npm run lint: запускает линтер для проверки стилей кода. - 🖌️
npm run format-all: форматирует весь код с использованием Prettier.
Зависимости:
bcrypt: для хеширования паролей.cloudinary: для работы с облачным хранилищем изображений.cors: для обработки кросс-доменных запросов.dotenv: для загрузки переменных среды.express: веб-фреймворк для Node.js.mongoose: для работы с MongoDB.multer: для обработки данных изображений.
Оба проекта также включают скрипты для форматирования кода с использованием Prettier и линтеры для обеспечения соответствия стандартам стиля кода. 🚀🌈