可视化网站教程：最流行的搭建工具及必学的7个功能

摘 要

记得刚进大学的时候，一位教授说大学里有十件必学的事情，其中有一件是：学会做网站。无论你是学什么的，像数据可视化，演示简历、作品或产品，都需要前端的知识。虽然目前有各种前端语言，像Vue, React, Angular等等，样式也是有sass, scss, less等等，但是浏览器的工作原理以及基础决定了我们还是要学好HTML+CSS+Javascript，才能更好地使用前端工具。

一、建站工具

前端低代码的发展为我们提供了很多好用的建站工具，Ofter为大家推荐几个免费的最佳实践。

序	工具	编程要求	适用类型	参考示例	备注
1	wordpress	无	网站/博客	https://demo.styledthemes.com/styledstore/	免费，安装插件，拖拽即可，可付费插件
2	docsify	低	文档教程	https://docsify.js.org/#/zh-cn/	免费，好多Github上文档教程都用这个
3	dumi	中	网站/博客/教程	https://d.umijs.org/zh-CN	免费，umi制作成的Demo
4	umi - ant design landing	中	网站/博客（首页）	https://motion.ant.design/index-cn	免费，主要面向网站首页
5	gatsby	相对高	网站/博客/教程	https://brittanychiang.com/	免费，定制程度相对高

注：wordpress虽然不需要编程基础，但是使用过程有很多限制，不能100%按照自己的想法定制，插件太多也会影响性能。

二、前端开发工具

前端的开发软件还挺多，大家可以按照个人喜好，这里就列几个常用的：

• Vscode