美文网首页
架构设计与技术选型

架构设计与技术选型

作者: Carol_笑一笑 | 来源:发表于2018-10-12 11:10 被阅读0次

    项目参数:
    开发平台:Mac/Windows/Linux
    架构模式:前后端完全分离、纯静态方式、分层架构模块化
    模块化方案:CommonJs+Webpack
    技术栈: Html+CSS +JQuery+React+Sass……
    开发工具: Sublime,Chrome,Charles/Fiddler
    版本控制工具:Git
    项目发布方式: shell脚本自动化发布
    代理工具: Charles/Fiddler
    语言环境:JQuery,Webpack,Nodejs,Git
    需要安装的软件:NodeJs,Sublime,Chrome,Charlse……

    架构设计 -- 分层架构
    定义:把功能相似,抽象级别相近的实现进行分层隔离
    优势:松散耦合(易维护、易复用、易扩展)
    常见分层方式: MVC MVVM

    架构设计 -- 模块化
    定义:解决一个复杂问题时,自顶向下逐层把系统划分成若干模块的过程
    意义:解耦,可并行开发
    模块化方案:AMD CMD CommonJS ES6

    AMD: require.js
    CMD: sea.js
    区别:加载和实际运用不太一样
    模块化的代码和业务代码一起
    commonjs 语法结构简单,语法和业务是分开的
    es6 兼容性不好

                                    架构设计
    

    逻辑层 主模块
    子模块 子模块 子模块
    数据层 service 服务器

    工具层 工具

    技术选型:(挑出主流方案 从稳定性、扩展性、运行速度、开发效率、兼容性等方面综合考虑)
    a. 软件过程:(瀑布、螺旋、敏捷开发) 敏捷开发
    b. 前后端分离: 完全分离,纯静态的模式
    c. 构建工具:webpack (模块化方案:commonJS+webpack)
    d. 框架:
    e. 版本控制:git
    f. 发布方式:

    软件过程选择 -- 敏捷开发
    (适用于多变的开发需求)
    定义:以用户的需求进化为核心,采用迭代、循环渐进的方法进行软件开发
    是一种迭代的意识和方法,而不是概念和工具
    优点:能够应对满足不断变化的需求
    不足:对团队成员的能力要求比较高

    前后端分离方式 -- 不分离
    前后端共用同一套项目目录,甚至页面内嵌js、css
    本地开发环境搭建成本高
    共同维护成本高
    发布风险高

    前后端分离方式 -- 部分分离
    后端负责页面模板(JSP/Velocity/Freemarker)
    本地开发环境搭建成本较高
    更新页面模板仍需后端协助,效率不够高
    需要前后端同时发布

    前后端分离方式 -- 完全分离1
    方案1: velocity,发布的时候同步到后端
    优点:完全分离,能直接生成动态的模板,利于SEO
    缺点:系统复杂度高,需要前后端同时发布

    前后端分离方式 -- 完全分离2
    方案2:纯静态html,完全通过接口做数据交互
    优点:完全脱离后端模板,系统复杂度低
    缺点:不太利于SEO

    框架选型:
    jQuery Angular Avalon Vue React
    Css Less Sass
    用户端:求稳、用户类型多样、有SEO要求,多页应用(用户端技术不能一味的追求新技术而忽略用户群体)
    管理系统:求快、用户类型单一、无SEO要求(管理人员针对公司内部的开发人员,考虑简洁快速)

    构建工具:
    grunt gulp webpack

    版本控制工具:
    svn git

    发布方式:
    发布过程:拉取待发布的代码 编译打包 发布到线上机器上
    域名分布:
    html www./admin.
    js+css s.
    images img.

    总结:
    软件过程:敏捷开发
    前后端分离:完全分离、纯静态方式
    模块化方案:CommonJs+Webpack
    框架选择:用户端如:jQuery+css, 管理端:React+Sass
    版本控制: git
    发布过程: 拉取代码 --- 编译打包 --- 发布到线上辑器

    相关文章

      网友评论

          本文标题:架构设计与技术选型

          本文链接:https://www.haomeiwen.com/subject/bvmpaftx.html