智学无忧教育系统项目基本概述

项目经验 智学无忧-老曹

项目的需求


在线教育系统,有前台、后台、微信公众号、小程序(规划中)。系统的目的:通过系统管理,更好的提供教学服务,让教学更加系统化,条理化。减轻人员工作量。

项目中的技术


前台用到技术

  1. 为了考虑SEO,采用混合式开发。使用原生js+jQuery,使用Bootstrap UI,混合使用asp.net mvc的开发模式。将html、css、js嵌入到cshtml后台模板。这种开发方式主要用户前台。主要是要考虑到浏览器的兼容性问题,希望更多的浏览器能够正常访问我们的应用。因为应用是针对所有人,而不是某类指定的用户群体。vue.js在IE9以上的版本浏览。
  2. 使用腾讯的一个模板引擎artTemplate。是用来渲染html的,省去了拼接字符串的工作。
  3. 封装了一些公共功能。比如弹层、权限管理、日期等

后台技术

  1. 采用单页应用程序,会按需加载所需要的文件,但是只有一个页面。用户体验高,好比桌面程序一样。
  2. 采用vue.js以数据驱动视图,简化开发工作,让程序员更加注重逻辑处理而不是dom的操作。
  3. UI框架采用Element-UI,专门用于后台开发的。提供比较丰富的UI组件,使用简单,界面统一。
  4. 使用百度的一个可视化框架echarts、vue-router、axios(接口调用的插件)、富文本编辑器

微信公众号

  1. 基于vue.js的单页应用程序
  2. UI使用vux

项目中的工具


版本管理工具

  1. git 用于后台项目
  2. vs 用于前台和微信公众号

开发工具

  1. 混合式开发使用(Visual Studio 2017)vs2017 用于前台项目
  2. vs code 用于后台项目、微信公众号

调试工具

  1. 使用google浏览器的调试工具,解决项目中常见的问题。

接口文档


采用接口文档提供给前端,接口文档地址 

后台接口文档地址:http://192.168.1.188:8/help
前台接口文档地址:http://localhost:2073/help

开发形式


  1. 前后端不分离,称之为混合式开发,通常是前台项目或二次开发的项目。(智学无忧网站)
  2. 前后端分离,前端和后端的代码是独立,通过接口进行数据交互。(后台管理系统、微信公众号)

还能输出{{restrictNumber}}个字符  
  • {{reply.author}}

    {{CommonUtil.formateDate(reply.ac_CommentDate).shortTime}}
  • 回复了{{Comments.author}} :