本发明公开了一种前端应用可视化开发工具和使用方法，属于互联网前端开发技术领域。所述前端应用可视化开发工具包括ECoder软件和物料/模板库，ECoder软件具有用户登录模块、初始化模块、项目管理编辑模块、页面编辑模块、区块编辑模块、本地服务模块、自动更新模块。使用方法为：开发者登陆、浏览并选择模版初始化项目、根据项目需求对不同页面进行自定义编辑、选择下载云端区块或者本地自定义区块进行ui和逻辑步骤编辑后进行内容填充，经过以上实时可视的操作后，该发明会生成对应项目代码并允许再次编辑，随后可通过工具中git面板push到代码仓库或者关联应用地址进行发布应用。