行文目录
- 一. 前言
- 1.1 我的现有网站
- 1.2 想法:新开发一个网站
- 1.3 目前开发计划
- 二. 行动了
- 2.1 Github创建项目
- 2.2 使用 WTM 搭建后台框架
- 2.3 项目演示
- 2.4 注意点
- 三. 结语
- 一些推荐
- 资源分享
一. 前言
搭建这个开源项目,是想开发一个属于自己的网站,想做一个B/S(计划中也有部分C/S客户端和移动App端😀)的开源项目。
1.1 我的现有网站
大家知道站长有个网站(Dotnet9)是用WordPress搭建的,网站主题使用收费的JustNews主题,已运行1年多,目前没出什么大问题。
网站主要以DotNet文章分享为主,偶尔分享站长工作中产出的原创文章,大部分还是从各大公众号、博客园、CSDN等平台转载👀。
【网站广告】
目前网站挂了在线教育朝夕的广告及Google Adsense,程序猿的副业大家可以参考下【建站20天感悟】。
1.2 想法:新开发一个网站
Dotnet9站点运行不好?不要了?
运行很好!网站还要继续整的!
使用WordPress搭建的网站,有很多免费的、收费的插件选择使用,只要有不错的审美,你就可以搭配出很多个性化的网站风格出来。
就是因为太好了,而且是PHP做的,是世界上最好的语言开发的😏,但我还是要自己开发一套网站出来,只为一点:
因为我是程序猿,我想完全自主可控😂!
有些特殊功能,身为站长的大大们都知道,不自己开发是不太容易配置出来的:
- 访问来源IP监测、限制(白名单、黑名单);
- 访客喜好分析;
- 广告出现概率配置
- 友链排序、检查
…
1.3 目前开发计划
- 后台使用WTM搭建前后端(React + .NET Core Web API)。
- 使用WPF仿照React前端搭建一个管理客户端出来。
- 前台也使用React(这个后面再看)。
- 前台后端和后台后端使用同一个。
二. 行动了
2.1 Github创建项目
2.1.1 申请一个域名
哈哈,这个不是必须的,建站会上瘾,站长申请过一个域名lqclass.com
,就以这个名字创建仓库名吧。
2.1.2 访问Github,创建项目
国内用户可能需要科学上网,否则登录有点慢,下面是站长创建的仓库截图:
部分说明:
- Add .gitignore选择
VisualStudio
,会将C#
模板项目编译生成的中间文件
在提交时忽略
2.2 使用 WTM 搭建后台框架
2.2.1 为什么使用WTM
搭建后台框架?
- 站长从头搭建一个权限框架很费时,毕竟才搞
B/S
不到2年😂,其实主要是懒。 - 没有理由不选
WTM
,请看原作者的话
WTM
框架,全称WalkingTec MVVM
(不是“我特么”
的拼音首字母),WTM
是一个快速开发框架,有多快?至少目前dotnetcore
的开源项目中,我还没有见到更接地气,开发速度更快的框架。WTM
的设计理念
就是最大程度的加快开发速度,降低开发成本
。国内
Java
一家独大原因很多,有BAT
的示范效应,也有微软自己战略的失误
。好在微软这两年终于想明白了,dotnet core的横空出世
和收购github都是非常正确的方向。当然要想达到java
一样的生态还有很长的路要走,那我就贡献一点绵薄之力吧。
WTM开源
以来,受到了越来越多开发者的喜爱,WTM
必将以更加成熟稳定的姿态回报各位的喜爱。特别鸣谢贤心(layui.com),授权WTM
开发的项目可以免费使用其收费版的LayuiAdmin
。提高自己,造福他人,吾道不孤!
2.2.2 克隆lqclass.com仓库
原谅我git使用不熟,使用 GitHub Desktop
克隆上面创建的lqclass.com
仓库:
https://github.com/dotnet9/lqclass.com.git
2.2.3 使用 WTM 搭建后台
2.2.3.1 访问WTM项目体验地址:点击浏览
2.2.3.2 打开首页后,点击下面截图中的生成模板项目入口
2.2.3.3 创建生成WTM项目第一步,输入项目名称:lqclass.com
2.2.3.4 创建生成WTM项目第二步,项目配置
以下几点说明:
- 目前框架只支持.net core 2.2及3.1,.net 5尚未支持。
- 数据库站长使用了SQLite(本地文本数据库),方便快捷,不用安装,后面支持修改。
- 前端UI选择的React前后端分离
框架支持三种UI:LayUI、React前后端分离、Vue前后端分离。
LayUI使用的MVC模式,站长不熟;Vue站长以前还会一点,自从来了现在这家公司后,做上了React开发,React更熟悉一点了,所以你懂的,我选React。
最后点开【开始配置】即可,来张动图吧,网站会将配置好的框架打包下载:
2.2.3.5 复制WTM项目到本地仓库
在lqclass.com
本地仓库创建src目录存储源代码,并将WTM网站生成的项目源码拖进去,使用Visual Studio
打开解决方案
2.3 项目演示
你没看错,使用WTM生成项目已经完成,下载后,直接解压,不需要任何配置,选择项目名对应的名称,点击运行即可(运行时,自动下载前后端依赖包,按个人网络实际情况,时间可长可短)。
- 第一次运行,后端会生成数据库表,会花点时间,需要等待一会儿
2.4 注意点
- 在编译时可能会出现下面的问题
严重性 代码 说明 项目 文件 行 禁止显示状态
错误 MSB3073 命令“npm install”已退出,代码为 1。 lqclass.com F:\dotnet\lqclass.com\src\lqclass.com\lqclass.com.csproj 36
解决办法:
前端需要配置npm淘宝源,或者科学上网,否则下载前端包时会失败。
站长使用了淘宝源,安装了cnpm包,使用cnpm install
下载前端项目依赖包后,再在vs中一键运行即可,react 前端路径:lqclass.com\src\lqclass.com\ClientApp`
三. 结语
项目已经创建完成,可以先提交代码了,这就不截图了,大家可以访问仓库地址查看:点击浏览
接下来,站长将后台前后端部署在云服务器上,几个月前买了香港的腾讯云服务器,不用备案,部署很方便,下篇见。
时间如流水,只能流去不流回。
- Dotnet9