【更新】玩了一把Bridge.NET,手感不错

作者:V君 发布于:2018-9-24 9:32 Monday 分类:折腾手记

这次不是解决具体问题,TLDR就不存在了,直接开始扯。

在早些年就一直物色有没有C#版本的GWT之类的工具,在浏览器上跑C#或者把C#代码转成JS,
B/S开发不用把精力浪费在js这种过分动态的弱类型语言上
比起TS,还是能直接写C#更舒服。

接触Bridge.NET之前了解过Script#、JSILWootzJs之类的玩意儿,遗憾的是它们都不好使。
主要体现在元数据(反射)和三方库绑定(类型导入)上,直到发现了这货,
这两个问题已经得到基本上的解决,只是有些小毛病有点让人不爽。

搞B/S要对组成页面的三大要点DOM、样式、脚本,为啥不是HTML、CSS、JavaScript?
因为通过脚本可以控制前两者,嫌设置样式麻烦还有scss之类的预处理器,
手写原生代码时代已经一去不复返。

在Bridge.NET有一个名为Retyped的类型定义仓库,本文撰写时已收录3600+个常用Web类库。
不但三方库类型定义齐全,H5/DOM API也很完备,可以不管HTML直接用代码来撸DOM。

说完Web基础功能之后当然就是JS和TS做不到的运行时元数据啦!
Bridge.NET带有完整的元数据,我们可以尽情地使用各种Attribute和类型反射

顺便贴一下练手过程的副产物
前端路由:基于历史API造了个带拦截的前端路由轮子,用了Attribute和反射,手感不错
热更新(伪):每次调试生成后写入时间戳文件轮询检测到差异就刷新页面
Lodash:Retyped的类型定义库会造成编译失败略不爽,反正也只用到debounce,就自己
Ace编辑器:类型定义用着还不错,【更新虽然目前似乎没有同步到原来的类库定义,但可以在初始化之前来个workaround补丁脚本。

体验报告到此结束,接下来不用纠结选VUE还是这玩意了,博客系统的管理界面前端就用它吧!

标签: 软件开发 javascript C# Web技术

评论(0) 引用(0) 浏览(21)

吐吐苦水: 收集一些老项目中不合理的设计与编码,给后来开发人员添麻烦的例子

作者:V君 发布于:2018-9-9 2:11 Sunday 分类:填坑经验

从17年下半年开始收集,内容不多就先不放出来占条目

 

供引以为戒

 

1) 返回值是集合的方法,查询无结果时返回null

调用者必须繁琐地检查空引用

应参考Linq的ToArray, 在无结果时返回元素个数为0的集合实例

 

2) 对于WEB请求无论报错还是无结果,返回空字符串,尽管把错误写入日志

无法从浏览器前端直接得知是查询无结果还是服务端报错

应当在无查询结果时返回空集合实例, 在服务端报错时返回经过筛选的友好提示

 

3) RouterMapping.config

在一个相当老的项目中, 出现把所有MVC中Controller的Action全都定义到配置文件的现象,

这和早些年Java的SSH一个鸟养哇!

由于发布版本一般会排除配置文件,因为开发环境和正式环境不同,于是经常出现莫名其妙的Action丢失或404的扯蛋现象。或许是那时候使用的技术过于老旧

 

4) 二进制协议解析,变长数据,长度敏感

在协议中已明确变长的数据段中使用特定长度区分报文内容,

若厂商在日后扩充了协议(即长度变更)将会无法正确解析数据。

我们应该严谨的遵循协议文档实现解析,

遍历所有出现的数据段,只捡出需要内容,以便向后兼容。

 

5) (UintFlaggedEnum)int.Parse(dataReader["UintColumn"].ToString())

这真是2008年左右前刚毕业的人写的代码的味道.

在第31个bit被使用之前,这段代码是好用的, 一旦bit31被使用即爆炸.

在不能用ORM的时候我们应该使用一致的数据类型。

现在可以用Dapper之类的轻量级ORM代替手动邦定数据。

标签: 软件开发 C# Web技术 传输协议

评论(0) 引用(0) 浏览(21)

前端新手历险记之在VUE项目中使用Ace编辑器(brace)和一些TypeScript知识点

作者:V君 发布于:2018-9-8 23:52 Saturday 分类:折腾手记

TL;DR


▉ 将Ace编辑器引入项目

1) $npm install brace

2) $npm install --save @types/ace

3) ts:import * as ace from 'brace';

4) ts:import 'brace/...";


▉ TypeScript类型转换,对于 var dom = this.$refs["editor-dom"] 有两种方式

1) ts:ace.edit(dom as HTMLElement);

2) ts:ace.edit(<HTMLElement>dom);//这种方式会使tsx编译器报错标签未关闭,但实际能用


▉ 在TypeScript类中声明可空属性

在标识符后面加感叹号否则必须在构造时初始化,例子:

ts:private editor!: ace.Editor;


虽然这次的收获不多,但还是花了不少时间查资料来弄懂,得好好扯一扯:

阅读全文>>

标签: 软件开发 Web技术 VUE 前端构建

评论(0) 引用(0) 浏览(49)

在 vue-cli 3.x 创建的项目中启用反向代理

作者:V君 发布于:2018-8-26 21:50 Sunday 分类:折腾手记

TL;DR

1)在项目根目录创建 vue.config.js

2)在文件中指定配置 module.exports -> devServer -> proxy

3)按需增加详细参数 如重写


这次能扯的东西并不多。


主要把时间浪费在咕狗上。什么都不了解就直接搜“vue-cli 反向代理

粗心大意地忘了加上版本号,首先找到的是在config文件夹创建index.js的方法,没起作用。

后来加上版本号去搜索就发现了vue.config.js,再作为关键字就搜索到了官方文档

从目录一眼扫下来就发现了遍地文章提到的devServer配置节。

顺便贴一下本次练习中生效的作为参考:

module.exports = {

    devServer: {

        port: 8084,

        proxy: {

            '/api': {

                target: 'http://localhost:7808/',

                changeOrigin: true,

                pathRewrite: {

                    '^/api': ''

                },

            }

        }

    }

}

服务端路由为 /md 在前端配置成 /api/md。 

或许把前后端路径一致然后去掉pathRewrite参数比较好。



标签: 软件开发 Web技术 VUE 前端构建

评论(0) 引用(0) 浏览(55)

上手VUE前端构建

作者:V君 发布于:2018-8-25 21:46 Saturday 分类:折腾手记

TL;DR

1)官方网站,下载稳定版本的node安装,选择加到环境变量,然后配置淘宝NPM镜像

2)参考官方网站安装vue-cli

3)使用vue-cli创建项目,然后在VsCode编辑代码。


作为刚入门前端新手会扯得很细,不介意的话可以点进来看看

阅读全文>>

标签: 软件开发 Web技术 VUE 前端构建

评论(0) 引用(0) 浏览(39)

Powered by emlog 去你妹的备案 sitemap