Web的大趋势：Java+大前端

Posted 2020-11-25 life is not only coding......

　　前后端分离，是目前Web开发的主流模式也是趋势。而Java无疑是后端开发的王者（一条彪壮的鲶鱼，不知道吃什么长大的），php和.NET目前仍处于水深火热之中，更像是在夹缝中求生存，因为没办法和Java正面硬拼（假设Java部队有100w人，而PHP或者.Net部队可能只有十几万人，而这些人分散在各个IT公司）。大前端呢，最近几年发展很快，属于不断崛起的新势力！Java+大前端这一强强组合，面对其他没有前后端分离的竞争者，可以将其按在地上使劲摩擦（没别的歧视的意思，夸张手法，打个比方，就像Java部落有100w人，前端部落也100w人，其它一个部落可能才十几万人）。

　　 PHP要生存，怎么办？不断的往H5移动端靠，不断的往所谓的全栈靠，让其作为一些前端开发人员的全栈补充技能，甚至有些公司的PHP程序员被要求掌握Python。全栈，很多时候变成了“全干”！许多公司为了节约成本，希望一个人可以干几个人的活，可是一个人是一个进程，让一个人开多线程去VS多人多进程？

　　.Net要生存，怎么办？开源、舍弃.net framework，推广新框架.net core，跨平台并大力推广，......可是国内的互联网公司们都不愿意冒险，不愿意摸着石头过河，而是希望有现成的经历过时间考验、市场验证的成熟技术方案.......尽管相比于之前，微软算是给了很大的诚意，可是许多公司的决策层认为，选择这个会不会犯下技术大方向的错误，他们或多或少的从某些地方或者某些人口中会听到XX技术栈是目前比较主流的，有很多成熟解决方案和案例，然后他们表示再看看，观望一下.......

　　其它的后端开发语言如果不和前端进行联合，在面对Java+前端的组合时很难对抗。（假设Java部落100w人，前端部落100w人，Python部落80w人，PHP部落和.Net部落、android部落、ios部落等等各20w人），在谁也没有比谁先进多少的情况下，人数和战力往往成正比。不管你是用什么语言做web开发，只要不拥抱大前端，就很难和拥抱了大前端的对手拼。Java就像一条不安分的鲶鱼，每次它突然出现在公司，都会感到一丝威胁，它似乎带有侵略性，一开始可能还能和你和平相处，当你放松警提时，可能会想方设法吃掉你或是把你赶出领地。有人的地方就有江湖，有江湖的地方就有派系，公司也是如此。

　　前后端分离后，不管你后端用Java也好、.Net也好，PHP也好，前端代码都可以不用动，后端是什么技术栈的项目都可以对接。不管是Java、.Net、还是PHP或是其它的，如果不做前后端分离会是很糟糕的，因为现在的界面需求越来越复杂，越来越追求用户体验，尤其是移动端，更是如此。前后端代码糅合在一起想要改造升级非常困难，前端人员很难帮得上，因为要看懂部分后端的代码和后端常用的视图引擎，前端的组件化和模块化也无法和具体业务进行很好的分离。

　　前端的兴起，搞得Android和IOS原生开发也失去了往日的辉煌，以前还有WP（一个坑程序员的技术，我当时还买过wp10的诺基亚手机，最终因为只能看mp4格式的视频（其它的软件要付费），无法点外卖、无法打车、无法用支付宝、微信无法支付...我愤怒而又绝望的扔到了河里），不管什么技术，没有人用，没有开发者、没有用户，你说它一文不值也不算太过分，因为技术是第一生产力，而前提是要给社会创造它应有的价值。做程序员也一样，你掌握的技术再牛逼，没有人用，就你一个人孤芳自赏，也是枉然！价值衡量的一个最粗暴的标准：就是用户数和影响力。通常技术影响的用户越多，影响面越广，它给社会带来的价值越大。

