DEV Community

loading...
Cover image for Powerful Astro Boy chat room

Powerful Astro Boy chat room

genaller profile image Genal ・2 min read

Powerful Astro Boy chat room

author
author
Node.js Version
License: MIT
author

码云

在线地址www.genal.fun

有建议请到issues区

Project introduction

😛 leisure time to do a chat room to consolidate the front-end skills, and in 2020 began on June 24th astro boy chat room for the development of tour.

😈 project adopts the typescript development, this is the functional iteration groundwork for future.Of course, I like Typescript very much.

🧐 now chat chat room has complete functions, the future will gradually develop more cool features, like a friend to a star give me!

Program interface

PC

Alt Text

mobile

Alt Text

function Introduction

  • mobile compatible
  • user information modification (head/username/password)
  • group/private chat
  • create a group to join the group / / group/fuzzy search group
  • add/delete/fuzzy search users friends
  • news page
  • expression package
  • sent pictures/image preview
  • the number of online statistics
  • a custom theme
  • reconnection to remind

Technology

  • Typescript:JavaScript 的一个超集,它最大的优势是提供了类型系统和提高了代码的可读性和可维护性。
  • Vue2.6.x:前端渐进式框架。
  • Socket/io:实现实时通信,websocket第三方库。
  • Vuex:专为 Vue.js 应用程序开发的状态管理模式。
  • Nestjs:是一个用于构建高效、可扩展的 Node.js 服务端应用框架,基于 TypeScript 编写并且结合了 OOP1、FP2、FRP3 的相关理念。
  • Typeorm: 支持最新的 JavaScript 特性并提供额外的特性以帮助你开发任何使用数据库的应用程序。
  • ES6+:采用ES6+语法,箭头函数、async/await等等语法很好用。
  • SASS(SCSS):用SCSS做CSS预处理语言,可以使用最高效的方式,以少量的代码创建复杂的设计。

mysql

Alt Text

Environment configuration

  • 数据库mysql 以及 chat数据库
  • node v10.16.3

how to run

cd genal-chat-client 
npm i
npm run serve
Enter fullscreen mode Exit fullscreen mode
cd genal-chat-server
npm i
npm run start:dev
Enter fullscreen mode Exit fullscreen mode

author

github: edison

url

https://genal.fun/

Discussion

pic
Editor guide