Недавно я разрабатываю учебный проект Vue 3.0 + element-plus. После завершения теста весь код будет открыт. Предварительный просмотр некоторых страниц выглядит следующим образом:
тронутый первым я
Мне не хотелось писать эти слова, но когда я читал статью, я обратился к старой статье, написанной несколько лет назад, в которой было записано, почему я сделал проект с открытым исходным кодом, и вдруг был тронут собой в то время, поэтому у меня есть следующие слова, я надеюсь, что все Взгляните.
Я веду блог уже несколько лет, и я также сделал много проектов с открытым исходным кодом.Что меня больше всего впечатляет, так это не оценки, такие как «красивый», «мощный» и «большой парень», потому что я не круто, и я тоже не большой парень, я предпочитаю, чтобы люди говорили, что они понимают, понимают и учатся, или что кто-то решил проблему отсутствия программ практического обучения благодаря этим проектам, или даже нашел работу и закончил курсовую работу из-за этих практических проектов.Это заставляет меня чувствовать, что я сделал все возможное, посвящая свои небольшие силы, чтобы помочь другим.
Пять лет назад, когда я работал над своим первым проектом с открытым исходным кодом, я написал этот отрывок:
В блоге я поделюсь кодом и собственными методами и способами решения проблемы, а также разверну проект, чтобы дать всем интуитивное ощущение.Если вас что-то не устраивает, можете не тратить время на чтение , Если вы думаете, что это нормально, просто продолжайте читать.Спускаясь вниз, что касается того, почему я написал блог, я должен раскрыть код, и я должен его развернуть.Потому что я также приезжаю из новичка, я хочу знать, что учебы не может ничего делать, кроме как ощущение, потому что знания не широко, потому что нет никакого направления и глубоко смущенного и расстроены, что я испытал раньше, так Я все сделаю все сделано, можно считать составить свои собственные знания были пустыми сожалением, увы, если в то время.
Это причина, по которой я делаю для проекта с открытым исходным кодом, потому что я из новичка, я учусь от Java, я могу добраться до фактического проекта, я хочу найти демонстрацию, я не могу его найти, очень мучить Отказ Когда у меня есть возможность сделать это, я должен сделать это серьезно. Родители, которые вы должны сделать, функция завершена, код все открытый источник, не изучать некоторые элементы мусора, или опубликовать его, форум, сетевое блюдо , QQ Group, ищите кого-то, чтобы поделиться проектом практики.
Вы знаете, как низко может быть голова человека, когда он делает это?
Я знаю.
Вот почему я сделал эти проекты с открытым исходным кодом.Стек технологий — от SSM до Spring Boot, а затем от Spring Boot до Vue.Проект изменился с первоначальной функции входа в систему на различные обучающие проекты, простые системы управления фоном, системы управления информацией, и проекты блогов. , проект торгового центра, проекты разделения внешнего и внутреннего интерфейса, все коды открыты для всех, чтобы их можно было изучить. Понимаете, поначалу может быть ничего, но если продержаться 5 лет, то эффект упорства и накопления обнаружится.
Хотя его иногда и ругают, думать об этом довольно смешно. Но я все равно буду идти по этой дороге в будущем. Я не большой начальник, и у меня нет особых технических способностей, но я все равно буду усердно работать и делать больше проектов с открытым исходным кодом, чтобы принести пользу сообществу. Мои статьи и открытый исходный код проекты играют самую большую роль.Он должен сопровождать вас на технической дороге какое-то время, даже если вы не можете сопровождать вас в течение длительного времени, потому что после того, как ваши технические способности будут высокими, вы будете все меньше и меньше интересоваться этими тренировками проекты.
Тем не менее, я все равно благодарю всех вас за то, что позволили мне сопровождать вас в этом путешествии.
Предыстория разработки проекта
Ближе к дому, поговорим о последнем проекте.
Vue 3.0
Официальная версия находится в сети более полугода, и я также объяснял статью оVue 3.0
статья,Vue 3.0 уже здесь, что нам делать?. В то время казалосьVue 3.0
Окружающая экология не идеальна, например, плагины маршрутизацииVue-Router
, плагин управления состояниемVuex
, основные библиотеки компонентовVue 3.0
версии и т. д., по-прежнему наказываетсяbeta
версия, и даже некоторые библиотеки компонентов не были обновлены, что делает большинствоVue
Пользователям сложно плавно перенести свои проекты наVue 3.0
.
со временем,Vue
Периферийные плагины начали обновляться до официальной версии, несколько известныхUI
Библиотеки компонентов тоже пережили болезненный период, и запускались они одна за другой.Vue 3.0
версия, напримерElement-Plus
,Ant Design of Vue
,Vant
Подождите, они все хорошо известны в отраслиUI
библиотеки компонентов, которые служат предшественникамиVue
Вклад экологии очевиден для всех, и я также надеюсь, что все смогут работать вместе дляVue
экологические строительные блоки.
За последние шесть месяцев я также изучал и делился знаниями о Vue3, например, опубликовал несколько учебных пособий по Vue3:
Я также изучал и делился знаниями Vue3, а также написал несколько руководств по Vue3:
- Vue 3.0 уже здесь, что нам делать? 》
- «Серия Vue3 Combat: сочетание Ant-Design-of-Vue с API практической композиции»
- «Vue3 здесь, план реконструкции торгового центра с открытым исходным кодом Vue3 официально запущен! 》
- «Боевая серия Vue3: Vue3.0 + Vant3.0 для создания начального проекта»
- "🎉🎉 Проект торгового центра с открытым исходным кодом на основе Vue 3 + VANT 3"
- 《Vue3教程:用 Vue3 开发小程序,这里有一份实践代码! 》
- Учебник по Vue3: Где Vue 3.x Fast? 》
Поскольку я сделал несколько небольших демонстраций, я начал пытаться писать более крупные настоящие проекты после того, как привык к этому.Конечно, фоном разработки является официальный выпуск Vue 3.0 и официальный выпуск element plus.Время - сентябрь. и 2020 г. соответственно Ноябрь 2020 г.
Я долго думал над названием проекта, но сначала назову егоvue3-adminНу, в конце концов, это система управления фоном. Конечно, это считается практическим проектом, и все коды имеют открытый исходный код и бесплатны для всех, кто может их изучить и использовать.
процесс разработки проекта
проектvue3-adminВремя разработки должно быть в декабре 2020 года, когда я увидел статью от @iamkun«🎉 Element UI для Vue 3.0 уже здесь! 》, в статье упоминался официальный релиз element plus, поэтому я подумал о том, чтобы использовать его для реконструкции предыдущей системы управления фоном.
Однако в этот раз это заняло много времени, прошло уже почти 4 месяца, он только разработан и все еще находится в стадии тестирования. Поскольку мое время относительно фрагментировано, я обычно хожу на работу, а по выходным мне приходится писать книги и статьи, поэтому я могу написать немного кода только тогда, когда занят другими делами и у меня есть время.
Первый — это разработка back-end интерфейса API, построение таблицы, разработка интерфейса, самотестирование… На разработку первой версии API ушло около полумесяца. Однако он только развивается, потому что в последующей совместной отладке интерфейса было внесено много корректировок, параметры неполные, метод получения неверный, возвращаемый формат корректируется и так далее.
После этого уходит много времени на разработку страницы и совместную отладку интерфейса.Настройка окружения, отрисовка страницы, корректировка макета страницы, поиск материалов для иконок и т.д., все это трудоемко и занимает много времени вещи.
Например, страница входа вначале выглядит так:
В первый день, когда вы смотрели нормально, посмотрите на следующий день, когда он чувствовал себя немного неуместно, но процесс загрузки фона немного повлиял на впечатления, затем сплошной цвет фона изменился:
Он по-прежнему выглядит нелепо, в основном из-за тона.Есть все виды цветов, черный, белый, синий и зеленый.Это нужно изменить, и изображение логотипа некрасиво. Процесс настройки не затянут, финальная страница входа выглядит следующим образом:
Цвет фона был удален, изображение логотипа и цвет шрифта были изменены, и общий вид стал намного удобнее.
В процессе разработки еще много интересного.Кроме того, есть реализация трехуровневой функции связывания, реализация функции списка, всплывающая рамка, загрузка изображения, интеграция с редактором форматированного текста и т. Д. Весь проект похож на этот 1. Точка завершения, от первой строки кода до первого компонента, до завершения страницы, до завершения функционального модуля. Если подумать об этом сейчас, на самом деле все это глупости, которые можно делать только медленно, успокоившись. К счастью, я относительно глупый человек, поэтому буду делать это понемногу. Почти 11 компонентов страницы + 5 общих компонентов, это заняло несколько месяцев, и это было закончено, продолжайте усердно работать.
Есть еще некоторые проблемы, тесты на выходных и интенсивная доработка.
Ход разработки проекта
В настоящее время завершена часть разработки, в основном тестирование, а затем модификация и совершенствование некоторых деталей.
В начале марта я тестировал его несколько раз, а потом кое-что поменял, но больше всего впечатляют следующие вопросы:
-
При переходе на следующую страницу отображается изображение предыдущей страницы.
-
Ширина и высота изображения товара после загрузки
- Введите ограничения на информацию
Некоторые поля ввода должны быть ограничены только цифрами, а не символами.
Некоторые поля ввода должны ограничивать ввод символов эмодзи.
- На странице опечатка
- При редактировании товара эхо изображения не удалось
В ходе самотестирования было изменено множество проблем со стилем и отображением, а также исправлены некоторые ошибки. Тем не менее, тест человека неизбежно проигнорирует некоторые проблемы, ведь код пишется им самим, и тест не будет особенно всеобъемлющим, поэтому в ближайшие дни я найду друзей, которые помогут его протестировать.
Если все пойдет хорошо, весь код будет открыт для GitHub и Gitee через два дня, склад создан, и адрес:
in GitHub : GitHub.com/новый Bee-Ltd/…
in Gitee : git ee.com/new Bee-Ltd/…
Если вы заинтересованы, вы можете сначала обратить на это внимание, а если у вас есть какие-либо предложения позже, вы можете напрямую задать вопрос.