🎉🎉Система управления фоном Vue 3 + Element Plus + Vite 2 имеет открытый исходный код🎉🎉

Element Vue.js
🎉🎉Система управления фоном Vue 3 + Element Plus + Vite 2 имеет открытый исходный код🎉🎉

quote

Ранее опубликованная статья«Учебное пособие по Vue3: разработка системы фонового управления Vue 3 + element-plus», в статье упоминалось, что будет разработан проект Vue 3 + Element Plus с открытым исходным кодом, чтобы каждый мог практиковаться и учиться, а затем я получал сообщения и отзывы, спрашивая меня, когда открывать исходный код, и другие вопросы, я наконец могу сообщить вам сегодня, это сделано! 🎉🎉Открытый код! 🎉🎉

Если вы считаете, что я умею хорошо писать, пожалуйста, поставьте драгоценный лайк 👍, это будет для меня мотивацией продолжать писать! Спасибо вам всем.

адрес vue3-admin с открытым исходным кодом

Весь код и файлы находятся в репозитории GitHub с открытым исходным кодом, а все внешние и внутренние коды находятся в репозитории.

Скрытого поведения нет, в том числе код внутреннего интерфейса API тоже с открытым исходным кодом, не будет сказано какой страницы или важной функции не хватает, такого не бывает, давайте посмотрим на статью и предварительный просмотр. Друзья, которые чувствуют себя хорошо, могут продолжать узнавать об этом проекте.

Конечно, я также надеюсь, что заинтересованные друзья смогут найти проблемы и поднять некоторые вопросы или вопросы, чтобы этот проект с открытым исходным кодом мог уменьшить проблемы и поддерживать прогресс.

vue3-admin создал репозитории кода на GitHub и в облаке внутреннего кода.Если у кого-то медленный доступ к GitHub, рекомендуется проверить проект на Gitee, и два репозитория будут синхронизированы.

адрес предварительного просмотра vue3-admin

Этот проект был развернут в онлайн-среде неделю назад, и адрес доступа можно увидеть в репозитории с открытым исходным кодом.

Так как пропускная способность сервера не очень большая, то я переживаю, что все будут напрямую тискать сервер.Надеюсь, все вместе не зайдут, хахахаха.

Процесс тестирования и результаты тестирования, спасибо за участие в тесте

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

На следующем рисунке представлена ​​запись токена входа, сгенерированная в течение определенного периода времени, то есть такая запись генерируется каждый раз, когда кто-то входит в систему, и объем данных достаточно велик.

image-20210324230137944

Он суммирует данные о генерации токенов с начала запуска веб-сайта (то есть в прошлый понедельник) до последних выходных, как показано на следующем рисунке:

image-20210324230009526

По этим данным можно примерно подсчитать некоторые результаты: каждый день заходят и тестируют от 200 до 300 человек.vue3-adminэтот проект. Тем не менее, есть не так много проблем и ошибок, которые были возвращены. Возможно, вы не очень глубоко протестировали его. После того, как вы действительно запустите код и получите подробный опыт, должно быть больше проблем. Я с нетерпением жду ваших отзывов.

Единственное, что заставило меня смеяться и плакать во время теста

Есть также очень злая вещь, о которой я уже много раз упоминал, и действительно трудно смеяться или плакать.

Я сделал много проектов с открытым исходным кодом, и эти проекты также выпустят адрес предварительной версии для всех, чтобы каждый мог заранее испытать функцию. Одна из самых классических вещей - удаление данных.Я удалил все тестовые данные, которые были полны Dengdeng.Например, в этот разvue3-adminПредварительный просмотр данных карусели и данных категорий на веб-сайте. Сразу после отправки адреса предварительного просмотра на полдня данные исчезли. Эффект страницы показан ниже:

image-20210324223713099

Потом пошел восстанавливать, а потом данные товара, данные заказа, данные пользователя не удалились? Потому что я не поставил кнопку удаления в этих модулях, но данные о заказе на первой странице у меня тоже были закрыты, данные о товаре на первой странице у меня тоже были удалены, и данные о пользователе на первой странице тоже отключено для меня. Время от времени восстанавливайте эти данные.

Что касается этого вопроса, то, если честно, он существует с тех пор, как я сделал первый проект с открытым исходным кодом в 2017 году, но я не могу его решить. всегда будут какие-то бывшие в употреблении товары, чтобы удалить все Данные или смена пароля тестовой учетной записи делает невозможным тестирование других. Здесь, я надеюсь, вы более сознательны и можете протестировать функцию удаления, но не удаляйте все это, или вы можете добавить несколько фрагментов данных после удаления.

image-20210324224653618

Основной стек технологий

vue3-adminВыбор стека технологий для проекта выглядит следующим образом:

Основной стек технологий — Vue 3.0 и Element Plus,Vue 3.0Официальная версия уже больше полугода в сети, а потом увидел статью от @iamkun«🎉 Element UI для Vue 3.0 уже здесь! 》, в статье упоминался официальный выпуск Element Plus, поэтому я подумал об использовании его для восстановления системы управления фоном, которую я написал ранее, а затем снова попробовал Vite 2.0, который является одним из первых пользователей.

vue3-elementplus

предварительный просмотр проекта vue3-admin

Предварительный просмотр выглядит следующим образом:

  • страница авторизации

登录页面

  • Управление каруселью

轮播图管理

  • Управление классификацией

分类管理

  • Список продуктов

商品管理

  • Редактор товаров

商品编辑

  • Управление заказами

订单管理

  • Информация для заказа

订单详情

вклад кода

Конечно, на данный момент это первая версия vue3-admin.Хотя она была протестирована в течение нескольких раундов, не исключено, что будут некоторые проблемы.Я также надеюсь, что вы можете выдвинуть некоторые предложения по оптимизации, вы можете отправить вопрос, или вы можете оставить сообщение или связаться со мной Аите меня прямо в группе.

Конечно, я также надеюсь, что каждый может внести свой вклад в проект.

  • код форка
  • Создайте свою ветку
  • зафиксируйте и отправьте измененный код в ваш репозиторий разветвленного кода
  • представить пр

Суммировать

Из-за нехватки времени нет времени подробно объяснять процесс разработки и некоторые меры предосторожности.Я просто расскажу вам в этой простой статье, Vue 3.0 + Vite 2.0 + Vue-Router 4.0 + Element-Plus + Echarts 5.0 + Axios background. была разработана система управления, и после достаточного тестирования она также была открыта для всех, чтобы все могли учиться и практиковать.Если в процессе возникнут какие-либо проблемы, я надеюсь, что вы дадите мне обратную связь, и я исправлю их, как только возможный.

Спасибо за просмотр, и тогда я надеюсь, что вы будете использовать свои маленькие руки, чтобы разбогатеть, помочь нажать на звезду или поделиться им, чтобы больше людей могли увидеть этот проект, спасибо за вашу поддержку.

vue3-admin адрес с открытым исходным кодом:

Если не указана перепечатка/источник, все они являются авторскими, перепечатки приветствуются, но данное утверждение должно быть сохранено без согласия автора, а ссылка на исходный текст дается в видном месте на странице статьи. , в противном случае сохраняется право на юридическую ответственность.