　　前端的发展，真的要感谢微软、感谢.net、感谢后端。为什么这么说？在WPF和Siverlight出现之前，前端根本就没有什么所谓的MVVM（vue 、react、 angular）。前端不断的在借鉴（抄袭）后端的架构、设计思想、语法和框架。而node.js的实现，让这一切抄袭变成了可能。看看现在css（less、sass 、scss、stylus）和js（typescript、ES6+）等都和C#、Java这样的高级语言一样要先预编译，也有了封装、继承、多态、组件化、模块化的概念，如此一来重前端的发展也逐渐成为可能，要知道这些东西，以前都是后端高级语言的专利。

　　作为一名普普通通的开发者，说什么大道理都没什么用，我们首先得考虑生存（稳定的工作和收入），面向RMB编程，其次是考虑做的东西是否有意义（对社会有贡献）。我们只是单纯的在互联网的大浪潮中生存，在其中分一杯羹，然而适应时势而已，因为我们是普通人。当然也不排除会出现一些可以左右互联网浪潮，英雄造时势的人物。

　　技术人员：时间投入=》技术回报=》金钱回报。回报率？？

　　简单识别XX技术或者XX框架火不火：GitHub上搜一搜，看看星星数；求职网上走一波，瞧瞧职位数。

　　社会很残酷，互联网的竞争很激烈，所谓物竞天择适者生存。不要扯什么情怀，能当饭吃否？市场决定一切！在Web领域，移动端的快速崛起，PC端也逐渐显现其发展的疲态，不管我们愿不愿意接受这一事实。

　　我们先来看下目前前端可以做什么？

　　前端技术栈

 　　前端就业方向及相关技术栈

　　再来看看Java后端，彪壮的鲶鱼

 　　Java技术栈和生态

 　 　Java应用领域

　　世界在变化，时代在发展，技术在革新！那个曾经会js、jquery和切图、会java三大框架，会用.net拖控件和.net mvc，会用php开发网站就能在web领域混饭吃的年代渐渐远去了，各种技术都在不断更新和发展，与时俱进，才能走得更远！

　　那些说什么互联网做web开发门槛低啊什么的人，要么自己是天才，要么自己不懂！那么多东西要学个不停，低吗？所谓的门槛低，是指学历低吧？不持续学习就很容易out，这年头，做程序员真不容易？每年多少互联网从业人员被浪潮吞没？一些人被逼跳楼了，一些人被逼猝死了，一些人被迫转业了，一些人还在互联网的浪潮里苦苦挣扎，还有一些人却成为了弄潮儿（这里，我解释一下，这指极少数技术出身后来成为大佬的领军人物，互联网大佬多数都是技术出身）......

　　当我不知道下一个风口在哪时，我选择赶往现在的风口，当然，前提是你得有这样的机会.....

　　后记（个人经历）：曾经我是一名.net铁粉，有多铁，直接跟公司摆明态度：你要是敢抛弃.net，我跑路给你看！结果公司：你不转就给我滚蛋！发觉我把.net当成情怀和信仰，经历N次跑路后，我待过的用.net技术的公司，现在都变成java技术栈了，若问待过多少家公司，依稀记得两位数.......唯一在一家公司待满了两年，却是因为被迫转前端了（摆在面前三条路：1.再次跑路，继续做.net；2.去做前端；3.去转java），我终于妥协，我做前端还不行么？不管你以后后端换啥都和我没关系，我开始不再像年轻时候那样倔强和固执，否则换得公司会更多，奔四后就想开始寻求稳定.....当时的感觉就是这样，永远不知道公司哪一天会突然转java（我也不知道为什么不是转其它的，反正我待的公司都是这样子，其技术组合无外乎就是Java做后端接口，然后前端分离，这样简单直接的方式，和PHP互不侵犯不一样，Java更像一条鲶鱼）！一开始我怀疑是公司的问题，所以几十人、几百人、几千人、几万人的公司我都换过，可后来发现结局都一样：某一天它们居然跑去搞java了，不愿意转java的我只能不断跑路.....经历过N次跑路，我终于明白Not only .Net，做技术不止.net这一条路的。

