内容简介

  让读者了解所有新的和改进的ASP.NETCore功能
  开发用户期望的功能丰富、灵活且响应敏捷的设计
  描述使用ASP.NETCore进行前端开发的很新、很好实践
  详述如何大限度地利用具有非原生功能的第三方库
  解释如何组合应用ASP.NETCore与不同的工具、框架和库
  探讨Bower依赖关系、gulp构建系统与ASP.NETCore的使用

作者简介

  SimoneChiaretta(现居比利时布鲁塞尔)是一位网页架构师和开发者,他乐于分享自己20多年来在ASP.NETWeb开发和其他Web技术方面的开发经验和知识。Simone成为ASP.NET领域微软MVP已有8年,撰写了几本关于ASP.NETMVC的书籍(包括Wrox出版的BeginningASP.NETMVC1.0和What’sNewinASP.NETMVC2,以及Syncfusion出版的OWINSuccinctly和ASP.NETCoreSuccinctly),并为在线开发者门户(例如SimpleTalk)做出了贡献。Simone还与他人共同创立了意大利ALT.NET用户组ugialt.NET,并且是在米兰召开的许多会议的共同组织者。
  读者可在Simone的博客http://codeclimber.net.nz上阅读他的想法和开发技巧。
  在不编写代码和博客文章或是不参与全球.NET社区活动时,Simone喜欢研究Arduino(一种开源硬件)、无人机和水下机器人,并且正在接受培训,以在2018年完成他的一台“钢铁侠”。他是在布鲁塞尔工作的众多外籍专家中的一员,在那里他领导欧盟理事会(欧盟的执政机构之一)公共网站的开发团队。

目录

