一直以来都想找一款能够直接生成前端页面代码的工具，最主要的是省心，省力。就像Visual Studio的WPF以及WinForm的开发那样，直接拖拖控件就可以。包括像Java 的Window Builder 以及 Visual Basic 6那样，界面开发起来又酸爽又快。

iVX正好这款软件正好非常符合我的需求，（我非常推荐一些没有过前端经验的同学使用iVX，你会发现这东西不仅是个效率神器，还是个学习前端的神器，你用多了你知道了。。）而且还不用下载IDE什么的，直接在浏览器就能够开发。它这个官网的地址是 IVX CN。进入之后直接登录，也不用注册什么的，非常方便。立马就能上手开发。我们点击开始开发。

然后会进入到这样的一个页面，在这个页面中，我们可以选择新建应用的类型。这里我们使用相对定位。这样页面的坐标不会被写死，可以根据浏览器页面的大小变化而变化。点击创建，我们开始。

下面就进入了开发的页面，就相当于IDE的开发页面，在页面的左侧，你看到什么Btn、T等样式的图标，那其实就是它的控件，iVX所编写的控件，我们可以直接使用。就像在VB6或者visual studio中开发界面拖控件一样，非常简单。当然我们还可以调整这页面的大小，现在是一个手机页面，我们只需要点击左上角的手机电脑的图标就可以了。

这里我调整为了1024x768，这样界面比较大一些，我们也方便开发。

但是实际上你要开发的话，我非常建议你你看看官方的Demo 和开发文档，以及视频。因为你不通过学习肯定要走不少弯路的。我们点击左上角的学习-课程，就能进入iVX的教程界面。

进入界面后就是这样的一个状态，入门必看，这里面讲解的非常详细。从基础知识到UI 事件 数据 到 界面的布局开发，都会为你答疑解惑。我刚开始的时候什么都不懂，看了他这个教程之后，才明白，哦，原来是这样的。所以其实这个东西不仅能让你开发前端页面的效率提升，还能让你学到不少的知识。

我们把他这个教程看完之后，基本上就对iVX有了一个整体的认识了。后续我们就跟着它的教程开始开发软件了，其实iVX前端后端都支持的，只不过我个人主要用它前端的功能居多一些。他这个前端开发的源码我们还可以下载保存到本地。比如说我这里找一个Demo吧

我们就选择第三个Demo 2048游戏那个，当我们点击下载之后，iVX会将Demo直接导入到IDE中，我们可以直接进行二次开发。这个看起来不错，挺帅气的吧，我们也不改，直接保存。

在左上角点击文件 - 会有一个导出前端页面代码。我们点击。

打开解压后的文档，找到vue文件，就可以看到iVX生成的前端VUE代码，这样我们后续修改或者添加组件都非常的方便。以上就是关于iVX开发前端页面以及生成前端代码的介绍，相信会对你有帮助。最后记得点赞收藏关注。