Material Design 设计语言

得益于优秀的 MDUI 框架,使得 MDClub 的 UI 层次分明,动画流畅
MDClub 使用 Material Design 设计语言

响应式设计

从小屏手机,到大屏桌面显示器,都能自动适配
MDClub 使用响应式设计
  • 用同一套代码适配了所有设备,降低了维护难度
  • 面对层出不穷的设备,响应式设计都能自动适配

超级轻量级

使用了轻量的 MDUI 框架,即使在慢速网络下,也能迅速加载
  • 资源文件的大小直接影响网页加载速度,MDClub 的资源文件足够小,使网络环境较差的用户也能快速访问
  • 同时也能极大地节省服务器带宽成本
98 KB
264 KB
296 KB
914 KB
gzip 压缩后 CSS + JavaScript 总大小

自动适配暗色模式

根据操作系统的主题,自动切换亮色主题和暗色主题
MDClub 支持自动适配暗色模式
  • 你可以在夜间开启暗色模式,更护眼,且更省电
  • 自动跟随操作系统的主题,无需在 MDClub 中频繁切换主题

单页面应用,且完美支持 SEO

首屏由服务端输出,次屏通过 Ajax 加载,兼顾了 SEO 和用户体验
<!DOCTYPE html>
<html>
  <head>
    <title>MDClub</title>
  </head>
  <body>
    <p>自豪地使用 MDClub</p>
  </body>
</html>
  • 首屏由服务端输出完整 HTML 页面
{
  "code": 0,
  "data": {
    "question_id": 1,
    "user_id": 10000,
    "title": "MDClub 的第一个提问",
    ......
  }
}
  • 次屏仅输出 JSON,由客户端渲染

定制的富文本编辑器

使用了自主开发的富文本编辑器,和系统完美兼容
MDClub 使用定制的富文本编辑器
  • 编辑器的设计灵感来自 Gmail,它非常简洁易用
  • 你可以把它最大化后专注于内容编辑;也可以将它置于右下角,边编辑边浏览其他内容

方便安装

无需具备任何编程知识,30秒完成安装
  • 几乎任何低端主机都能运行 MDClub
  • 只需将代码上传到服务器,然后在浏览器中访问它,即可
MDClub 安装便捷

强大的 Restful API 接口

应用的所有功能都通过 200 多个 Restful API 开放
MDClub 提供了强大的 Restful API 接口
  • 使用这些接口,你可以自行开发 MDClub 的前端页面和 APP
  • 也可以把 MDClub 提供的数据用于其他项目

OpenAPI 规范的文档

API 文档完全使用 OpenAPI 规范,拥有庞大的 OpenAPI 生态资源
  • OpenAPI 是描述 API 的最佳规范
  • 它拥有生成模拟数据、驱动测试自动化、生成多种语言的 SDK 等非常多的功能
openapi: 3.0.2
info:
  title: MDClub API
  description: MDClub 是一个 Material Design 风格的社区应用
  version: 1.0.0
servers:
  - url: /api
    description: 当前服务器
paths:
  /questions:
    get:
      summary: 获取提问列表
      parameters:
        - $ref: '#/components/parameters/page'
        - $ref: '#/components/parameters/per_page'
        - $ref: '#/components/parameters/order.questions'
        - $ref: '#/components/parameters/include.question'
        - $ref: '#/components/parameters/question_id.query'
        - $ref: '#/components/parameters/user_id.query'
        - $ref: '#/components/parameters/topic_id.query'
        - $ref: '#/components/parameters/trashed.query'
      responses:
        '200':
          $ref: '#/components/responses/Questions'
        default:
          $ref: '#/components/responses/Error'

多平台 JavaScript SDK

提供了 JavaScript SDK,可用于多个 JS 框架,及多种小程序平台
MDClub 提供了多平台 JavaScript SDK
  • SDK 使用 TypeScript 开发,拥有完善的类型提示
  • 使用 SDK,比直接调用 Restful API 接口更便捷