Giter Club home page Giter Club logo

react-im's Introduction

基于 React 全家桶与 Socket.io 的多功能实时社交平台

项目背景

Vue 与 React 各有千秋,且两者都有广泛的生态系统和强大的社区支持。不过相比于 React 而言,Vue 则表现的更加易学易用,这也使得笔者在日常开发中会偏向于 Vue,但这并不等同于在日常开发中会偏离 React。所谓一分耕耘、一分收获,笔者在业余时间通过 React 全家桶开发了此项目,目的是为了在经常使用 Vue 的同时,不会将 React 过快的忘掉、忘净,并且笔者也会一直将此项目迭代、维护下去

前端主要技术栈

  • React 18
  • TypeScript
  • Axios
  • Socket.io
  • Antd
  • Webpack
  • Less

此项目包含的一些功能

私聊

与朋友进行一对一聊天,这是在平台上与他人亲密交流的主要方式。不论是分享喜怒哀乐,还是传递重要信息,私聊都为你提供了一个隐秘、便捷的空间

Emoji 表情或图片消息

在交流中使用丰富的 Emoji 表情和图片可以让对话更加生动有趣。表情能够传达出你的情感和情绪,而图片消息则能够直观地展示你所要分享的事物(例如一个狗头表情包)。这些多彩的表达方式丰富了你们之间的对话内容,让沟通变得更加有趣和多样化

拍一拍

拍一拍是一种轻松的互动方式,这是一种不需要文字的交流方式,特别适合传达简单的问候和鼓励,让你与朋友之间保持亲近联系

撤回消息

发送了不恰当的消息?不用担心!撤回消息让你有机会纠正自己的错误,同时使对话保持流畅和准确,避免尴尬和误解

语音

在朋友之间发送语音是一种生动的交流方式,它能够更加准确地传达情感和信息。通过语音,你可以用自己的声音与朋友分享想法、感受与故事,增加了交流的真实感和亲近感

群聊

群聊是与多位朋友一起交流的方式,可以一起分享兴趣、讨论话题,或者简单地聊天互动。群聊让你能够将多人的想法和观点汇聚在一起,创造出丰富多彩的交流氛围

群禁言

群禁言是一个管理工具,群主可以对群聊中的成员进行禁言,以维护聊天的秩序。这有助于防止垃圾信息和不适当的言论,保持群组的健康和友好交流环境

头像、背景的自定义

你可以上传个性化的头像和主页背景来展示你的独特个性。头像是你在平台上的标识,而背景则能够为你个人增添不一样的风格,让主页界面更加美观和富有个性

朋友圈

朋友圈是分享生活、瞬间和精彩的地方。你可以在朋友圈发布文字、图片和语音,与朋友们分享你日常生活中的点滴和重要时刻。同时,你也可以在朋友圈中与好友互动、点赞、评论,创造出更多的交流乐趣

消息炫彩字

通过消息炫彩字功能,你可以在聊天中使用丰富多彩的显示样式,增添消息的创意和吸引力。这使得你的消息更加引人注目,让对话内容更富有表现力

适配主题色

为了可以更好地适应不同的使用场景,主题切换功能应运而生。平台支持主题跟随系统自动进行切换,另外也提供了浅色模式与深色模式来应对日常使用

输入状态

输入状态能够让你知道对方是否正在输入消息。这能够增加互动感,让你了解朋友们的实时动态,更好地掌握对话节奏

朋友圈可见范围

在朋友圈中,你可以设定说说的可见范围,从而保护你的隐私。你可以选择向所有人公开、仅向好友展示,或者根据自己的需求进行调整,确保你的分享得到合适的传播

账号等级

平台根据用户的活跃度来分配不同的账号等级。这是一种鼓励用户参与平台建设、积极互动的方式,也让活跃用户得到一定的认可和回馈。平台将账号等级进行了可视化处理,使用山、树、花、草来代表不同的等级

附录

  1. 官方网站,等你来体验
  2. 开源指南

LICENSE

MIT

react-im's People

Contributors

funcjin avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.