Чат Astro Boy
облако кода
Интернет-адрес www.genal.fun (Недействительно и больше не планируется к развертыванию)
Если у вас есть какие-либо предложения, пожалуйста, перейдите в раздел проблем.
Введение в проект
? В свободное время я хотел создать чат для закрепления навыков работы с интерфейсом, поэтому 24 июня 2020 года я начал разработку чата Astro Boy.
?Проект разрабатывается с использованием полного машинописного текста, что закладывает основу для будущих функциональных итераций. Конечно, мне тоже очень нравится машинописный текст.
? В настоящее время в чате уже есть полноценные функции чата. В будущем будут разработаны более интересные функции. Итерация остановлена! Друзья, которым интересно, могут сами его форкнуть и развивать, а вы можете модифицировать его по своему усмотрению! Я обновлю новые функции, когда у меня будет время!
Интерфейс проекта
ПК-версия
Мобильный терминал
Введение в функцию
- Совместимость с мобильными устройствами
- Изменение информации о пользователе (аватар/имя пользователя/пароль)
- Групповой чат/приватный чат
- Создать группу/присоединиться к группе/выйти из группы/группу нечеткого поиска
- Добавить друзей/удалить друзей/пользователей нечеткого поиска
- Пагинация сообщения
- Смайлики
- Отправка изображения/предварительный просмотр изображения
- Статистика людей в Интернете
- Пользовательская тема
- Напоминание о повторном подключении
Обзор технологий
- Typescript : расширенная версия JavaScript. Его самое большое преимущество заключается в том, что он предоставляет систему типов и улучшает читаемость и удобство обслуживания кода.
- Vue2.6.x : прогрессивная интерфейсная платформа.
- Socket/io : связь в реальном времени, сторонняя библиотека веб-сокетов.
- Vuex : шаблон управления состоянием, разработанный специально для приложений Vue.js.
- Nestjs : это платформа для создания эффективных и масштабируемых серверных приложений Node.js. Она написана на основе TypeScript и сочетает в себе связанные концепции OOP1, FP2 и FRP3.
- Typeorm : поддерживает новейшие функции JavaScript и предоставляет дополнительные функции, которые помогут вам разработать любое приложение, использующее базу данных.
- ES6+ : использование синтаксиса ES6+, стрелочных функций, async/await и другого синтаксиса очень просто в использовании.
- SASS (SCSS) : используя SCSS в качестве языка предварительной обработки CSS, вы можете использовать наиболее эффективный способ создания сложных проектов с небольшим объемом кода.
Проектирование структуры таблицы базы данных
Конфигурация среды
- База данных mysql и база данных чата (обратите внимание, что формат базы данных — utf8mb4)
- узел v10.16.3
Запустить проект
- Фронтенд-проект
cd genal - chat - client
npm i
npm run serve
Конфигурация mysql Если MySQL не может подключиться и появляется сообщение об ошибке: ER_NOT_SUPPORTED_AUTH_MODE, это вызвано несовместимостью версии mysql. См. эту статью https://blog.csdn.net/qq_41831345/article/details/83150502.
В базе данных нет sql-скрипта. Просто измените пароль базы данных в серверной части app.module.ts и создайте новую базу данных chat .
Бэкэнд-проект
cd genal - chat - server
npm i
npm run start: dev
Запись итерации системы
Нажмите, чтобы просмотреть
v1.0.0
Функция
- Добавить нового пользователя
- Добавить новую группу
- групповой чат
интерфейс v1.0.0
v2.0.0
Функция
- Групповой чат/приватный чат
- Создать группу/присоединиться к групповому чату/группе нечеткого поиска
- Добавить друзей/нечеткий поиск друзей
- Изменить имя пользователя/загрузку аватара
- Смайлики
- Пагинация сообщения
интерфейс v2.0.0
v3.0.0
Функция
- Групповой чат/приватный чат
- Создать группу/присоединиться к групповому чату/группе нечеткого поиска
- Добавить друзей/нечеткий поиск друзей
- Загрузка изображения/вставка, отправка изображения/предварительный просмотр изображения
- Изменить имя пользователя/загрузку аватара
- Смайлики
- Пагинация сообщения
интерфейс v3.0.0
То же, что и версия 2.0.0
v4.0.0
Функция
- Групповой чат/приватный чат
- Создать группу/присоединиться к групповому чату/группе нечеткого поиска
- Добавить друзей/нечеткий поиск друзей
- Загрузка изображения/вставка, отправка изображения/предварительный просмотр изображения
- Изменить имя пользователя/загрузку аватара
- Смайлики
- Пагинация сообщения
- Совместимость с мобильными устройствами
интерфейс v4.0.0
То же, что и версия 2.0.0
v5.0.0
Функция
- Групповой чат/приватный чат
- Создать группу/присоединиться к групповому чату/выйти из группы/группу нечеткого поиска
- Добавить друзей/удалить друзей/нечеткий поиск друзей
- Загрузка изображения/вставка, отправка изображения/предварительный просмотр изображения
- Изменить имя пользователя/загрузку аватара
- Смайлики
- Пагинация сообщения
- Совместимость с мобильными устройствами
- Статистика людей в Интернете
- Напоминание о повторном подключении
интерфейс v5.0.0
v6.0.0
Функция
- Совместимость с мобильными устройствами
- Изменение информации о пользователе (аватар/имя пользователя/пароль)
- Групповой чат/приватный чат
- Создать группу/присоединиться к группе/выйти из группы/группу нечеткого поиска
- Добавить друзей/удалить друзей/пользователей нечеткого поиска
- Пагинация сообщения
- Смайлики
- Отправка изображения/предварительный просмотр изображения
- Статистика людей в Интернете
- Пользовательская тема
- Напоминание о повторном подключении
интерфейс v6.0.0
автор
гитхаб: Эдисон
Список участников
mtnbgx, BoBoooooo, Nyaasu66, BeanCookie (в произвольном порядке)
Как развернуть
Инструкции по развертыванию чата Astro Boy
подробнее
Используйте машинописный текст, чтобы создать мощный веб-чат