　　公司要技术转型总会抛出一些危险信号：1.原班技术人马被撤。2.新引入其他技术（JAVA）的架构师，并扩大技术队伍。3.你所在的技术团队招人困难，规模缩减（其它技术团队在扩招）。通俗的理解就是：磨已卸好，驴安在？

　　再次申明：本文，只是作者个人观点和经历描述，并没有呼吁大家去学xx，转xx，大家都是成年人，有自己的思想和辨别能力的，我就是一个摇旗啦喊的人，也没有收人家钱！有不同观点的意见的也欢迎留言评论！O(∩_∩)O哈哈~毕竟我们都没有拿人家钱来当水军........

　　温馨提示：转技术有风险，在学有余力的情况下，多掌握一门技能是可以的。而每个人时间精力学习力都是有限的，如果公司要换技术，要么走，要么留，留就快速掌握公司要用得技术，并去钻研它，走，就继续做自己熟悉的技术。就跟你买股票买大盘和小盘一样的，买大盘还是小盘都可以。没有说做java一定很好，我有个大学同学一直做java，干垮的公司不下10家，总共换过二十余公司比我做.net时换得还多........

　　下面这段本来不想说，可是许多.Net程序员，认为我刻意去踩.Net，我就补充说明一下：

　　Java目前形式比人强，大多数公司的架构师都是Java技术栈的人，其实我恨Java，但是又不得不接受它，我花了那么多时间学.net，本来做.net做得好好的，它突然跑出来破坏了公司的技术生态，搞得我现在又要重新学其它的东西，我不是学习狂，谁不想好好玩，都是没有办法逼自己，是被国内的互联网公司逼的，被Java这样的鲶鱼逼的。可是谁不知道会不会某一天突然又出来新的XX，把Java给吃了，我期待着.......

　　根据惯例，文章中只要提及某一门语言，哪怕说一丁点不是就会引来骂声一片，为此我郑重声明:PHP是宇宙最好的语言!.net神通广大，战无不胜，.net法驾中原，仙福永享，寿与天齐! Java NO.1。

　　纵观历史，很少有某一样东西一直形势比人强，如楚汉之争，国共之争，一时的兴衰并不代表未来!我并没有刻意贬.net，.net兴对我百利而无一害，看不起.net的恰恰是发工资的公司老板和决定我们薪资的公司决策层们!看不起.net的是那些线上线下的培训机构和大学（它们不开课），看不起.net的是那些找我做项目的客户，他们一听说我用.net做项目，就带着疑问的语气和我交谈......许多人可能没有经历过，不清楚其中的辛酸，可是这些我都经历过（去面试、去讲课、去谈项目、去推销书都有遇到这样的问题...）......我甚至曾经因为公司不用.net，跟公司领导干过架，跟公司java架构师干过架，当然，结局肯定是犹如小怪兽打奥特曼，被虐得不要不要的……这是我的经历和感触，可能是我运气不好而已，我也不怨天尤人，吐槽归吐槽，生活还是要继续~环境每天都在变化，改变不了环境，就努力适应，不把自己固定和局限在某一个技术领域。多年后，我在领英上发觉当年公司一些只会.Net的微软哥现在好多其它技术都会了（虽然人现在依旧在微软就职），时代在变，人也在变......我挑一位来看下他领英上的技能图，这位是我以前公司的上司，曾经的.Net超级粉（已就职微软10年），我的感觉就是Not only .Net，如下：

　　这些不是我臆想出来的，不信可以看看一些培训机构官网开的课程，培训机构是以市场需求为导向的，同以往相比课程上新增了Python，H5，新媒体短视频运营，UE，产品经理，影视制作，智能机器人。撤掉了平面，Android，IOS，.NET课程，如下图所示：

