SAP云服务平台干货攻略 | HTML5应用需要用到什么IDE提高开发效率?

简介: http://mp.weixin.qq.com/s?__biz=MjM5OTI2MjgyMA==&mid=2651785507&idx=1&sn=e0f7e414097b22b2d4acb6bc3e9fa87e&chksm=bcc58...


http://mp.weixin.qq.com/s?__biz=MjM5OTI2MjgyMA==&mid=2651785507&idx=1&sn=e0f7e414097b22b2d4acb6bc3e9fa87e&chksm=bcc586288bb20f3ebaa0fb0d70dcb1fb803b92caff0e1c4dcc85aaf6e4545df645cd84887fbf&mpshare=1&scene=5&srcid=1114DbdSsJejliYkYMmFMbLq#rd

 

SAP天天事

之前在介绍HCP的文章(SAP HANA Cloud Platform账号获取、应用生成……干货攻略)里已经提到HCP是运行HTML5以及J2EE应用的内存云计算平台。J2EE应用可以用Eclipse去开发,那么HTML5应用需要用到什么IDE(集成开发环境)去提高我们的开发效率呢?

 

在此我们请上这次的主人公:Web IDE

 

De.ion: http://mmbiz.qpic.cn/mmbiz_png/MyOJCrxcqF0CaflH2pKVuGHbqajmsQXU4LN0yaSKh6AwzeARpo61DRySFNxia3qtX9ibicicnsdm2dFoPm0RibfvuSg/640?wx_fmt=png&wxfrom=5&wx_lazy=1

 

 

如何得到Web IDE

 

Web IDE作为HCP上的一个服务,可以从服务控制台激活:

首先登陆到HCP控制台→Services→选择SAP Web IDEEnable

 

成功激活之后可以看到以下画面:

De.ion: http://mmbiz.qpic.cn/mmbiz_png/MyOJCrxcqF0CaflH2pKVuGHbqajmsQXUPZNlowibXNFmbbr5J4lGFZ3pAVPiblkK0042cmPkZ1noACrEm0Jw6abA/640?wx_fmt=png&wxfrom=5&wx_lazy=1

 

  • 通过点击Document连接,可以连接到Web IDE的帮助文档。
  • 通过点击Open SAP Web IDE连接,可以打开Web IDE
  • 通过点击SAP Web IDE configuration连接,可以把您带到Web IDE的配置界面

 

 

如何运用Web IDEHTML5应用的快速开发?


那接下来我们一起开发一个Master-Detail类型的HTML5的应用。

 

登陆到Web IDE之后选择FileNewProject from Template→选择SAP Fiori Master-Detail Application模板→Next→为项目起一下名字→Next→选择Service URL→选择northwind,然后输入/V3/Northwind/Northwind.svc

 

De.ion: http://mmbiz.qpic.cn/mmbiz_png/MyOJCrxcqF0CaflH2pKVuGHbqajmsQXUu2rMIsoUMqThDLD98pgtNmw8sGL601ekPYQibRJ7Y8SokDA5xawQRzQ/640?wx_fmt=png&wxfrom=5&wx_lazy=1

 

您首先需要按照以下的设置,在HCP控制台→Destinations配置northwindDestination

 

De.ion: http://mmbiz.qpic.cn/mmbiz_png/MyOJCrxcqF0CaflH2pKVuGHbqajmsQXUPc2Soje3Qp6YC5QFicKiaJnia0YUlSJxn8PsuMhTDvlKXeZwSF3fToicRw/640?wx_fmt=png&wxfrom=5&wx_lazy=1

 

关于在例子里用到的oDatametadata信息可以从以下链接获取:

http://services.odata.org/V3/Northwind/Northwind.svc/$metadata

 

Next →参照以下设置配置oData数据绑定→Finish

 

De.ion: http://mmbiz.qpic.cn/mmbiz_png/MyOJCrxcqF0CaflH2pKVuGHbqajmsQXUiaVVcjnlf10l60YLRiacQuMvh8hWQCKqXrthkr4ThZYdiaBWQL368ez8Q/640?wx_fmt=png&wxfrom=5&wx_lazy=1

 

右击生成的项目选择RunApp in FLP Sandbox可以看到您做出来的应用的效果。

 

