1. 前端开发框架有哪些
1. Bootstrap
Boostrap绝对是目前最流行用得最广泛的一款框架。它是一套优美,直观并且给力的web设计工具包,可以用来开发跨浏览器兼容并且美观大气的页面。它提供了很多流行的样式简洁的UI组件,栅格系统以及一些常用的JavaScript插件。
Bootstrap是用动态语言LESS写的,主要包括四部分的内容:
脚手架——全局样式,响应式的12列栅格布局系统。记住Bootstrap在默认情况下并不包括响应式布局的功能。因此,如果你的设计需要实现响应式布局,那么你需要手动开启这项功能。
基础CSS——包括基础的HTML页面要素,比如表格(table),表单(form),按钮(button),以及图片(image),基础CSS为这些要素提供了优雅,一致的多种样式。
组件——收集了大量可以重用的组件,如下拉菜单(dropdowns),按钮组(button groups),导航面板(navigation control)——包括:tabs,pills,lists标签,面包屑导航(breadcrumbs)以及页码(pagination),缩略图(thumbnails),进度条(progress bars),媒体对象(media objects)等等。
JavaScript——包括一系列jQuery的插件,这些插件可以实现组件的动态页面效果。插件主要包括模态窗口(modals),提示效果(tool tips),“泡芙”效果(popovers),滚动监控(scrollspy),旋转木马(carousel),输入提示(typeahead),等等。
Bootstrap已经足够强大,能够实现各种形式的 Web 界面。为了更加方便地利用Bootstrap进行开发,很多工具和资源可以用来配合使用,下面列举了其中的一部分工具和资源。
jQuery UI Bootstrap —— 对于jQuery和Bootstrap爱好者来说这是个非常好的资源,能够把 Bootstrap的清爽界面组件引入到jQuery UI中。
jQuery Mobile Bootstrap Theme —— 和上面提到的jQuery UI主题类似,这是一个为jQuery Mobile建立的主题。如果你想让用Bootstrap开发的网站在手机端也可以优雅访问,那么这个资源对你来说很方便易用。
Fuel UX —— 它为Bootstrap添加了一些轻量的JavaScript控件。Fuel UI 安装,修改,更新以及优化都很简单方便。
StyleBootstrap.info —— Bootstrap提供了自己的几种界面风格,StyleBootstrap提供了更多的配色选项,并且你可以给每个组件都应用不同的配色。
BootSwatchr —— 利用这个工具你可以立刻查看主题修改后的效果。对于每一次变动的效果,这个应用都会生成一个唯一的URL方便你与他人分享,你也可以在任意时刻修改你的主题。
Bootswatch —— 提供大量免费的Bootstrap主题。
Bootsnipp —— 在线前端框架交互组件制作工具,是一个供给设计师和开发者的基于Bootstrap HTML/CSS/JavaScript 架构的免费元素。
LayoutIt —— 通过界面拖放生成器简便快捷地创建基于Bootstrap的前端代码。通过拖放动作将Bootstrap风格的组件加入到你的个人设计里并且可以方便地修改他们的属性,简单便捷。
2. Fbootstrapp
Fbootstrapp基于Bootstrap并且提供了跟Facebook iframe apps和设计相同的功能。包含用于所有标准组件的基本的CSS和HTML,包括排版、表单、按钮、表格、栅格、导航等等,风格与Facebook类似。
3. BootMetro
BootMetro框架的灵感来自于Metro UI CSS,基于Bootstrap 框架构建,用于创建Windows 8 的Metro风格的网站。它包括所有Bootstrap的功能,并添加了几个额外的功能,比如页面平铺,应用程序栏等等。4. Kickstrap
Kickstrap是Bootstrap的一个变体。它基于Bootstrap,并在它的基础上添加了许多app,主题以及附加功能。这使得这个框架可以单独地用于构建网站,而不需要额外安装什么。你需要做的仅仅是把它放到你的网站上,然后用就可以了。
App 是一些页面加载完成之后加载运行的JavaScript和CSS打包文件。默认加载的app有Knockout.js, Retina.js, Firebug Lite, and Updater,你也可以自行添加更多的app。
选择不同的主题可以让你的网站在众多Bootstrap构建的类似网站中显得与众不同。
附加功能是一些用来扩展Bootstrap UI 库的附件,它们的语法基本相同或者相似。
2. laravel 前端脚手架怎么修改就打包资源
:laravel框架的开发不同于早期的那种php和asp的页面数据嵌套,无法用那种思路来开发网站的。不过倒是可以考虑前后台分离的思路。用laravel框架来做接口,暴露给html页面,用JSON来进行数据交互。然后在html页面用ajax来请求数据来更新页面内容。
3. 前端开发,用vue脚手架和不用脚手架区别在哪
脚手架的意思是帮你快速开始一个vue的项目,也就是给你一套vue的结构,包含基础的依赖库,只需要 npm install就可以安装,让我们不需要为了编辑或者一些其他事情浪费时间 总而言之,就是快速搭建项目的,让我们可以早点去写代码
4. web前端的行业趋势是什么
大公司是前端和移动APP开发合并,成为大前端,所以一个趋势就是移动web的趋势,另外HTML5开始流行,HTML5开发也是现在需求很大的一个岗位。
web前端有广阔的发展空间,app、小程序、移动端、pc端等都是需要前端技术的开发支持才能够完成,技术门槛相对较低、需求量较大,薪资待遇良好。只要是互联网端的客户界面,就需要前端来制作完成,前端开发的编程量不大,但是需要部分编程,入门简单,但是要学的深入需要一个过程。
Web前端招聘岗位
• 前端开发工程师、Web开发工程师、网页开发工程师、HTML开发工程师...
• H5开发工程师、移动应用开发工程师、App开发工程师、小程序开发工程师...
• JS开发工程师、Vue.js开发工程师、Node.js开发工程师、前端架构师...
• 小游戏开发工程师、数据可视化开发工程师、WebGL开发工程师、WebVR开 发工程师、Web安全工程师...
在互联网行业,前端有WEB前端、HTML前端等,随着互联网技术发展,就业方向也有很多。web前端的就业方向有web架构师、web前端工程师、HTML前端开发工程师、网页设计师等等。
HTML前端开发
与Web前端开发不同的是,使用HTML5不仅仅可以开发前端,还有网页游戏,手机APP,使用浏览器进行3D渲染等一系列建立在HTML5标准与搭载其标准浏览器上的开发,而未来可能会有更多的功能分支并入HTML5标准。web前端工程师
这个方向是目前从事Web前端开发的主要就业方向
Web架构师
薪资普遍比较高,技术要求高,掌握多种技能,包括:后端技术、DBA、Platform等等,甚至包括网站优化SEO技术。
数据方向
数据研发这个是在Web开发的基础上用数据附能,懂可视化的一定是有前端能力的,懂hadoop的一定java要熟悉,属于Web开发的拓展方向。
大前端方向
比如阿里,在大量实践rn和weex;由于公司内部安卓/ios式微,一定程度上,前端把ios和安卓收编了,统称大前端。
图形学方向
前端自然是与图形学有千丝万缕的联系,除了上面提到了可视化,还有相关3d引擎的开发工作。做这一行要求也非常高了,图形学相关的算法,3d引擎的开发,这都需要图形学相关知识。
5. 有哪些生成前端代码的神器呢
在前端开发的过程中,很多相同的代码会写很多遍。如:开始新项目的时候,要写和旧项目类似脚手架代码;新建一个组件的时候,要按约定写组件结构。如果这些重复代码能用工具来生成,能提升前端的开发效率。
生成代码的工具分为两类:基于命令的和基于图像界面的。
基于命令的工具的优点是,可配置高,效率快。缺点是,可发现性差。适合配置项目很多,配置可以组合的情况。
基于图像界面的优点是,可发现性强,操作简单。缺点是如果配置项很多,容易变得很难用。
罗嗦了一堆,下面开始介绍正题。
项目脚手架代码生成工具
项目脚手架主要做的项目的构建流程,环境的配置等。做到开箱即用。
基于命令的
yo曾经流行过的一个脚手架生成工具。支持定义脚手架内容。基于 yo 的第三方脚手架也很多。
vue-cli。 Vue 项目脚手架。支持自定义脚手架内容,感兴趣的可以读读从vue-cli源码学习如何写模板。
create react appReact 脚手架。比较轻量级,只是整合 webpack 和 react-router。
react boilerplateReact 脚手架。比较重量级,整合了webpack 和 react router, rex, rex suga, reselect 等。
基于图形界面的
定制 Bootstrap 3
组件代码生成工具
基于命令的
react boilerplate的nam run generate可生成组件的脚手架代码。
页面代码生成工具
基于命令的
代码编辑器的代码片段(Code Snippent)功能。主流的代码编辑器(Sublime,Atom,VS Code,Web Strom等) 都支持代码片段。也有写好的代码片段的编辑器插件。主流的框架基本都有对应的代码片段工具。
Emmet提供 HTML,CSS,JS 的自动补全功能。
Bootstrap 3 Snippets
Vuejs Snippets
基于图形界面的
H5营销页面生成工具。有一大堆。
Maka
初夜
兔展
GrapesJS强大的网页生成器。开源。
LayoutIt托拽 Bootstrap 组件,生成页面。
6. 前端或网站开发有哪些好用的脚手架
做开发的只要源码不加密技术好的话都可以做二次开发的。
7. 做Web前端开发有前途吗
当然有前途,但是这个前途也并不是针对所有人的,关键还是要看你自己是不是对前端有兴趣,将来是否打算找前端岗位工作等等。
就发展前景而言,自12年到现在,国内Web前端的技术热潮一直高居不下,这证明了前端是具有强大生命力的,至少未来5-10年是不用担心行业的发展问题。那么,2020前端发展的趋势会是怎么样的?
1.Webview是运营风口
近几年,小程序可谓是火得一塌糊涂,甚至独立出来小程序开发这个岗位。
小程序的出现一方面告诉业界在当前设备上 Webview 也是非常优秀的;另外一方面告诉业界如何让有能力的商家在超级APP上进行私域运营。但是缺点也是很明显的,可能很难产生业界的最终标准,Web 的碎片化会更加严重。
2.工程体系形成闭环
曾经我们侃侃而谈的 Yoman、cli等系列优秀的构建工具,在庞大的项目团队中总觉得“差点意思”,所以慢慢发展到gulp、webpack和现在的cli ui界面。
2020年工程体系一定会继续走向闭环,不再是一个脚手架这么简单,而是会结合 IDE,打通业务属性,从项目初始化、到编写代码、到 CI、到灰度、到发布形成一个相对完整的闭环。
3.Serverless与前端紧密联系
其实 Serverless 早已和前端产生了联系,只是我们可能没有感知,比如我们经常使用的 CDN,它就是一种 serverless 的实现。
随着 Serverless 的逐步落地,BFF 这层的代码会摆脱运维、机器分配等复杂的问题。这也是我们前端应该做的,服务端同学专注中台系统的实现,对业务的好处是降低试错成本。
简而言之,前端发展很猛,待遇很丰厚,但是,如果你想学前端,就要打起十二分的精神,因为前端发展的潮流会将那些能力不足、技术落后的学习者拍死在沙滩上。
8. 前端开发中提到的“脚手架”是指什么
前端开发中提到的“脚手架”是一个形象的比喻,比喻各类语言的前期工作环境。
在软件开发上(当然也包括前端开发)的脚手架指的就是:有人帮你把这个开发过程中要用到的工具、环境都配置好了,你就可以方便地直接开始做开发,专注你的业务,而不用再花时间去配置这个开发环境,这个开发环境就是脚手架。
比如vue.js就有个vue-cli脚手架,基于node.js的开发环境,作者帮你把开发环境大部分东西都配置好了,你把脚手架下载下来就可以直接开发了,不用再考虑搭建这些工具环境。
9. 前端开发中提到的“脚手架”到底指什么,CLI
软件开发的脚手架的概念是从建筑学术语上引申而来。在建筑学上,脚手架指施工现场为工人操作并解决垂直和水平运输而搭设的各种支架。你见过大楼施工吧?在大楼外墙围的那圈支架就是其中一种脚手架。
在软件开发上(当然也包括前端开发)的脚手架指的就是:有人帮你把这个开发过程中要用到的工具、环境都配置好了,你就可以方便地直接开始做开发,专注你的业务,而不用再花时间去配置这个开发环境,这个开发环境就是脚手架。
比如vue.js就有个vue-cli脚手架,基于node.js的开发环境,作者帮你把开发环境大部分东西都配置好了,你把脚手架下载下来就可以直接开发了,不用再考虑搭建这些工具环境。
10. 除了yeoman 还有哪些前端脚手架
一个流行的工具集,集合了grunt,bower,yo等工具,创建高质量可维护的应用。
在开发初期要对技术选型,在大多数web应用中,都需要第三方库的支持。有些应用会使用jq,boostrap,有的还会用到angular,甚至有些都要引用,在我们确定了技术选型以后,我们通过yeoman的生成器插件,生成器插件"generator-XXX库",所有的generator-生成器都采用npm包来安装库,安装完成后,通过“yo XX”库命令生成应用的脚手架。
下面介绍其他三个主要集合工具
yo工具:
让初始化文件目录变简单,还是那话作为新时代的有为青年,我们要摆脱早期前端的刀耕火种,让自动化的小机器人舞起来。通过ye webapp命令构建基础web应用目录。 基础应用包含了:HTML5 Boilerplate、jQuery、Modernizr 和 Twitter Bootstrap 等。在基础应用不能满足我们的基本需求时,我们在通过yeoman的"gennerator-xxx库,然后yo xxx加入骨架。
bower工具:
在Web应用中,我们可能会引入很多第三方的库,传统的做法是从这些网站上下载这些库,然后放到项目目录下的某个文件夹下去,之后在html中引用进去。这个做法无形中加大了有为青年们的工作量。尤其是在不同js库中,我们要保证依赖库之间的版本兼容问题。采用bower search XX库,搜索xx库,只有xx库在bower中注