小学教师家访记录,远东电线电缆,五桂桥汽车站
作者:依乐祝
原文链接:https://www.cnblogs.com/yilezhu/p/9985451.html
本来这篇只是想简单介绍下asp.net core mvc项目的(毕竟要照顾到很多新手朋友),但是转念一想不如来点猛的(考虑到急性子的朋友),让你通过本文的学习就能快速的入门asp.net core。既然是快速入门所以过多过深的内容我这里就一笔带过了!然后在后面的一些列文章中再慢慢的对其中的概念进行阐述。
本文已收录至.net core实战项目之cms 第一章 入门篇-开篇及总体规划 点击可以查看更多教程。
很多朋友看到.net core就认为是asp.net core,其实这是有误区的,因为.net core 是开放源代码的通用开发平台 (是一个“平台”),基于这个开放平台我们可以开发像asp.net core应用程序, windows 10 通用 windows 平台 (uwp),tizen等等,而我们系列教程就是用.net core开发asp.net core应用程序。而且由 microsoft官方团队 和 .net社区成员共同在 github 上进行维护。 它跨平台(支持 windows、macos 和 linux),并且可用于生成设备、云和 iot 应用程序。
.net core 还具有以下特性:
asp.net core 是一个由微软创建的,用于构建 web 应用、api、微服务 的 web 框架。它使用常见的模式,诸如 mvc(model-view-controller)、依赖注入,和一个由中间件构成的请求处理管道。它基于 apache 2.0 许可证开放源码,就是说,源代码可以自由获取,并且欢迎社区成员以 缺陷修复 和 新功能提交 的方式进行贡献。
asp.net core 运行在微软的 .net 运行时库上,类似于 java 的 虚拟机(jvm)或者 ruby 的解释器。有几种语言(c#,visual basic,f#)可以用来编写 asp.net core 程序。c# 是最常见的选择,当然我大多数人都是采用c#来进行开发的。你可以在 windows、mac,和 linux 上构建并运行 asp.net core 应用。
现存的 web 框架选项已经很多了:node/express、spring、ruby on rails、django、laravel 等等,数不胜数。asp.net core 又有什么可取之处呢?为什么要用asp.net core开发应用程序呢?
数百万开发人员使用过(并将继续使用)asp.net 4.x创建 web 应用。 asp.net core 是重新设计的 asp.net 4.x,更改了体系结构,形成了更精简的模块化框架。
asp.net core 同时具有如下优点:
在继续进行asp.net core代码的编写前,我们需要安装 .net core的运行环境。这部分我们就一步一步的进行 .net core的环境搭建吧。
首先你可以google搜索一下.net core,如果没错的话第一个就是微软的官方下载地址,当然你可以 (目前sdk最新的是v2.1.500,runtime最新的版本是v2.1.6 )进行开发的话下载sdk即可。
双击你下载好的sdk然后傻瓜式的一步一步的进行安装即可,微软的软件的安装太简单的,以至于我如果再细说你们都会嫌我啰嗦了。所以,这里我只贴一张安装成功的图吧。
接下来按住 shift+鼠标右键
,然后选择“在此处打开powershell窗口”或者“在此处打开命令行窗口”。然后输入dotnet --info
查看下我们已经安装的.net core 的信息,当前运行的环境,已经以往安装的版本信息,我的版本比较多,因为我用了很长时间了。如果你第一次安装可能只有一个。出现下面第二张图的界面也就说明我们的.net core开发环境已经就绪了!下面就让我们撸起袖子开始干吧。
这里为了照顾到更多的小伙伴,我就不实用cli命令行来创建asp.net core项目了,还是中规中矩的使用vs2017吧!什么vs2017需要激活码?那你自己想办法吧!反正637326624这个群里的小伙伴都激活了!废话说了一堆,我们开始吧!
首先第一步肯定是打开你的vs2017了,然后点击左上角“文件”-》“新建”-》“项目”(或者你嫌麻烦,可以使用ctrl+shift+n
这个快捷键),打开如下的创建新项目对话框,然后按照如图所示进行选择并点击确定吧(什么?你居然没创建成功?那么我觉得你是在侮辱我了):
哈哈,上图点击确定后并没有创建成功,而是会弹出下一个对话框,如下所示,他会让你选择目标框架是.net core还是.net framework;是选择创建一个空的解决方案还是创建一个带有模板的web项目!至于各自的区别,有兴趣的朋友可以每个都创建一下然后对比下各自的区别哦!这里我们按照下图所示选择mvc的web应用程序:
创建成功后,看到如下的结构,标准的mvc结构,不过跟.net framework时代的mvc又有所不同。wwwroot:网站的静态文件目录(为什么在这里就能加载呢?大家可以先思考下)
appsettings.json:配置文件,比如数据库连接字符串等等配置信息。
program.cs:程序入口文件(里面有个main方法);
startup.cs启动配置文件 ;
依赖项:管理项目所依赖的第三方组件的安装,配置,升级
controller:控制器
models:实体
views:视图
由于篇幅有限,就不过多的讲解了。
按下键盘的f5或者如下图所示点击运行按钮,看下效果吧!
如果不出意外的话你将看到如下图所示的界面。
看到没有,就这么简单我们就运行起来了一个asp.net core的mvc站点。到这里是不是就已经结束了呢?骚年你想多了,因为我还要让你多会点东西。,所以这个第六条就是用来说废话的,然后作为一个分割。
models:在models文件夹上右键新建两个类:一个content类;一个contentviewmodel类 ,代码如下(这里就不教你怎么创建类了,如果跟你说了,那就是在侮辱你的智商了):
namespace sample01.models { /// <summary> /// 2018.11.19 /// 祝雷 /// 内容实体 /// </summary> public class content { /// <summary> /// 主键 /// </summary> public int id { get; set; } /// <summary> /// 标题 /// </summary> public string title { get; set; } /// <summary> /// 内容 /// </summary> public string content { get; set; } /// <summary> /// 状态 1正常 0删除 /// </summary> public int status { get; set; } /// <summary> /// 创建时间 /// </summary> public datetime add_time { get; set; } /// <summary> /// 修改时间 /// </summary> public datetime modify_time { get; set; } } }
namespace sample01.models { /// <summary> /// 2018.11.19 /// 祝雷 /// content视图模式 /// </summary> public class contentviewmodel { /// <summary> /// 内容列表 /// </summary> public list<content> contents { get; set; } } }
controller:模型建好了,那么我们就新建一个控制器,然后再创建一些模拟的数据吧,代码如下:
namespace sample01.controllers { /// <summary> /// 2018.11.19 /// 祝雷 /// content控制器 /// </summary> public class contentcontroller : controller { /// <summary> /// 首页显示 /// </summary> /// <returns></returns> public iactionresult index() { var contents = new list<content>(); for (int i = 1; i < 11; i++) { contents.add(new content { id=i,title=$"{i}的标题",content= $"{i}的内容",status=1, add_time=datetime.now.adddays(-i)}); } return view(contents); } } }
views:模型跟控制器都建好了,那我们就建一个视图来显示我们创建的数据吧!我们可以有很多种方式创建这个视图,这里给你介绍一种傻瓜式的,把鼠标放在index大括号里面,然后鼠标右键选择创建实体,如下所示即可创建视图文件,位置在/views/content/index.cshtml文件:
我们按照如下的代码稍微改造下这个view:
@model contentviewmodel @using humanizer; @{ viewdata["title"] = "内容列表"; } <div class="panel panel-default todo-panel"> <div class="panel-heading">@viewdata["title"]</div> <table class="table table-hover"> <thead> <tr> <td> <input type="checkbox" class="done-checkbox"></td> <td>序号</td> <td>标题</td> <td>内容</td> <td>添加时间</td> </tr> </thead> @foreach (var item in model.contents) { <tr> <td> <input type="checkbox" class="done-checkbox"> </td> <td>@item.id</td> <td>@item.title</td> <td>@item.content</td> <td>@item.add_time.humanize()</td> </tr> } </table> </div>
然后修改下布局文件,位于 views/shared/_layout.cshtml
的布局文件里面存放着所有视图的“基础”html。其中就包括导航栏,它被显示在每个页面的顶端。为了向导航栏添加新条目,我们需要再这个文件中增加我们的content乐目,代码如下:
<li><a asp-area="" asp-controller="content" asp-action="index">content</a></li>
到这里代码基本完成,按下你的f5键,然后导航到content看下效果吧:
这里是真的结束了!
你以为我会上传源代码?骚年,想什么呢,这么简单,还是自己敲下吧!不要妄图做眼高手低的人哦!
好了,又到了总结时间,本文首先给你讲解了什么是.net core?什么又是asp.net core?接着带着你一步一步的配置了.net core的开发环境。最后又带着你一步一步的创建了一个asp.net core的mvc项目,同时又通过一个实战教你如何在页面显示一个content的列表。如果你跟着楼主一点一点的把代码敲起来,然后跑起来了!那么你会发现asp.net core原来这么简单。什么?你觉得简单?那么下一篇文章,博主就带给你一些复杂的概念,什么依赖注入啊,配置文件的加载啊(分析下源码呗)等等!至此,快速入门asp.net core看这篇就够了,圆满结束。
如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复
Blazor server side 自家的一些开源的, 实用型项目的进度之 CEF客户端
.NET IoC模式依赖反转(DIP)、控制反转(Ioc)、依赖注入(DI)
vue+.netcore可支持业务代码扩展的开发框架 VOL.Vue 2.0版本发布
网友评论