V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐学习书目
Learn Python the Hard Way
Python Sites
PyPI - Python Package Index
http://diveintopython.org/toc/index.html
Pocoo
值得关注的项目
PyPy
Celery
Jinja2
Read the Docs
gevent
pyenv
virtualenv
Stackless Python
Beautiful Soup
结巴中文分词
Green Unicorn
Sentry
Shovel
Pyflakes
pytest
Python 编程
pep8 Checker
Styles
PEP 8
Google Python Style Guide
Code Style from The Hitchhiker's Guide
genal
V2EX  ›  Python

手把手教你打造一个完备的 web 聊天室-兼容 pc 移动端

  •  2
     
  •   genal · 2020-09-17 10:49:12 +08:00 · 1856 次点击
    这是一个创建于 1288 天前的主题,其中的信息可能已经有所发展或是发生改变。

    阿童木聊天室

    在线地址www.genal.fun

    项目简介

    😛 闲暇时间想做一个聊天室来巩固前端技能,于是在 2020 年 6 月 24 号就开始了阿童木聊天室的开发之旅 😈 项目采用全 typescript 开发,这是为了以后的功能迭代打基础。当然,我本身也是很喜欢 typescript 的 🧐 目前聊天室已经具备完整的聊天功能,今后会陆续开发更多酷炫的功能,喜欢的朋友给个 star 鼓励一下我吧

    项目界面

    2.png

    功能介绍

    • 群聊 /私聊
    • 创建群 /加入群聊 /模糊搜索群
    • 添加好友 /模糊搜索好友
    • 图片上传 /粘贴发送图片 /图片预览
    • 更改用户名 /头像上传
    • 表情包
    • 消息分页
    • 移动端兼容

    技术概览

    • 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 预处理语言,可以使用最高效的方式,以少量的代码创建复杂的设计。

    数据库表结构设计

    database.png

    环境配置

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

    运行项目

    前端项目

    cd genal-chat-client 
    npm run serve
    

    后端项目

    cd genal-chat-server
    npm run start:dev
    

    作者

    github: edison

    4 条回复    2020-09-17 20:12:29 +08:00
    ZiLong
        1
    ZiLong  
       2020-09-17 11:44:39 +08:00
    很有美感
    python30
        2
    python30  
       2020-09-17 13:14:57 +08:00
    不错不错
    wuwukai007
        3
    wuwukai007  
       2020-09-17 19:00:49 +08:00 via Android
    样式不错,感觉背景和界面颜色太接近了,
    oxogenesis
        4
    oxogenesis  
       2020-09-17 20:12:29 +08:00
    楼主在哪,我要拜师
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   3504 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 00:16 · PVG 08:16 · LAX 17:16 · JFK 20:16
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.