奇妙的前端,奇妙的js

众所周知,自从js有nodejs后,前端人员可以华丽的转身,去开发高并发非阻塞的服务端程序,

随着html5的出现,伴随一些amazing的特性,h5开发app的技术越发的成熟,

自从2008年国外推出phonegap后,前端人员又踏上开发app的路程,

今年来国内也对应推出了一些可以让前端人员开发app的ide,

不过大部分是收费的,强定制的,这里就不一一列举了。

这里推荐DCloud推出的HBuilder,一句话谁用谁知道。

一次开发两种app

通过HBuilder的云端打包技术(也可以放到本地),

你只需要写html+js+css即可开发出app,

并且是一次开发,即可生成android和ios两种对应app。

原理介绍-ui层

app中的ui对应html中的ui,你可以自行选择ui框架,

无论是bootstrap还是amazeui,还是jquery mobi(phonegap推荐ui),

还是HBuilder推荐的mui都可以,

这里建议使用HBuilder推荐的mui,

因为封装了一部分nativejs的东西,

而且HBuilder也封装了mui的快捷键,使用起来很方便。

总结一下,就是用html层次的ui框架来实现(模拟)app中的ui。

点这里下载官方mui-app:Hello MUI

原理介绍-nativejs

HBuilder开发app,不可避免的是调用android和ios中的原生方法,

大概原理如下:

qiao.ng.toast = function(msg){// for iosif(window.WebViewJavascriptBridge){WebViewJavascriptBridge.sendMessage('showSystemToast$' + msg);}else{document.addEventListener('WebViewJavascriptBridgeReady',function onBridgeReady(){WebViewJavascriptBridge.sendMessage('showSystemToast$' + msg);}, false);}// for androidif(typeof android != 'undefined'){android.showSystemToast(msg);}
};

也就是封装了js调用android和ios的方法,

据HBuilder官网说法是封装了40w+的原生方法,

总结一下,就是js去调用android或iso中的原生方法。

点这里去下载官方nativejs-app:Hello HTML5+

DCloud,HBuilder,mui,nativejs,html5+的关系

DCloud

DCloud是一家公司

hbuilder

DCloud推出的可以开发app的前端IDE,是基于eclipse二次开发而来,

所以熟悉eclipse或者myeclipse的开发人员可以很快的上手。

类似IDE,有phonegap等等。

mui

DCloud推出的模拟原生app的ui框架,

类似框架有:bootstrap,amazeui,jquery mobi, framework7等

nativejs

广义上的nativejs是指可以调用android,ios原生方法的js,

这里专指DCloud退出的nativejs,官方称封装40w方法。

html5+

据说是w3c旗下的组织,目标是退出适合开发app的加强版html5,

相关参与的机构有很多,但是感觉主力还是DCloud

相关链接:

1.html5+:HTML5产业联盟

2.hbuilder:DCloud - HBuilder、HBuilderX、uni-app、uniapp、5+、5plus、mui、wap2app、流应用、HTML5、小程序开发、跨平台App、多端框架

3.mui:http://dcloudio.github.io/mui/

4.nativejs:HTML5+ API Reference

5.bootstrap(国内):Bootstrap v3 中文文档 · Bootstrap 是最受欢迎的 HTML、CSS 和 JavaScript 框架,用于开发响应式布局、移动设备优先的 WEB 项目。 | Bootstrap 中文网

6.amazeui:http://amazeui.org/

7.jquery mobi:jQuery Mobile

8.framework7(类ios):GitHub - framework7io/framework7: Full featured HTML framework for building iOS & Android apps

9.material-ui(android):https://github.com/callemall/material-ui