　　我只是把自己以前做.net时的经历说出来，不是每个人像我一样那么运气差的......是不是我的表达有什么问题？为什么都说我是在说Java多好，.Net和PHP如何不堪呢？感觉很多人误解我要表达的意思，所以我只好不断修稿.....

　　是不是我把图文中所有java全部换为.net就可以了？做过.Net都知道，Java的东西加一个.net或者N就行了，额...我想想，诶？PHP程序员何在？为什么没有PHP程序员喷？文中明明说到了前端、PHP、Android、IOS，为什么大家只看到Java和.Net？就因为我之前做过.NET和Java吗？可我也做过前端啊！对此，我表示不服！这应该不是我的表达有问题，是一些开发者先入为主带有偏见在阅读？还是一些人脆弱的自尊心，让其不愿意面对和接受残酷的现实？

　　好吧，下次我出版一本《Spring Boot 21天入门到精通》、《你必须掌握的PHP》，去毒害Java、PHP程序员，最后来一句：对不起，我是卧底！要不是合作人中途撤场，现已出版！O(∩_∩)O哈哈~

　　说明：本文仅代表个人观点！不一定正确！以上图片均从传智播客官网转载！

　　写这个博文连包白沙都没有，若拿这些字数给出版社换稿费，还可以换两包和天下，本来就是嘛！至于吐槽我.net书写得烂的，我认可，可是国内技术书写得比我烂的多了去了，说最烂的书和一文不值的垃圾，我就不认了，多数读者能受益就有价值，一本书不可能满足每一个人，《圣经》也会有人觉得是垃圾，一样的道理么。出版社和读者都不傻，如果真烂得那么夸张，一本.net技术书也很难六次印刷，不是么？至于说发博文的都是半桶水的，我也认，我本来就是一个普通的开发人员，又不是什么大牛。如果都是大牛，然后都不发文章，会怎么样？

      如果觉得我写的毒文章辣到了您的眼睛，对不起，请直接无视它，忘记它，文章内容不代表事实，你可以看成是故事。越来越少发文章了，因为发得好还好，发得不好，会被喷死，喷就算了，最重要的是居然还没钱，所以更愿意把时间都拿去学习、写稿、做私单换钱去了.....

　　好了，作为前端开发者，我现在要开始去毒害前端人员了，二月份烂书《Vue.js 2.x实践指南》已出版，阅读有害健康，但是有利于国家！（本书提供PPT课件和示例代码）

　　书目录：

