您现在的位置: 首页 > 网站导航收录 > 百科知识百科知识
有人说现在前端入门门槛越来越低，那么现在学前端还有前景吗？
技术,组件,框架有人说现在前端入门门槛越来越低，那么现在学前端还有前景吗？
发布时间：2020-12-06加入收藏来源：互联网点击：
HTML是一种标记语言，能够实现Web页面并在浏览器中显示。HTML5作为HTML的最新版本，引入了多项新技术，大大增强了对于应用的支持能力，使得Web技术不再局限于呈现网页内容。
随着CSS、JavaScript、Flash等技术的发展，Web对于应用的处理能力逐渐增强，用户浏览网页的体验已经有了较大的改善。不过HTML5中的几项新技术实现了质的突破，使得Web技术首次被认为能够接近于本地原生应用技术，开发Web应用真正成为开发者的一个选择。
HTML5可以使开发者的工作大大简化，理论上单次开发就可以在不同平台借助浏览器运行，降低开发的成本，这也是产业界普遍认为HTML5技术的主要优点之一。AppMobi、摩托罗拉、Sencha、Appcelerator等公司均已推出了较为成熟的开发工具，支持HTML5应用的发展。
2.2、CSS
学好CSS是网页外观的重要一点，CSS可以帮助把网页外观做得更加美观。
2.3、JavaScript
学习JavaScript的基本语法，以及如何使用JavaScript编程将会提高开发人员的个人技能。
2.4、Bootstrap
主流框架之一，Bootstrap 是基于 HTML、CSS、JavaScript的，它简洁灵活，使得 Web 开发更加快捷。
2.5、html5-boilerplate
该框架可以快速构建健壮，且适应力强的web app或网站。
2.6、Meteor
Meteor是新一代的开发即时web应用的开源框架，它能在较短时间内完成开发。
2.7、Semantic UI
基于自然语言有效原则的UI组件框架。
2.8、Amaze UI
国内首个开源HTML5跨屏前端框架产品系列，中文排版支持更优、本土化组件丰富。该产品系列中有专门针对移动端的HTML5混合应用开发框架Amaze UI Touch以及针对跨屏HTML5网页开发的Amaze UI Web。其中，Amaze UI Touch可以帮助开发者通过丰富的组件，快速构建出与原生APP相媲美的专属移动端的HTML5应用。
3、2022年前端技术领域变化
3.1、Web组件化
基本上这就是未来。为什么？因为这些纯Web组件与框架无关，并且可以在没有框架或没有任何框架拼写标准化的情况下工作。因为它们没有JS疲劳，并且得到了现代浏览器的支持。因为它们的文件大小和消耗将是最佳的，并且VDOM渲染令人赞叹。
这些组件提供了Custom Element，这是一个Javascript API，可让你定义新html标签，HTML模板以指定布局，当然还有Shadow DOM，它本质上是特定于组件的。在这个领域中知名的工具是Lit-html（和Lit-element），StencilJS，SvelteJS，当然还有Bit，它们是可重用的模块化组件，可以在任何地方直接共享，使用和开发。考虑组件开发时代的未来，以及模块化，可重用性，封装和标准化的原理，Web组件就是答案。
3.2、微前端
Serverless即“无服务器”架构，它试图帮助开发者摆脱运行后端应用程序所需的服务器设备的设置和管理工作，它由第三方云计算供应商负责后端基础结构的维护，同时以服务的方式为开发者提供所需的功能，例如数据库、消息、身份验证等。
微前端的概念类似于微服务，它将前端应用拆分成一个个更小的更简单的能够独立开发、测试、部署的小块，在用户看来它依旧是一个独立的产品。前端业务在发展到一定规模后，需要一种能将业务化繁为简的架构。常用的微前端解决方案有single-spa、qiankun。
微前端、Serverless目前都未出现大规模应用的情况，各大公司对此都处于探索阶段，两项技术稳步发展，期待未来大规模的应用。
3.3、微设计
布拉德·弗罗斯特（Brad Frost）提出的理论将Web应用程序的构成与原子，分子，有机体等的自然构成进行了比较，最后以具体的Web页面作为结尾。原子由分子组成（例如，文本输入+按钮+标签原子=搜索分子）。分子组成生物体。有机体位于布局模板中，该模板可以具体化为交付给用户的页面。
Atomic组件的优势不只是通过模块化和可重用的组件来构建模块化UI应用程序。这种范例迫使你思考组成每个组件的角色和API。
3.4、Web组装
Web程序集将语言多样性带入Web开发中，以弥补JavaScript创建的空白。它被定义为“基于堆栈的虚拟机的二进制指令格式。Wasm被设计为可移植目标，用于编译高级语言（如C/C ++/Rust），从而可以在Web上为客户端和服务器应用程序进行部署。”
埃里克·埃利奥特在他的文章中优雅地概述了该概念的好处：在wasm中实现对性能至关重要的内容，并将其像标准JavaScript模块一样导入。一种新语言：WebAssembly代码定义了以二进制格式表示的AST（抽象语法树）。您可以编写和调试文本格式，以便于阅读。对浏览器的改进：浏览器将理解二进制格式，这意味着我们将能够编译二进制捆绑包，压缩后的二进制包小于我们今天使用的文本JavaScript。较小的有效载荷意味着更快的传递。根据编译时的优化机会，WebAssembly的运行速度可能比JavaScript快！
3.5、封装样式和Shadow Dom
组件的一个重要方面是封装-能够使标记结构，样式和行为保持隐藏状态，并与页面上的其他代码分开，以使不同部分不会冲突，并且代码可以保持整洁。Shadow DOM API是其中的关键部分，它提供了一种将隐藏的单独DOM附加到元素的方法。Shadow DOM实际上已经被浏览器使用了很长时间了。您可以将影子DOM视为“ DOM中的DOM”。它是自己的隔离DOM树，具有自己的元素和样式，与原始DOM完全隔离。
它允许将隐藏的DOM树附加到常规DOM树中的元素上。该阴影DOM树以影子根开头，可以与普通DOM相同的方式附加到所需的任何元素上。这样做的主要目的是，我们不需要为类使用名称空间，因为不存在名称冲突或样式溢出的风险。这就是Web组件样式进行真正封装的解决方案。
3.6、TypeScript接管前端
最近的每次交谈都听起来好像TS正在接管前端开发。据报道，有80％的开发人员承认他们想在下一个项目中使用或学习TypeScript。尽管有缺点，但TS代码更易于理解，实现更快，产生的错误更少。想重构你的React应用程序并与TS一起使用吗？去吧。想逐步开始吗？使用Bit之类的工具逐步将你的应用程序中的组件重构为TS，并使用React-Typescript编译器独立于应用程序构建它们。
TypeScript，它是有类型定义的 JavaScript 的超集，包括 ES5、ES5+ 和其他一些诸如反射、泛型、类型定义、命名空间等特征的集合，为了大规模 JavaScript 应用开发而生。复杂软件需要用复杂的设计，面向对象就是一种很好的设计方式，使用 TypeScript 的一大好处就是 TypeScript 提供了业界认可的类（ ES5+ 也支持）、泛型、封装、接口面向对象设计能力，以提升 JavaScript 的面向对象设计能力。市面上的框架也对 TypeScript 提供了非常好的支持。
React 对.tsx 支持非常好，比如我在 Midway controller 里支持 tsx 写法，这是非常大胆的，对于后面 react ssr 来说是一个极大便利；Vue 从 v2.5.0 之后对 ts 支持就非常好；Node.js Web 框架，尤其是 Egg.js 对 ts 支持非常好，当然还有更高级更专注的的 Midway 框架，Midway 基于 Egg 生态，同时提供 IoC 等高级玩法；
下一篇：返回列表
相关链接 |
||
| 网友回复（共有 0 条回复） |