zoukankan      html  css  js  c++  java
  • .Net Core应用框架Util介绍(二)

    Util的开源地址

    https://github.com/dotnetcore/util

    Util的开源协议

      Util以MIT协议开源,这是目前最宽松的开源协议,你不仅可以用于商业项目,还能把Util的代码放进你的框架,放心使用。

    Util的命名

      Util这个名字看上去不怎么高大上,很多人劝我换个霸气点的,比如USharp。

      不过我还是坚持使用Util,因为他简短,也更好记忆,Util很多类名与.Net或第三方类库重名,需要使用完全限定名来调用它,比如Util.Helpers.String.Join()。

      另一个经常被提到的问题是Util是一个常用词汇,容易与其它类库产生冲突,不过Util的定位是为小团队提供帮助,一般情况下,这不会产生问题,另外Util会封装大量常用类库,冲突会在Util内部处理。在极端的情况下,你还能使用using创建别名来自己解决。

    Util的使用方法

      Util尚未成熟,所以我还没有发布正式版,Nuget发布的是预览版,如果你想通过Nuget引用,请勾选“包括预发行版”。

      尚未成熟并不表示Util Bug很多,还无法使用,只是还没达到我心目中理想的那个样子。对于中小项目,很多常用功能都已经封装,最新版本的Util已经在我的项目上使用,已知问题已全部修复。

      被问得最多的问题是Util有文档吗,抱歉,还真没有。我的打算是待Util成熟后,再建立完整文档,并创建一个官网。

      当然,我希望有更多人能参与进来一起分享技术,一个人精力和能力都是有限的,进度会非常缓慢。

      由于目前没有文档,你只能通过查看源码进行学习,这有点痛苦,不过也能让你基础打得更扎实一点。

      你如果对Util及Util引入的相关技术还不太了解,那么不应该将它应用在一个非常紧急的项目上,这会导致风险。

      Util主要是我用来满足自己项目的产物,所以它可能不能完全满足你的需求,作为项目负责人,你必须有能力扩展它。

      学习Util的起点是提供的Demo,我演示了CRUD的基本用法,不过这个Demo是用Angular开发的,环境上有点折腾,后续我会再提供一个Asp.Net Core Mvc基于JQuery的示例。

      这个Angular Demo不仅演示了服务端CRUD的封装,同时也演示了TagHelper是如何与Angular配合起来让UI变得清晰省力。

      当你把这个Demo运行起来,就可以通过查看源码的方式了解它的运行机制,基本了解清楚后,再自己做几个复杂点的Demo来练手,有把握再运用到你的项目上。

      如果你在使用中发现Bug,请不要亲自动手,你应该到Github提交Issue,或直接到群里来找我,我会以迅雷不及掩耳之势搞定它。

      如果你希望我为你扩展某些功能,也可以提Issue,不过我会评估是否具有价值,冷门需求只能靠你自己完成。

      如果你喜欢折腾,推荐你创建自己的应用框架,将Util以及其它框架的源码慢慢吸收到你的框架中,这能让你最大限度的了解框架内部实现机制,并能大幅增强你的编码和设计能力。 

      对于完全不能或完全不想折腾的朋友,建议你关掉网页,好好享受生活,因为新的技术,特别是前端技术真的很折腾。 

      如果你有新项目,希望采用.Net Core开发,Util将是一个很好的起点,他将为你节省大把的时间,我最近几年踩过的坑都埋在了Util中。

    Util的开发环境

    .Net Core SDK

      我们在使用.Net Framework时,通常是在更换VS时升级SDK。VS换代需要好几年,所以你可能并不太关注SDK的版本。

      不过进入.Net Core,情况有所不同,一般几个月就会更新一次,Util会紧跟.Net Core最新版本,你必须关注SDK的版本问题。

      如果你不知道在哪里下载SDK,在百度搜索可不是那么容易,下面介绍下载.Net Core SDK的正确姿势。

      在任意项目上右键,弹出菜单中选择属性。

      在“目标框架”选择“安装其它框架”,进入下载页面。

      下载页面选择最新的正式版本SDK,SDK是给开发机器用的,Runtime是在部署到服务器上用的,SDK已经包含了Runtime,注意这个区别。

    开发工具

    • VS 2017最新版本。

      如果你还在用VS2015,但又想用最新技术,这可能让你吃尽苦头。不要担心,VS2015和VS2017可以共存,多安装一个就好了。

    • Resharper(R#)最新版本。

      R#是一个VS上的重构插件,开发代码不一定需要R#,但你想开发出更优雅的代码,R#就是一个神兵利器。VS的代码提示功能很强,但R#能把VS的提示功能再提升几个档次。

      R#的主要毛病是非常卡,如果你的电脑没有固态硬盘,内存连16G也没有,建议你不要用。

    数据库

    • SqlServer 2012+

      我现在主要用Sql Server来做测试,生产环境使用的是PgSql。

      目前提供的Demo包含一个Sql Server的建库脚本,所以你需要安装它,尚未提供EF迁移和其它数据库脚本,后续有空会增加上来。

    • PostgreSql(PgSql)
    • MySql

    前端环境

      几年前,如果需要某个Js组件,我会从网上下载并把它放进项目,然后在页面上引用它。每当有版本更新,我就到它的官网下载一个新的。为了让页面加载得更快,我会在发布时用打包工具把多个Js文件打成一个,然后再用压缩工具给它瘦身。

      如果只引用了少量几个Js文件,这样做没什么问题,简单易懂,是个人就能做。

      随着前端需求的增加,你慢慢引入了十几个,几十个乃至数百个Js文件,维护它们就是一场噩梦。

      如果能让文件下载,版本更新,打包压缩全部自动化,你就能从大堆Js文件中解脱出来。

      NodeJs与它的生态系统解决了这个难题。

    • NodeJs

      NodeJs是利用Google Chrome V8引擎来执行Js的运行环境,这样Js就可以脱离浏览器运行了。

      首先查看你的机器是否已安装NodeJs,在命令行输入node -v 。

       如果你跟我一样,对命令行十分反感,是时候作出一些改变了,某些场景命令行比UI操作更便利,还有一些情况必须使用命令行,比如Npm还原。采用.Net Core最大的亮点是可以跨平台部署,换句话说,你可以把代码部署到Linux, 为了节省服务器资源,通常不会在Linux服务器上启动UI,你必须能通过黑屏命令行操控它。

      你可以看到我的机器上安装的NodeJs版本是8.9.3,如果你的NodeJs版本很低,可能会让后续操作失败,另外我听到群里有同学反馈,NodeJs版本过高也会出现问题,我还没有测试过,如果你环境上出现问题,可以安装我这个版本。

      你可以通过这个地址http://nodejs.cn/download下载安装NodeJs。安装完成,记得重启电脑,这是怪异问题的必杀技之一。

      

    • Npm(Node Package Manager)

      Npm是NodeJs包管理器,它类似于我们的Nuget。当安装完NodeJs,Npm会被默认安装。 

      前端非常混乱,包管理器就有很多,比如Bower,VS在之前的版本默认提供了对Bower的支持,不过后面删除了它,这也从侧面说明了Npm击败了竞争对手,成为前端事实上的标准包管理器。

      当你需要某个Js组件时,不用再千里迢迢打开网站下载,只需打开Npm配置文件package.json,把你要下载的Js组件写上去就好了。

      想知道某个Js组件有没有更新,只需在package.json移动鼠标即可。

      或者直接在package.json的版本号位置敲代码提示快捷键,Ctrl + 空格 或 Ctrl + J。


     

      当你把需要的Js组件添加到package.json,Ctrl + S保存以后,VS就开始自动下载了,这让你心情非常愉快,VS不愧是银河系最强的IDE。 

      过了一个小时,你吃完饭回来,发现它还在下载,难道是网络不好?这是由我国众所周知的原因导致的。 

      要想让Npm还原成功,你必须禁止VS Npm自动还原,先来设置下VS。

      在国内如果没有特殊装置,Npm基本无法还原成功。

      一种选择是使用淘宝镜像,这是我初期使用的方法。

      另一种方法是使用Yarn来还原Npm,有人给我推荐了它,使用后发现这家伙的下载速度更快,我现在也强烈推荐给你。

      先去这里https://yarnpkg.com/zh-Hans/docs/install#windows-stable下载一个Yarn安装包。

    安装完成,命令行yarn –v,看看是否安装成功。

    •  Webpack

      Webpack是NodeJs生态中用来进行自动化构建的工具。它非常强大,打包压缩不过是它的冰山一角。

      前端的混乱来自开源项目的百家争鸣和低耦合的设计理念。

      前端技术一片繁荣,这得益于开源项目的蓬勃发展,低耦合的设计理念让你在遇到相关问题只需寻找对应组件,集成上来就能结束战斗。

      这确实很好,但却苦了我们这些码农。

      你必须对各种框架,各种组件,以及这些组件中的插件非常了解,否则你无法工作。

      这大幅增加了学习成本,专业前端人员薪资高确实是有道理的,看看别人吃了多少苦头。

      还在怀念.Net前几年高度集成的开发方式吗?那个时代已经过去了。

      在Webpack之前,还有Grunt,Gulp等构建工具,Webpack凭借递归查找依赖的能力打败了它们,成为前端事实上的标准自动化构建工具。

      Webpack是一个插件体系,拥有丰富的插件,不论打包压缩,还是将Ts编译成Js,都有相应的插件支持。

      Webpack表面上很易用,这是建立在你对它的插件很了解的基础上,如果你是个新手,想添加某个特性,但却不知道哪个插件具有这个功能,通过查看webpack官网并不一定能解决问题,因为很多插件的说明非常模糊,你只能自己多尝试。

      虽然如此,你也大可不必泄气,你所使用的前端框架,会为你做好Webpack配置,基本不用操心。

      一旦把Webpack配置好,它就会非常易用,自动化构建的整个流程被隐藏在一行npm命令中。

      Webpack通过Npm安装,所以不需要单独安装它了。

    Util Demo运行说明

    开发环境确认

      上面已经简要介绍了Util的开发环境,为了将Util Demo运行起来,我们再确认一遍。

    • 你安装了VS 2017最新版本。
    • 你安装了.Net Core SDK正式版最新版本。
    • 你安装了Sql Server 2012或更新版本。
    • 你安装了NodeJs。
    • 你安装了Yarn。
    • 你已经从Github下载了Util,并保证是最新版本。

    运行数据库脚本

      由于我开发采用的是Db First,所以给你提供了一个Sql Server的建库脚本,这也是我平时的测试方式。

      不要担心,你完全可以使用Code First方式,这只是我的个人习惯问题。

      请将Sample.sql建库脚本复制到Sql Server并执行。

     

      下面,你需要修改Util.Samples.Webs项目数据库连接字符串,它在这里。

    还原Npm

      在Util.Samples.Webs项目上右键,选择“在文件资源管理器中打开文件夹”,进入Util.Samples.Webs项目根目录。

      按住Shift,在Util.Samples.Webs项目根目录空白位置右键,选择“在此处打开命令窗口”。这样做的目的是打开一个命令行,并且路径是Util.Samples.Webs项目根目录。

      注意:不同的操作系统,菜单提示不同,我用的是Windows 2008 R2。

      输入命令yarn,开始还原。

     

      如果你人品爆发,可能没有看见任何错误就还原成功了。

      不过在大部分情况下,你都会得到一个错误。这是由大名鼎鼎的巨无霸先生node-sass导致的。

      node-sass是用来帮助将scss编译成css的编译工具,scss是一个css预处理器,给css增加了变量,控制结构等编程元素。Boostrap等现代前端框架都采用scss编写。

      我观察到,node-sass从npm下载后,会运行脚本,然后访问github及其它Url,毫无疑问,这将被拦截在摇篮中。

      安装node-sass的解决方案是cnpm,这是淘宝提供的npm包安装工具。

      我们先来安装cnpm。

    npm install -g cnpm --registry=https://registry.npm.taobao.org

      下面用cnpm来安装node-sass。

    cnpm install node-sass

      如果你运气不是太差,npm包应该还原成功了。 

      如果你是第一次接触npm,在还原完成后,项目根目录会出现一个node_modules文件夹,你细数了一下文件的数目,大吃一惊,居然有10几万个文件,这就是低耦合的悲剧,习惯就好。 

      在cnpm还原node-sass的提示中,有一个版本警告信息,不要管它,目前我使用的是node-sass 4.7.2这个版本,更高版本有编码错误,如果在scss中存在中文注释,会编译失败。 

      我发现npm治愈了我的升级强迫症,你如果也有这个毛病,请小心测试后再升级。 

      当你发现cnpm如此强悍,连node-sass这个巨无霸都败在它的脚下,你可能会直接用cnpm还原所有npm包。

      注意:cnpm还原的包与npm并不完全相同,特别是使用VS开发前端项目,问题尤其严重,在打开解决方案时,会卡住好几分钟,你只应该用cnpm来还原node-sass,其它的采用yarn

    执行Webpack构建流程

      你只需要一行npm命令就能把webpack构建流程跑起来。

    npm run dev

      如果这个过程没有报任何异常,说明构建成功了。

      如果有异常,通常说明npm包尚未完全还原成功。

    运行Demo

      终于你可以把Demo运行起来了,F5把浏览器弹起来。

     

      这是一个貌不惊人的Crud Demo,看到这个界面很多人可能大失所望,搞了半天就这么个东西?

      不要急,我给你展示的只是最简单的东西,好让你快速上手,Util封装的是Angular官方提供的Material这套组件库,你可以到Material的官网https://material.angular.io/看看它包含哪些东西。

      Material缺乏像Ng Alain这样的脚手架主界面,我项目上是前端人员自己搭建的。另外似乎国内用Material风格来开发管理后台的并不多,基于这个原因,我已经有封装Ng Alain + Ng-Zorro的计划。 

      另一个Demo页面展示了树型Crud操作,将向你展示Util是如何对树型关系进行封装的。

     

    注意事项

      如果你根据上面的介绍还是无法将npm还原成功,可能有以下原因。

    • VS进程锁定了node_modules目录,你在还原时最好把VS关掉。
    • 如果你之前已经还原过,可能存在垃圾文件干扰,这需要先删除node_modules目录,你可以直接删除文件夹,不过可能需要半小时以上时间,你应该通过命令行来删除它。
    npm install rimraf -g
    rimraf node_modules

      删除node_modules目录也应该关掉VS,以免干扰。

    • 你需要特别关照node_sass,没事就cnpm搞它一下。

    小结

      本文介绍了Util的运行环境以及注意事项,初次接触现代前端环境会有点不适,不过挺过去你就能再多干几年。

      未完待续,下一篇将对Util Demo的运行机制进行介绍。

      写文需要动力,请大家多多支持,点下推荐,Github点下星星。

      Util应用框架交流一群: 24791014

  • 相关阅读:
    kafka学习
    centos/Fedora/RHEL 安全设置
    cordon、drain、delete node区别
    HARBOR 仓库 API功能接口
    gcr 镜像无法下载问题
    linux系统 重启盘符错乱问题
    Kafka史上最详细原理总结
    redis 部署
    mongodb4.0 安装
    gitstats 统计gitlab仓库中的代码
  • 原文地址:https://www.cnblogs.com/xiadao521/p/Util-Introduction-2.html
Copyright © 2011-2022 走看看