De.ion: http://mmbiz.qpic.cn/mmbiz_png/MyOJCrxcqF0CaflH2pKVuGHbqajmsQXU7PyVt8QEpz9d5aPCqVFwSW4UA4MVtS0tIQbGibqUszHTqkOzDbMAG9g/640?wx_fmt=png&wxfrom=5&wx_lazy=1

 

 

Web IDE还有哪些特性?

 

  • HCP以及ABAP系统的紧密集成:可以直接从HCP或者ABAP系统导入HTML5的项目,也可以把项目直接部署到HCP或者ABAP系统。
  • 提供测试用的运行环境:可以用Run功能,模拟运行在FLP,以及HTML5的运行环境中。
  • 高效的编辑器:开发XML类型的View的时候可以用Layout Editor用拖拽的形式快速开发。

 

 

 

 

目录
相关文章
|
5月前
|
Linux C++ Windows
【Azure 应用服务】Azure App Service(Windows)环境中如何让.NET应用调用SAP NetWeaver RFC函数
【Azure 应用服务】Azure App Service(Windows)环境中如何让.NET应用调用SAP NetWeaver RFC函数
【Azure 应用服务】Azure App Service(Windows)环境中如何让.NET应用调用SAP NetWeaver RFC函数
|
6月前
|
移动开发 前端开发 JavaScript
基于 HTML5 和 Canvas 开发的在线图片编辑器
基于 HTML5 和 Canvas 开发的在线图片编辑器
124 0
|
7月前
|
存储 移动开发 编解码
基于HTML5开发的Markdown在线编辑器
Markdown是一种轻量级标记语言,以其简洁易读的格式而备受程序员和作者们的青睐。随着互联网的发展,越来越多的在线Markdown编辑器应运而生,为用户提供了更加便捷、高效的写作和编辑环境。本文将探讨基于HTML5开发的Markdown在线编辑器的设计原理、功能特点以及技术优势。
148 4
|
8月前
|
关系型数据库 MySQL
web简易开发(二){html5+php实现文件上传及通过关键字搜索已上传图片)}
web简易开发(二){html5+php实现文件上传及通过关键字搜索已上传图片)}
|
4月前
|
C++ Windows
HTML+JavaScript构建C++类代码一键转换MASM32代码平台
HTML+JavaScript构建C++类代码一键转换MASM32代码平台
|
5月前
数字化核心构建问题之SAP为应用软件扎根客户打基础如何解决
数字化核心构建问题之SAP为应用软件扎根客户打基础如何解决
43 0
|
8月前
|
存储 移动开发 编解码
基于HTML5开发的Markdown在线编辑器
Markdown是一种轻量级标记语言,以其简洁易读的格式而备受程序员和作者们的青睐。随着互联网的发展,越来越多的在线Markdown编辑器应运而生,为用户提供了更加便捷、高效的写作和编辑环境。本文将探讨基于HTML5开发的Markdown在线编辑器的设计原理、功能特点以及技术优势。
90 1
基于HTML5开发的Markdown在线编辑器
|
7月前
|
缓存 移动开发 前端开发
在PWA的开发中,HTML与CSS作为前端技术的基础,发挥着至关重要的作用
【6月更文挑战第14天】PWA(渐进式网页应用)借助HTML和CSS,提供接近原生应用的体验。HTML构建页面结构和内容,响应式设计适应各种设备,语义化标签提升可访问性,Manifest文件配置应用元数据,离线页面保证无网时体验。CSS则用于定制主题样式,创建动画效果,实现响应式布局,并管理字体和图标。两者协同工作,确保PWA在不同环境下的优秀性能和用户体验。随着前端技术进步,HTML与CSS在PWA中的应用将更加深入。
58 2
|
8月前
|
存储 JavaScript 前端开发
笔.COOL,一个功能完备、使用便捷的在线HTML/CSS/JS以及Vue编辑器和作品分享平台
笔.COOL是一个新兴的在线 HTML/CSS/JS 及 Vue 编辑器,提供实时预览和云端存储功能。用户可以随时随地编写和保存代码,同时分享作品给他人预览和学习。它也是一个实用的 BUG 复现工具,支持嵌入编辑器到博客,促进代码交流。社区活跃,适合开发者展示作品、获取灵感和学习。
104 1
|
7月前
|
机器学习/深度学习 Web App开发 前端开发
【Web开发】深度学习HTML(超详细,一篇就够了)
【Web开发】深度学习HTML(超详细,一篇就够了)
39 0

热门文章

最新文章