基于 Bootstrap 4 的快速建站 HTML5 套件 Uix Kit

• 授权协议: MIT
• 开发语言: JavaScript HTML/CSS
• 操作系统: 跨平台
• 软件首页: https://gitee.com/xizon/Uix-Kit
• 软件文档: https://github.com/xizon/uix-kit/wiki

软件介绍

Uix Kit! 它是一个基于Bootstrap的快速建站HTML5套件，遵循W3C标准，包括手风琴、Tab切换、大型导航、单页、视差、分页、项目符号列表、文章列表、网格系统、AJAX交互、常用的多风格轮播、视频、计数器、作品画廊展示、模态弹窗、简易灯箱、无限滚动加载、鼠标交互、滚动侦听动画、时间轴、按钮、多风格Footer、文字效果、徽章、表单等等常用的网站模块，并支持官方无限更新和扩展、优化，满足各类常用的、交互和动效级的Web前端开发需求。支持Gulp和Webpack开发模式。套件提供了规范的HTML结构和模块化的HTML,CSS,JS代码(默认)，能够让开发者快速进入开发模式，自定义、修改或删除任意模块。

甚至，你可以把里面的所有模块删除，只是使用套件的脚手架，通过套件提供的自动化流程，优化你的工作效率和方式方法。

当我们做项目的时候，会使用一些优秀的模板，但是很难去个性化去定制，特别是很难将其模块化管理。

当我们做项目的时候，会使用到各种插件，但是由于插件众多，容易造成规范和结构的混乱。

当我们做项目的时候，重新编写一堆堆HTML,CSS,JAVASCRIPT代码，时间长了，效率低，质量低，甚至会厌倦它们，永无止境的工作和加班。

当我们做项目的时候，总是不能开心的让系统去执行自动化任务，不够科学，不够前卫，不够智能，我们也会渐渐对网页设计或前端开发产生一些低潮。

视频快速使用方法演示：https://v.youku.com/v_show/id_XMzQzMDM5MTYwNA==.html?spm=a1z3jc.11711052.0.0&isextonly=1

演示(推荐F墙浏览)：https://uiux.cc/uix-kit/

描述：

• +  每个模块(包含SCSS和JS)自动生成目录到uix-kit.css和uix-kit.js文件中
• +  简单的自定义CSS和JS核心文件，方便直接用其制作网站
• +  很好的跨设备响应式支持
• +  独立的组件文件夹，可任意删除和增加，开发环境中自动识别组件库并进行打包
• +  支持中文和英文
• +  核心样式表与Bootstrap 4.x兼容
• +  提供常见的网页组件和布局
• +  标准代码规范
• +  W3C支持
• +  支持Gulp＆Webpack同时部署开发环境

推荐使用方法：

具体的使用方法请参考github文档或者演示视频

1.下载 https://gitee.com/xizon/Uix-Kit， 

也可从github或者npm上直接下载 https://github.com/xizon/uix-kit

2.配置你电脑的Node.js环境

3.下载完资源后，进入到uix-kit目录下，运行gulp default, 进入开发模式

4.直接通过修改_components/ 文件夹内的模块组件的HTML,JS,SCSS文件，来实现前端开发，所有文件将会自动打包生成到 examples/ 文件夹中。

5.当你需要配置脚手架和网站基础信息和结构的时候，请直接编辑gulpfile.js文件。

不建议直接修改examples/ 文件夹里的文件，因为代码量非常大，很难去维护和定制各种动画、交互、结构。

套件结构：

uix-kit/
├── README.md
├── CHANGELOG.md
├── CONTRIBUTING.md
├── DOCUMENTATION.md
├── gulpfile.js
├── main.js
├── LICENSE
├── readme.txt
├── package-lock.json
├── package.json
├── _config.yml
├── _grid/
├── _screenshots/
├── _components/
│   ├── 00.global/
│   ├── 01.*/
│   └── 02.*/
├── examples/
│   ├── assets/
│   │       ├── css/
│   │       ├── fonts/
│   │       ├── images/
│   │       ├── json/
│   │       └── js/
│   └── assets-demo/
│           ├── images/
│           └── videos/
	

小提示：

这个工具套件并不是强制谁去使用它的默认样式和交互效果，而是提供了一个便于利用的自动化脚手架，通过Gulp和Webpack来规范你的开发流程，提高代码的质量和编写效率，提高后期维护的便利性。这是一种工作方法，而不是现成的模板(当然也可以直接使用examples/目录里的项目文件，作为快速建站的模板)，Uix Kit的价值，在于快速、简单的模块分离，自动化打包和生成目录，并提供了丰富的默认常用前端代码应用。

本文地址：https://www.codercto.com/soft/d/793.html