前端代码库

2023-04-10 12:13:37 来源:网络

前端代码库

可用于前端开发的框架或类库有哪些

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 安装,修改,更新以及优化都很简单方便。

—— 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 库的附件,它们的语法基本相同或者相似。

前端低代码有哪些?

「前端眼中的低代码」

广义上低代码产品还分为零代码和低代码两种,这两种产品中应用开发者都可以对封装好的模块进行拖拉来完成搭建,主要区别在于对代码的依赖程度。

低代码平台:通过自动代码生成和高度可视化环境,编写少量代码,即可快速搭建各种应用。

零代码平台:可视化页面进行拖拉拽方式,无需编写代码,即可快速搭建各种应用。

什么是低代码,在我看来就是拖拉拽,点吧,一通操作,就能做出一套能跑的系统,前端,后端,数据库,安排的明明白白。

现阶段市面上的低代码平台,大多适用于全行业,比如以JNPF为代表的企业级应用,以及目前我们接触到的表单审批、投票的模板,这些都是关于低代码的实现方式。

表单设计器,有控件区、组件属性设置区,拖拽实现布局,相信大部分的低代码平台也是如此。

「有低代码后就不要开发了?」

这就像问先有鸡还是先有蛋一样,低代码平台的确会取代一些简单,场景固定化的工作,但不能做到完全取代的地步。

开发人员通过低代码可以使用可视化拖拽的方式来创建应用,无需从头到尾手动编码,这也提高了开发效率。

开发者和低代码相辅相成,只有这样,才能真正实现降本增效,以前需要3个月的任务,现在可能一个星期就能搞定,腾出来的时间思考更多创意和解决方案也很香。

「小结」

很多人说低代码是前端的必争之地?事实上,低代码在解决重复造轮子方面优势明显,但看法不一。我们一起期待更多优质工具的涌现,帮助开发团队实现降本提效的难题。