【Dotnet9-01】从0开始搭建开源项目-lqclass.com

行文目录

  • 一. 前言
    • 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做的,是世界上最好的语言开发的😏,但我还是要自己开发一套网站出来,只为一点:

因为我是程序猿,我想完全自主可控😂!

有些特殊功能,身为站长的大大们都知道,不自己开发是不太容易配置出来的:

  1. 访问来源IP监测、限制(白名单、黑名单);
  2. 访客喜好分析;
  3. 广告出现概率配置
  4. 友链排序、检查

...

1.3 目前开发计划

  1. 后台使用WTM搭建前后端(React + .NET Core Web API)。
  2. 使用WPF仿照React前端搭建一个管理客户端出来。
  3. 前台也使用React(这个后面再看)。
  4. 前台后端和后台后端使用同一个。

二. 行动了

2.1 Github创建项目

2.1.1 申请一个域名

哈哈,这个不是必须的,建站会上瘾,站长申请过一个域名lqclass.com,就以这个名字创建仓库名吧。

2.1.2 访问Github,创建项目

国内用户可能需要科XX网,否则登录有点慢,下面是站长创建的仓库截图:

仓库创建信息

部分说明:

  • Add .gitignore选择VisualStudio,会将C#模板项目编译生成的中间文件提交时忽略

仓库创建初始模板

2.2 使用 WTM 搭建后台框架

2.2.1 为什么使用WTM搭建后台框架?

  1. 站长从头搭建一个权限框架很费时,毕竟才搞B/S不到2年😂,其实主要是懒。
  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打开解决方案

拷贝WTM项目

初始项目解决方案结构

2.3 项目演示

你没看错,使用WTM生成项目已经完成,下载后,直接解压,不需要任何配置,选择项目名对应的名称,点击运行即可(运行时,自动下载前后端依赖包,按个人网络实际情况,时间可长可短)。

VS直接运行项目

  • 第一次运行,后端会生成数据库表,会花点时间,需要等待一会儿

项目运行演示

2.4 注意点

  • 在编译时可能会出现下面的问题
严重性	代码	说明	项目	文件	行	禁止显示状态
错误	MSB3073	命令“npm install”已退出,代码为 1。	lqclass.com	F:\dotnet\lqclass.com\src\lqclass.com\lqclass.com.csproj	36	

解决办法:

前端需要配置npm淘宝源,或者科XX网,否则下载前端包时会失败。

站长使用了淘宝源,安装了cnpm包,使用cnpm install下载前端项目依赖包后,再在vs中一键运行即可,react 前端路径:lqclass.com\src\lqclass.com\ClientApp`

三. 结语

项目已经创建完成,可以先提交代码了,这就不截图了,大家可以访问仓库地址查看:点击浏览

接下来,站长将后台前后端部署在云服务器上,几个月前买了香港的腾讯云服务器,不用备案,部署很方便,下篇见。


一些推荐

  1. 【Blazor 开源控件库】点击浏览

  2. 【B/S 开源项目】WTM

  3. 【WPF 开源控件库】点击浏览

  4. 【WPF 开源项目】点击浏览

  5. 【Xamarin 开源项目】点击浏览

  6. 【Winform 开源控件库】点击浏览

  7. 【Winform 开源项目】点击浏览

  8. 【Qt 开源控件库】点击浏览

  9. 【Qt 开源项目】点击浏览

  10. 【更多分享】点击浏览


资源分享

  • 回复数字【01】:获取DotNet技术资料
  • 回复数字【02】:获取Java技术资料
  • 回复数字【03】:获取Android技术资料
  • 回复数字【04】:获取C++技术资料
  • 回复数字【05】:获取Qt技术资料
  • 回复数字【06】:获取React资源
  • 添加号主微信号【dotnet9】:备注【入群】加入与大佬们的技术交流
  • 添加QQ群【771992300】:备注【Dotnet9】加入技术交流,无人数上限、有资源共享

时间如流水,只能流去不流回。

  • 公众号:Dotnet9
  • 号主微信号:dotnet9
  • 仓库地址:lqclass.com
  • 编辑:沙漠之尽头的狼
  • 日期:2020-12-07

微信公众号:Dotnet9

posted @ 2020-12-08 20:59  沙漠尽头的狼-Dotnet9  阅读(273)  评论(0编辑  收藏  举报