目录
第1章ASP.NETCoreMVC的新变化1
1.1熟悉软件名称2
1.1.1ASP.NETCore2
1.1.2.NETCore2
1.1.3VisualStudioCode3
1.1.4VisualStudio20173
1.1.5《WEB前端开发:使用ASP.NET Core、Angular和Bootstrap》涵盖的版本3
1.2微软.NETWeb堆栈简史4
1.2.1ASP.NETWebForms4
1.2.2ASP.NETMVC5
1.2.3ASP.NETWebAPI5
1.2.4OWIN和Katana6
1.2.5ASP.NETCore和.NETCore的出现7
1.3.NETCore7
1.3.1.NETCore入门8
1.3.2dotnet命令行8
1.4ASP.NETCore介绍9
1.4.1ASP.NETCoreWeb应用程序项目概述9
1.4.2OWIN13
1.4.3ASP.NETCore应用程序剖析16
1.5ASP.NETCore的重要新特性19
1.5.1环境19
1.5.2依赖关系注入21
1.5.3日志记录24
1.5.4配置26
1.6部分ASP.NETCore中间件简介31
1.6.1诊断31
1.6.2提供静态文件服务32
1.6.3应用程序框架33
1.7ASP.NETCoreMVC34
1.7.1在ASP.NETCore中使用MVC框架34
1.7.2在控制器中使用依赖关系注入36
1.7.3视图组件38
1.7.4标签帮助程序40
1.7.5WebAPI45
1.8本章小结46
第2章前端开发者工具集47
2.1需要了解的其他几种语言48
2.1.1Node.js49
2.1.2JSON50
2.1.3Sass和Less51
2.1.4JavaScript的未来53
2.1.5TypeScript54
2.2JavaScript框架55
2.2.1Angular56
2.2.2Knockout58
2.2.3React60
2.2.4jQuery63
2.3CSS框架63
2.3.1Bootstrap63
2.3.2PrimerCSS66
2.3.3MaterialDesignLite66
2.3.4SemanticUI67
2.4包管理器68
2.4.1NuGet68
2.4.2Bower70
2.4.3NPM71
2.4.4文件夹结构71
2.5任务运行程序72
2.6本章小结74
第3章Angular简析75
3.1Angular的基本概念76
3.2Angular的实现语言78
3.3建立一个Angular项目79
3.3.1使用在线编辑器79
3.3.2利用快速入门示例80
3.3.3使用Angular-CLI工具80
3.4Angular应用程序结构81
3.4.1应用程序入口81
3.4.2根模块82
3.4.3根组件84
3.4.4主HTML页面85
3.5数据绑定86
3.5.1插值86
3.5.2单向绑定87
3.5.3事件绑定88
3.5.4双向绑定88
3.6指令89
3.7服务与依赖注入90
3.8多重组件92
3.9输入与输出属性95
3.10与后端程序交互99
3.10.1使用Http模块100
3.10.2处理RxJSObservable101
3.11Angular与ASP.NETMVC的结合应用105
3.12VisualStudio2017对Angular的支持116
3.12.1代码片段116
3.12.2TypeScript文件中的智能提示118
3.12.3HTML文件中的智能提示119
3.13本章小结120
第4章Bootstrap入门121
4.1Bootstrap简介122
4.1.1安装Bootstrap122
4.1.2Bootstrap的主要特性125
4.2Bootstrap样式125
4.2.1网格系统125
4.2.2排版130
4.2.3表格131
4.2.4表单132
4.2.5按钮134
4.3组件134
4.3.1字体图标134
4.3.2下拉菜单135
4.3.3输入组137
4.3.4导航139
4.3.5其他组件145
4.4JavaScript146
4.4.1标签页内容146
4.4.2模态对话框148
4.4.3工具提示和弹出对话框150
4.5使用Less定制Bootstrap152
4.5.1通过网站定制152
4.5.2使用Less定制154
4.6VisualStudio2017和ASP.NETCore中的Bootstrap支持155
4.6.1BootstrapSnippetPack157
4.6.2Glyphfriend158
4.6.3ASP.NETCore的标签帮助程序159
4.7本章小结160
第5章使用NuGet和Bower管理依赖关系163
5.1共同概念164
5.2NuGet165
5.2.1使用NuGet获取软件包166
5.2.2发布自己的软件包170
5.3NPM(Node.js包管理器)172
5.3.1安装NPM172
5.3.2NPM的用法173
5.3.3软件包的安装位置176
5.4Bower176
5.4.1安装Bower177
5.4.2使用Bower获取软件包177
5.4.3软件包的安装位置179
5.4.4创建自己的软件包180
5.5本章小结180
第6章使用gulp和webpack构建应用程序183
6.1前端构建系统的作用184
6.2gulp深度介绍185
6.2.1gulp入门185
6.2.2gulpfile.js文件186
6.2.3典型gulp构建文件188
6.2.4更多gulp技巧190
6.3webpack介绍197
6.3.1webpack的主要概念197
6.3.2应用webpack197
6.3.3webpack的其他功能202
6.4VisualStudio2017和构建系统203
6.4.1Bundler&Minifier扩展203
6.4.2任务运行程序资源管理器207
6.4.3将智能提示用于gulp208
6.5本章小结209
第7章部署ASP.NETCore211
7.1ASP.NETCore的新托管模型212
7.2在自有IIS环境上的安装213
7.2.1确保一切就绪213
7.2.2安装AspNetCoreModule215
7.2.3通过命令行发布应用程序216
7.2.4创建网站217
7.2.5通过VisualStudio发布应用程序218
7.3在Azure上部署220
7.3.1使用Web部署从VisualStudio部署到Azure220
7.3.2利用git持续部署到Azure224
7.4部署到Docker容器228
7.4.1安装Docker支持228
7.4.2发布Docker映像231
7.5本章小结233
第8章非Windows环境中的开发235
8.1在macOS上安装.NETCore236
8.2在macOS上构建第一个ASP.NETCore应用程序237
8.2.1使用dotnet命令行界面237
8.2.2使用Yeoman240
8.3VisualStudioCode243
8.3.1设置VisualStudioCode环境243
8.3.2VisualStudioCode的开发特性244
8.3.3OmniSharp250
8.3.4其他IDE251
8.4使用命令行工具251
8.5本章小结252
第9章综合运用253
9.1构建一个铁人三项赛成绩网站254
9.2构建后台网站254
9.2.1设置EntityFramework259
9.2.2构建CRUD界面264
9.3构建注册页面269
9.4展示实时成绩273
9.4.1创建Angular客户端程序274
9.4.2构建WebAPI279
9.5使用物联网设备连接284
9.6部署288
9.7本章小结290


