newbee-mall проект — это набор электронной коммерции, который включает в себя newbee-mall торговый центр и newbee-mall-admin систему управления торговым центром. Проект разработан на основе Spring Boot и Vue, а также других технологий.

Передняя часть торгового центра содержит главную страницу портала, категории товаров, новые товары, главную карусель, рекомендуемые товары, поиск товаров, показ товаров, корзину покупок, оформление заказа, процесс заказа, управление личным заказом, центр помощи и другие модули.

Задняя часть системы управления включает панель данных, карусель графиков, управление товарами, управление заказами, управление участниками, управление категориями, настройки и другие модули.

В этом репозитории находится исходный код для новой версии newbee торгового центра с разделением передней и задней частей на Vue (версия Vue — 3.x). Этот код предназначен для разработчиков передней части, а исходный код задней части API находится в другом репозитории newbee-mall-api.

Онлайн-демонстрация newbee-mall версии Vue3: http://vue3-app.newbee.ltd. Рекомендуется использовать мобильный режим для доступа.

Обзор проектов newbee-mall

Если вам нравится проект, вы можете поддержать его, поставив звезду. Это будет стимулом для меня продолжать обновлять код. Спасибо за вашу поддержку!

Документация по разработке и развёртыванию

• Введение: пошаговое руководство по созданию крупномасштабного проекта с разделением передней и задней частей Vue3+Spring Boot

• Информация о проекте и условия курса

• Обновление в феврале 2023 года

• Полное стековое развитие! Что нужно знать о «разделении передней и задней частей»

• История развития модульности передней части

• Традиционные страницы и одностраничные приложения: баланс и выбор

• Подготовка и создание базовой среды (задняя часть)

• Первый опыт работы с проектом Spring Boot — создание и запуск проекта

• Интеграция Lombok для упрощения кодирования проекта Spring Boot

• Проблемы с плагином Lombok

• Запуск и работа с торговым центром на задней части

• Конфигурация и плагины VSCode

• Основы: директивы Vue Введение в новые функции

• Базовая статья: введение и использование инструмента предварительного обработки CSS Less.

• Инструментальная платформа Vite.

• Анализ принципов работы Vue-Router и их применение.

• Введение и применение плагина глобального управления состоянием Pinia.

• Создание и запуск среды разработки H5 для переднего конца торгового центра.

• Spring Boot интегрирует Swagger, полезный инструмент для взаимодействия между передним и задним концами.

• Обработка параметров интерфейса и унифицированные результаты ответов.

• Дизайн-код и практика вызова интерфейса.

Практика разработки торгового центра

• Разработка интерфейса входа пользователя.
• Подробное объяснение аутентификации личности пользователя.
• Разработка модуля домашней страницы.
• Разработка модуля классификации.
• Разработка поискового модуля товаров.
• Разработка модуля корзины покупок.
• Разработка модулей личной информации и адреса доставки.
• Разработка процесса оформления заказа.
• Процесс обработки заказа.

Разработка мобильного приложения торгового центра

• Практика разработки мобильного приложения торгового центра: создание нижнего навигационного меню (извлечение общих компонентов).
• Практика разработки мобильного приложения торгового центра: страница регистрации и входа (проверка подлинности на переднем конце).
• Практика разработки мобильного приложения торгового центра: разработка домашней страницы (слайд-шоу, список товаров на главной странице).
• Практика разработки мобильного приложения торгового центра: разработка страницы категории товаров (представление и использование better-scroll).
• Практика разработки мобильного приложения торгового центра: разработка страницы списка товаров (бесконечная прокрутка с загрузкой).
• Практика разработки мобильного приложения торгового центра: разработка страницы сведений о товарах (глобальное управление количеством товаров в корзине с помощью Pinia).
• Практика разработки мобильного приложения торгового центра: разработка страницы корзины покупок (страница корзины).
• Практика разработки мобильного приложения торгового центра: разработка страницы подтверждения заказа (подтверждение заказа).
• Практика разработки мобильного приложения торгового центра: разработка страницы управления адресом (управление адресом).
• Практика разработки мобильного приложения торгового центра: разработка страницы моего заказа (мой заказ).

Часто задаваемые вопросы

Если у вас есть какие-либо вопросы или предложения, вы можете оставить отзыв в разделе issues. Я буду постепенно улучшать этот проект.

• Моя электронная почта: 2449207463@qq.com.
• Техническая группа QQ: 932227898 552142710.

Следите за общедоступной учётной записью: программист тринадцать. Ответьте «подцепить», чтобы присоединиться к группе.

Программное обеспечение защищено авторским правом.

Эта система подала заявку на авторское право на программное обеспечение, которое защищается Государственным управлением по авторскому праву и Государственным бюро по авторскому праву на компьютерное программное обеспечение!

Демонстрация страниц

Ниже приведены предварительные просмотры страниц версии Vue3 New Bee Mall:

— Страница входа:

— Домашняя страница:

— Поиск товара:

— Подробная информация о товаре:

— Корзина покупок:

— Создание заказа:

— Управление адресом:

— Список заказов:

— Детали заказа:

Благодарности

Vue, Vue-Router, Vuex, Vant, better-scroll.