Angular 16+ 高级教程 – 谈谈 ASP.NET Core & Angular & React 在业务开发上各自的优势和体验

前言

日常, 我的开发都围绕着 ASP.NET Core 和 Angular. 这篇想聊聊它们各自的特点和解决问题的方式.

以及最重要的, 我们该在什么时候采用何种方案更为妥当.

浅谈项目分类

我一般会把项目分 4 种来看待

1. Web 1.0 时代的网站

比如企业网站. 这类网站的目的是 present information. 用户行为是游览 + 少量的交互.

游览就是一页一页的. 所谓的 multipl pages

交互分两种

一种是 "show more 交互". 网页设计有一个 "渐进式阅读” 的原则. 你不要一上来就给我一堆的内容, 我要先过一遍, 感兴趣的才深入阅读.

于是网页就出现了许多 hidding information. 当用户感兴趣时就通过交互展开这些内容.

比如: slider, accordion, tabs

另一种交互是 "provide data 交互". 用户想提交一些数据给站长.

比如像订阅就需要提供 Email, 想联系站长需要提供, name, contact, message 等等.

2. Web 2.0 时代的网站

Web 1.0 的特色是, 网页内容都是由站长提供的. 而 Web 2.0 则多了一个提供方. 那就是用户.

比如, 电子商务网站.

3. Web Application

Web Application 指的是利用 Web 技术 (HTML, JS, CSS) 做出来的应用程序.

网站和 Application 应用程序的区别是

App 强调在 "用", 网站则是偏 "看"

我们拿一家卖产品的公司来举例.

step 1: start from 企业网站, present company profile and product catelog, 用户来 “看”, 有兴趣就联络 submit enquiry form (Web 1.0)

step 2 : upgrade to 电子商务网站, 用户 "看" > 注册 > add to cart > make order > payment (Web 2.0)

step 3 : upgrade to Web Application, 交互流程没有变, 只是提升了交互体验 (PWA 了解一下)

step 4 : upgrade to mobile app, web app 受技术限制, 体验不会比原生 mobile app 好. 所以要想再提升就要用 mobile app 了.

整个过程就是需求和体验的升级, 从开始的 "看" + "enquiry form" 到后来的 "register > add to cart > order > payment", 用户需要做的事情越来越多.

4. 后台管理系统 (control panel)

不管是 CMS, CRM, ERP 都算是管理系统.

你可以把它看成是 "一种" Web Application. 但我会把它独立出来.

浅谈 ASP.NET Core

ASP.NET Core 主要有 2 种用法

1. Razor Pages / MVC 适用于开发网站

2. Web API 适用于开发 API server (前后台分家)

开发网站

网站有分很多种, 比如企业网站, 电商网站, 博客网站, 社交平台等等.

精确的话 ASP.NET Core Razor Pages 方案比较适合开发 Web 1.0 年代的网站. 比如企业网站 (就是那种以游览为主, 很少交互的网站)

原因我后面会说, 先聊聊网站访问流程和开发分工.

网站访问流程

一般网站访问流程大致是这样的

step 1: browser request web page from server

step 2 : server 从数据库获取数据

step 3 : server 把数据和 HTML 模板做结合 (binding)

step 4 : server 返回 HTML

step 5 : 用户交互

step 6 : browser 通过 form post 或者 ajax 发 request 到 server

step 7 : server 返回 HTML 或者 JSON

step 8 : browser 刷新或者局部刷新

网站开发分工

后端负责 ASP.NET Core 和 Database, 前端负责 HTML, CSS, JS.

ASP.NET Core 的强与弱

step 2, 3, 4 是 ASP.NET Core 主要发力的地方. (这部分都是偏 "游览“)

step 5 - 8 则是偏 "交互", 除了 form submit + reload page 和 server 处理 ajax 并返回 JSON 以外, 其余的部分 ASP.NET Core 几乎是一点忙都帮不上的.

于是, 当网站需要越多交互体验的时候, 采用 ASP.NET Core 开发就会越吃力.

网站开发 – 分工

ASP.NET Core 的开发人员是属于后端开发人员. 上面 8 个 step 只有 binding 模板/form 需要一点点的前端知识

其余的地方完全不需要. 所以常见的分工方式是一个. 前端负责 HTML, CSS, 其余的都交给 ASP.NET Core 开发人员.

binding 模板的部分双方配合一下或者让 ASP.NET Core 的开发人员学一点简单的 HTML 就可以了

2. 微软本身就没有要提升这部分.

重交互的网站, JS 必然重. 一旦 JS 重你就必须要搞一个前端开发. TS, Sass, Bundle 那一套就来了.