前言/序言

  前言
  曾几何时,后端开发人员和前端开发人员从事着迥异的工作。后端开发人员使用服务器端语言编写用于呈现页面的代码,前端开发人员则使用JavaScript编写具有一定交互功能的代码,并使用CSS美化Web页面。
  几年之前,随着单页面应用程序(SPA)的登场,JavaScript不再局限于增加“一定”的交互性,还能构建应用程序本身。后端开发人员必须扩展自己的技能储备,以纳入前端开发人员的典型工具,例如特定的JavaScript框架,以及CSS的基础运用。
  《Web前端开发》的目标是阐释前端开发人员的常用工具,以及如何有效地将它们与ASP.NETCoreMVC组合运用。
  为何Web开发需要通晓多种语言的开发人员
  在日常生活中,“多语言者”(polyglot)是指了解并能使用多种语言的人,他们不需要精通双语(或多语),但能较熟练地使用第二种或更多种语言。
  何谓多语言开发人员?是指一名了解超过一种(编程)语言或框架,能在同一个程序中使用它们的开发人员。
  从IT行业发端之日开始,应用程序主要是使用一种编程语言编写的,笔者个人是从C开始的,然后转向VisualBasic,在ColdFusion上着陆,使用过JavaScript早期版本(在客户端和服务器端均用过),进行了一点Java开发,最终固定在.NET平台上,但每段时间里只使用一种编程语言。
  那时是大型企业级框架的时代,厂商试图向他们的语言或框架中塞入应用程序可能需要的一切特性。微软曾经试图将开发人员与Web实际使用的语言HTML和JavaScript隔离开来,推出了ASP.NETWebForms和ASP.NETAjax框架。如果读者回顾自己在IT行业的经历,可能会找到许多类似的例子。
  不过最近出现了一种新趋势,走向相反的方向,IT业界认识到,或许有的语言比其他语言更适于完成某些特定任务,人们使用多种语言开发应用程序,而非试图强行用一种语言包打天下。
  现在我们已经统一了“多语言开发人员”一词的定义,接下来让我们看看,作为一名多语言开发人员有什么优势。
  工欲善其事,必先利其器:在工作中选择合适的工具
  多语言开发的第一个也是最重要的好处是能够选择完成工作的最适合工具,而不必因为语言或框架不支持某个指定功能而不得不做出妥协。
  例如,使用微软Ajax框架时,将受限于它提供的功能,而直接使用JavaScript,则可拥有该语言的全部灵活性。
  作为一名Web开发人员,必须了解HTML语言,但只要使用VisualStudio的开发界面,仅拖曳工具箱中的工具,即可构建Web应用程序。显然,此时无法像直接编写HTML一般,拥有彻底的控制力。
  所以,在某种程度上,每个Web开发人员都是多语言开发人员。
  另一个例子是Sass在VisualStudio2015中的集成。几年前Ruby社区提出了CSS样式预处理的创意,微软将其原始版本集成到其IDE中,而Sass正是预处理CSS样式的合适工具。
  他山之石:交叉思维的优势
  通晓多种语言的第二个好处是能从厂商和开源社区在其他语言的工作中获取灵感;在无法直接使用时,能够改造或开发适合自己的版本。
  ASP.NETMVC是这方面的一个绝佳例子。十年前,当时流行的语言是Ruby,这要归功于其简单的Web框架RubyonRails,它建立在模型-视图-控制器模式之上。.NET开发人员社区从中获得灵感,并开始同样基于MVC模式构建.NETWeb框架。这导致微软构建了ASP.NETMVC框架,该框架是《Web前端开发》介绍的主要内容之一。
  居安思危:扩展你的安乐窝
  如果不只考虑技术方面,使用多种语言和框架还带来了一项额外益处:它会迫使你走出现有的“安乐窝”,使你的适应性更强,并打破始终循规蹈矩地工作带来的厌烦情绪。毫不奇怪,有许多开发人员对尝试新事物犹豫不决,并且更喜欢使用他们最熟悉的工具、框架和语言,尽管这样做会牺牲灵活性和控制能力。但如果你正在阅读这《Web前端开发》,可能不是其中之一。因此,请准备好在《Web前端开发》的其余部分,学习源自Microsoft.NET领域之外的新语言和框架。一开始,你会走出你的“安乐窝”。而当学习完成时,你会发现“安乐窝”已经变得更大、更具回报。
  《Web前端开发》读者对象
  《Web前端开发》的目标读者是拥有ASP.NETMVC知识(无论是最新版本还是早期版本的框架)的人员的Web开发人员,以及希望学习使用前端开发中流行工具和框架的人员。此外,《Web前端开发》也可以作为已经采用某些前端工具和框架,但希望通过VisualStudio2017引入的集成功能更高效地使用它们的开发人员的指南。
  《Web前端开发》涵盖的内容
  《Web前端开发》主要介绍使用ASP.NETCoreMVC进行前端开发。除概述微软的最新框架外,还涵盖一些最受欢迎的前端框架和工具,如Angular、Bootstrap、NuGet、Bower、webpack、gulp和Azure等。
  除框架外,《Web前端开发》还展示了VisualStudio2017中面向前端开发的新特性,以及如何不使用该软件,而改用标准文本编辑器(例如MacOSX上的VisualStudioCode)开发ASP.NETCoreMVC应用程序。
  这并不是一本面向初学者的书籍,所以笔者假设读者已经掌握HTML、JavaScript和CSS的基础知识,了解C#或VB.NET(请记住所有示例都将使用C#编写),并且使用过ASP.NETMVC和WebAPI。
  《Web前端开发》的组织结构
  为帮助读者确定这《Web前端开发》是否适合自己,下面将简要解释《Web前端开发》的结构和每章的内容。
  ●第1章“ASP.NETCoreMVC的新变化”:介绍使用ASP.NETCore、ASP.NETCoreMVC以及.NET中的所有新功能和新开发方法。对于那些已经了解ASP.NETMVC最新版本的读者来说,可通过该章进行复习;对于新人而言,可通过该章来简单了解这个最新版本。
  ●第2章“前端开发者工具集”:开始探索前端开发人员的世界,介绍使用的工具类别,并介绍每类工具和框架中的佼佼者。
  ●第3章“Angular简析”:介绍Google的JavaScript框架Angular,阐释其中的主要概念,以及VisualStudio2017附带的新的Angular工具。
  ●第4章“Bootstrap入门”:介绍Twitter的CSS框架Bootstrap,并展示如何使用它构建自适应网站。该章还讨论Less(一种CSS预处理语言),以及它与VisualStudio2017的集成。
  ●第5章“使用NuGet和Bower管理依赖关系”:管理所有前端和服务器端的组件可能是件非常痛苦的工作,但幸运的是,存在一些组件管理器,能用于大大简化工作。可使用NuGet工具管理.NET服务器端依赖关系,而在客户端使用Bower。该章介绍如何与VisualStudio2017结合使用这些工具,以及如何打包库文件,以便在公司内部共享或与外界共享。
  ●第6章“使用gulp和webpack构建应用程序”:介绍gulp和webpack,这是两种可使用JavaScript进行编程的构建系统。该章还将介绍它们与VisualStudio2017的集成,以及ASP.NET开发中使用的一些常用秘诀。
  ●第7章“部署ASP.NETCore”:应用程序准备就绪后,即可进行部署。该章使用Azure展示集成了测试、构建和部署操作的持续流程。
  ●第8章“非Windows环境中的开发”:.NETCore堆栈的一个主要特性是它也可在Linux和Mac操作系统上运行。微软开发了一个跨平台的IDE,但也有其他选择。该章将介绍如何在Mac上完成所有ASP.NET开发。
  ●第9章“综合运用”:《Web前端开发》的最后一章将所有概念融会贯通,详解构建现代化、响应式网站所需的所有步骤,包括通过OAuth与第三方服务和认证相集成。
  学习《Web前端开发》需要准备的条件
  这《Web前端开发》中有很多示例,因此体验它的最好方法就是在电脑上亲自试一试。为此,需要安装Windows7/8/10操作系统和VisualStudio2017社区版。
  ASP.NETCoreMVC也可以在Windows、MacOSX或Linux上的任何文本编辑器中开发。微软还开发了一款名为VisualStudioCode的跨平台文本编辑器。在第8章中学习在Windows之外进行开发时需要使用该工具。当然也可以使用任何其他兼容的文本编辑器,但使用的命令和操作界面与VisualStudioCode中的不同。
  约定
  为了帮助读者准确掌握学习内容,获得最大收益,《Web前端开发》使用了一些约定。
  警告
  包含与前后文直接相关的重要、不可遗忘的信息。
  注意
  用于指示对当前讨论内容的注释、提示、技巧、旁白等信息。
  代码使用两种格式:
  对于大多数示例代码使用不突出显示的等宽字体。
  使用粗体强调该代码在当前上下文中特别重要,或体现其与前文代码片段的差异。
  注意
  由于许多书籍名称相似,你可能会发现使用ISBN进行搜索最简单,《Web前端开发》英文版的ISBN是978-1-119-18131-6。
  勘误表
  我们尽一切努力确保文本或代码中没有错误。但毕竟人非圣贤,难免会出现错误。如果在我们的某《Web前端开发》中发现错误,如拼写错误或代码错误,我们将非常感谢你的反馈。通过发送勘误表,可能能够帮助其他读者,使他们免于在挫折沮丧中浪费数小时,同时还能帮助我们提供更高质量的信息。

其他推荐