第 1 章    7
◄ VUE开发前奏 ►    7
1.1  网站交互方式    8
1.1.1  多页WEB应用（MPA）    8
1.1.2  单页WEB应用（SPA）    9
1.2  前后端分离的开发模式    11
1.3  前端三大开发框架    12
1.4  为什么要学习流行框架（MVVM框架）    13
1.5  框架和库的区别    14
1.6  模块化和组件化    14
1.7  后端中的MVC与前端中的MVVM 之间的区别    15
1.8  NODE.JS安装    16
1.9  PROMISES介绍    17
1.9.1  在PROMISES出现之前的文件读取方式    17
1.9.2  PROMISES基本概念介绍    19
1.10  ES7语法糖ASYNC/AWAIT    22
1.11  开发工具    23
1.11.1  VISUAL STUDIO CODE    24
1.11.2  VUEDEVTOOLS    25
1.11.3  CHROME    25
第 2 章    26
◄ VUE基础入门 ►    26
2.1  VUE发展历史    26
2.2  什么是VUE.JS    27
2.3  VUE基本代码    27
2.4  VUE常用指令介绍    30
2.4.1  V-CLOAK指令    30
2.4.2  V-html指令    32
2.4.3  V-BIND&V-ON指令    33
2.4.4  示例：跑马灯特效    34
2.5  事件修饰符    35
2.6  V-MODEL双向数据绑定    40
2.7  V-FOR和KEY属性    42
2.8  V-IF和V-SHOW    46
2.9  在VUE中使用样式    47
2.9.1  使用CLASS样式    47
2.9.2  使用内联样式    48
2.10  过滤器    49
2.10.1  全局过滤器    49
2.10.2  私有过滤器    50
2.11  键盘修饰符以及自定义键盘修饰符    51
2.12  自定义指令    52
2.13  增删改查示例    53
第 3 章    58
◄ VUE进阶 ►    58
3.1  VUE生命周期    58
3.2  AXIOS介绍    61
3.2.1  跨域请求    64
3.2.2  NODE手写JSONP服务器剖析JSONP原理    65
3.3  VUE过渡动画    67
3.3.1  单元素/组件的过渡    67
3.3.2  列表过渡    73
第 4 章    75
◄ VUE组件开发 ►    75
4.1  组件介绍    75
4.1.1  全局组件定义的三种方式    75
4.1.2  使用COMPONENTS定义私有组件    77
4.1.3  组件中展示数据和响应事件    77
4.1.4  组件切换    78
4.2  组件传值    80
4.2.1  父组件向子组件传值    80
4.2.2  子组件向父组件传值    81
4.2.3  事件总线（EVENTBUS）    83
4.3  组件案例：留言板    85
4.4  使用REF获取DOM元素和组件引用    88
4.5  VUEX    90
4.5.1  安装VUEX    91
4.5.2  配置VUEX的步骤    91
4.6  RENDER函数    94
第 5 章    97
◄ 路由VUE-ROUTER ►    97
5.1  什么是路由    97
5.1.1 前端路由的原生代码实现    97
5.2  安装VUE-ROUTER的两种方式    98
5.3  VUE-ROUTER的基本使用    99
5.3.1 404    101
5.4  设置选中路由高亮    102
5.5  为路由切换启动动画    103
5.6  路由传参QUERY&PARAMS    103
5.6.1  QUERY    104
5.6.2  PARAMS    105
5.7  使用CHILDREN属性实现路由嵌套    105
5.8  使用命名视图    107
5.9  WATCH监听    110
5.10  COMPUTED：计算属性的使用    111
5.11  WATCH、COMPUTED、METHODS的对比    113
5.12  NRM的安装及使用    114
5.1.3  VUE-ROUTER中编程式导航    115
第 6 章    117
◄ WEBPACK介绍 ►    117
6.1  WEBPACK概念的引入    117
6.2  WEBPACK：最基本的使用方式    118
6.3  WEBPACK最基本的配置文件的使用    121
6.4  WEBPACK-DEV-SERVER的基本使用    122
6.5  使用HTML-WEBPACK-PLUGIN插件 配置启动页面    124
6.6  WEBPACK-DEV-SERVER的常用命令参数    125
6.7  WEBPACK-DEV-SERVER配置命令的另一种方式    127
6.8  LOADER：配置处理CSS样式表的第三方LOADER    127
6.9  LOADER：分析WEBPACK调用第三方LOADER的过程    129
6.10  NPM INSTALL --SAVE 、--SAVE-DEV 、 -D、-S、-G 的区别    130
6.11  LOADER：配置处理LESS文件的LOADER    131
6.12  LOADER-配置处理SCSS文件的LOADER    131
6.13  WEBPACK中URL-LOADER的使用    132
6.14  WEBPACK中使用URL-LOADER处理字体文件    136
6.15  WEBPACK中BABEL的配置    137
第 7 章    140
◄ WEBPACK和VUE的结合 ►    140
7.1  WEBPACK中导入VUE和普通网页 使用VUE的区别    140
7.1.1  在WEBPACK中使用VUE    140
7.1.2  在WEBPACK中配置.VUE组件页面总结    146
7.2  EXPORT DEFAULT 和 EXPORT 的使用方式    147
7.3  结合WEBPACK使用VUE-ROUTER    149
7.4  结合WEBPACK实现CHILDREN子路由    152
7.5  组件中STYLE标签LANG属性和SCOPED 属性的介绍    153
7.5.1  重写子组件中的样式    154
7.6  抽离路由模块    156
第 8 章    158
◄ WEBPACK中UI组件的使用 ►    158
8.1  使用饿了么的MINT UI 组件    158
8.1.1  BUTTON组件    159
8.1.2  TOAST组件    160
8.2  MINT UI按需导入    162
8.3  MUI介绍    164
8.4  MUI的使用    164
8.5  VANT UI    165
8.6  ELEMENT UI    166
8.6.1  引入ELEMENT    166
8.6.2  ELEMENT常见应用场景及解决方案    166
第 9 章    176
◄ 移动图书商城 ►    176
9.1  MOCKJS介绍    176
9.2  APP首页设计    177
9.3  使用阿里巴巴矢量库    178
9.3.1  UNICODE、FONT CLASS和SYMBOL的区别    179
9.3  APP.VUE 组件的基本设置    181
9.3.1  设置路由激活时高亮的两种方式：    181
9.3.2  实现 TABBAR 页签不同组件页面的切换    182
9.3.3  路由切换添加过渡效果    183
9.4  首页轮播图    184
9.4.1  什么是 BASE64 编码?    187
9.5  首页九宫格    188
9.6  图书分类组件    191
9.7  制作顶部滑动导航    194
9.8  制作图片列表    198
9.9  在ANDROID手机浏览器中调试APP    201
9.10  真机调试    202
9.11  封装轮播组件    204
9.12  商品详情页    205
9.12.1  自定义V-TAP指令    208
9.13  购物车小球动画    209
9.13.1  GETBOUNDINGCLIENTRECT    211
9.14  封装购买数量组件    211
9.15  设计购物车数据存储    213
9.16  我的购物车    215
9.17  增加页面返回    220
9.18  总结    221
第 10 章    222
◄ 天下会管理平台 ►    222
10.1  VUE前端开发规范    222
10.1.1  统一开发环境    222
10.1.2  技术框架选型    222
10.1.3  命名规范    223
10.1.4  注意事项    224
10.1.5  ESLINT配置JS语法检查并自动格式化    225
10.2  通过VUE-CLI来搭建项目    227
10.3  完善项目结构    230
10.3.1  设置浏览器图标    230
10.3.2  完善SRC源码目录结构    230
10.3.3  引入ELEMENT UI    231
10.3.4  封装AXIOS请求    231
10.3.5  AJAX跨域支持    236
10.3.6  封装全局的CSS变量文件    238
10.3.7  VUE-WECHAT-TITLE动态修改TITLE    239
10.3.8  封装全局的配置文件BASE-CONFIG.JS    239
10.4  项目介绍及其界面设计    240
10.5  项目设计和分析    242
10.5.1  帮主首页    242
10.5.2  其他管理界面    244
10.5.3  设计路由    248
10.5.4  设计业务逻辑层    251
10.5.5  VUEX设计    252
10.5.6  权限设计    254
10.5.7  菜单组件    254
10.6  表单验证    260
10.7  登录    266
10.7.1  帐号密码登录    267
10.7.2  在线生成二维码    270
10.7.3  制作网站ICO图标    270
10.7.4  存储登录信息    271
10.7.5  回车自动登录    272
10.7.6  防止登录按钮频繁点击    272
10.8  增删改查列表    273

View Code

　　图书购买地址：《Vue.js 2.x实践指南》

　　.net开发好啊
　　真的好
　　.net开发棒
　　真的棒
　　我是.net程序猿
　　万能程序猿
　　你是程序猿
　　我是程序猿
　　.net开发好耶
　　真是好啊
　　.net开发好耶
　　太棒了啊
　　.net开发够劲
　　顶呱呱啊
　　我是程序猿
　　程序猿啊
　　他是.net开发
　　哇吼哇吼哇吼