Это простой проект разделения фронтенда и бэкенда, в основном разработанный с использованием технологий Vue.js + SpringBoot.
Помимо использования в качестве вводного упражнения, я также надеюсь, что этот проект можно использовать в качестве основы для некоторых распространенных веб-проектов, которые помогут вам упростить процесс создания веб-сайта. Его называют белым записным книжком, потому что он начинается с 0 и постепенно улучшается с течением времени.
Репозиторий внешнего интерфейса: https://github.com/realdonald1994/WhiteJotter_Vue
Внутренний репозиторий: https://github.com/realdonald1994/WhiteJotter
Добро пожаловать в White Jotter!
В качестве страницы отображения, включая основные справочные материалы по развитию этого проекта, последние обновления и слоган.
Обеспечить функцию отображения информации о книге и фильме
Предоставление заметок, функция отображения сообщений в блоге
Включая панель управления, управление контентом, управление пользователями и полномочиями и т. д.
Личное представление и ссылки по теме
1.Vue.js
2.Элементный интерфейс
3.аксиос
4.Вуэкс
1. Весенние ботинки
2. Весенние данные + JPA
3. MySQL
4. Широ
1.Mysql
1.Центос7
2.Нгинкс
3. ФастДФС
1. Юнит
2. Шутка
1.клонировать проект на локальный
внешний интерфейс:
git clone https://github.com/realdonald1994/WhiteJotter_Vue
задняя часть:
git clone https://github.com/realdonald1994/WhiteJotter
2.Создайте базу данных white_jotter
в MySQL, запустите проект, и данные будут добавлены автоматически.
Порт Redis — 6379 (порт по умолчанию), а пароль пустой.
3.База данных настраивается в файле application.properties
в каталоге src main resources
серверного проекта, а версия mysql — 8.0.15.
4. Запустите серверный проект в IntelliJ IDEA. Чтобы убедиться, что проект работает успешно, вы можете щелкнуть правой кнопкой мыши pom.xml
и выбрать maven-> reimport и перезапустить проект.
На этом этапе сервер успешно запускается, в то же время запустите интерфейсный проект, посетите http: // localhost: 8080
, вы можете войти на страницу входа, учетная запись по умолчанию — admin
, пароль — 123
Если вы хотите заняться вторичной разработкой, продолжайте выполнять пятый и шестой шаги.
5.Войдите в корневой каталог внешнего проекта и введите следующие команды по порядку в командной строке:
# Install dependencies
npm install
# Start the project at localhost: 8080
npm run dev
Поскольку в проекте wj-front
настроена переадресация портов для пересылки данных в SpringBoot, после запуска проекта введите http: // localhost: 8080
в браузере, чтобы получить доступ к нашему внешнему проекту. Все запросы перенаправляют данные в SpringBoot. через переадресацию портов (обратите внимание, что на этом этапе не следует закрывать проект SpringBoot).
6. Наконец, вы можете использовать WebStorm
и другие инструменты, чтобы открыть проект wj-front
и продолжить разработку. После завершения разработки, когда проект будет опубликован в сети, вы все равно входите в каталог wj-front
, а затем выполняете следующую команду:
npm run build
После успешного выполнения команды в каталоге wj-front создается папка dist
, и два файла assets
и index.html
из этой папки можно скопировать в nginx. Затем войдите в корневой каталог серверной части и выполните командную строку:
mvn clean install
Наконец, введите командную строку java -jar xxx.jar
во вновь созданном target
каталоге. Запустите внутренний сервер.
Введите командную строку под файлом nginx: start nginx
. Запустите интерфейсный сервер.
08-20 Добавить Redis
06-09 Добавление модульного теста с помощью тестовых утилит Vue и Jest
06-04 Используйте gzip, чтобы решить проблему медленной загрузки веб-страницы
06-02 Проект развернут на облачном сервере и веб-сайт публикуется впервые ?
05-29 Отдельные интерфейсные и серверные проекты
04-20 Использование редактора уценок с открытым исходным кодом для создания модуля отображения и управления статьями.
...