HBuilder开发App教程01-推开前端开发App的大门相关推荐

  1. VAPS XT开发入门教程01:软件安装包

    本文首发于:VAPS XT开发入门教程01:软件安装包 上一篇:VAPS XT开发入门教程00:基本介绍 VAPS XT软件包括三个部分: 主程序,按照版本不同大小也不同,大概在800M~2GB左右 ...

  2. python测试开发自学教程-自动化平台测试开发:Python测试开发实战_PDF电子书

    因资源下载地址容易失效,请加微信号359049049直接领取,直接发最新下载地址. 前言 ======================================================= ...

  3. python前端开发招聘_【天津前端开发招聘_最新天津前端开发招聘信息】-前程无忧...

    天津卓众信息技术有限公司天津-西青区0.6-1万/月11-23 学历要求:本科|工作经验:3-4年|公司性质:民营公司|公司规模:少于50人 1.根据产品设计实现产品的页面交互和数据逻辑展示,负责前端 ...

  4. 前端开发用什么工具?前端开发需要哪些软件

    孔子说,"工欲善其事,必先利其器",当前运用前端开发,也是很恰当的,那么,前端开发用什么软件?前端开发用什么工具?下面php中文网就为大家总结一下前端开发开发工具. 一:HBuil ...

  5. php网站开发案例教程ppt,php网站开发案例教程》课件.ppt

    php网站开发案例教程>课件.ppt 还剩 178页未读, 继续阅读 下载文档到电脑,马上远离加班熬夜! 亲,很抱歉,此页已超出免费预览范围啦! 如果喜欢就下载吧,价低环保! 内容要点: PHP ...

  6. 《疯狂前端开发讲义jQuery+Angular+Bootstrap前端开发实践》学习笔记

    <疯狂前端开发讲义jQuery+Angular+Bootstrap前端开发实践>学习笔记 二〇一九年二月十三日星期三2时28分54秒 前提:本书适合有初步HTML.CSS.JavaScri ...

  7. 4399手游事业部,诚聘AS开发主程、C++前端开发工程师、erlang后端开发工程师

    4399手游事业部,诚聘AS开发主程.C++前端开发工程师.erlang后端开发工程师 面对手机游戏的无限前景,你还Hold得住吗?你是否正执着寻找着一个优秀的手机游戏平台一展身手?赶快加入我们439 ...

  8. HBuilder:推开前端开发App的大门

    奇妙的前端,奇妙的js 众所周知,自从js有nodejs后,前端人员可以华丽的转身,去开发高并发非阻塞的服务端程序, 随着html5的出现,伴随一些amazing的特性,h5开发app的技术越发的成熟 ...

  9. 菜鸟写jquery入门教程(for web前端开发群4)(01)

    呃,大概是这样,碰到一笨学生, 并鉴于群里有这么多人在学jquery,好吧.既然大家都懒得去看帮助,我来开篇写点什么吧. JQuery 起源 ?  这个没必要介绍了,各位可以去百度一下.谈谈个人对JQ ...

最新文章

  1. OC基础回想(十二)协议
  2. java 中的gc方法
  3. k8s组件批量启动、查看状态
  4. eclipse run as 后边没有java application的选项了?
  5. 怎样删除oracle中的用户,Oracle 中删除已经连接的用户
  6. windows下 网络命令(待续)
  7. 我的手机 不支持箭头函数
  8. 欢乐纪中某A组赛【2019.7.10】
  9. oracle vm发现无效设置_Oracle数据库编译失效对象相关命令总结大全,值得收藏
  10. 浅谈python的import
  11. 关于SQL92标准和Sybase,SQLServer2000,Oracle的数据类型对比关系
  12. 学生阅读作业三——对习而学教学方式的思考
  13. quartz集成到springboot_springboot系列之02-需要了解的宏观知识点
  14. NekoHTML学习笔记
  15. 销售管理软件系统的两大优势是什么?
  16. Windows系统微软拾色器小工具
  17. 网站打不开怎么检查服务器,检查网站打不开的三种原因
  18. 鸿蒙安卓字体,鸿蒙中如何自定义字体文件
  19. Vue - 判断访问网页客户端设备是手机移动端还是 PC 电脑端(判断设备类型是否是移动端手机)
  20. 现代的linux和windows7,Windows 7 Vs. Linux谁更强

热门文章

  1. Ubuntu安装ffmpeg
  2. VS工程中sdf和ipch文件解决
  3. VBA --Sheets.Add 方法
  4. 杭州江南专修学校计算机应用,2021年杭州江南专修学院高级护理招生计划及专业介绍-升学乐中职网...
  5. PTA 结构体作业(基础)
  6. html5-表格练习题
  7. 程东武:有一天,我去世了
  8. 编译原理习题(含答案)——2程序设计语言及其文法——哈工大陈鄞配套版本
  9. [渝粤教育] 盐城工学院 电路 参考 资料
  10. 【Ubuntu】虚拟机忘记登录密码如何解决