我的第一个ionic应用的

先来看看这个用ionic开发的应用到底长什么样子

 看上去是不是和平常的Android应用一样呢~但其实它是使用web技术开发的!是不是很神奇呢?!下面我们就来看看这个应用究竟是如何产生的。


介绍一些基本概念

  • Node.js
        它是一个基于JavaScript运行时建立的平台,用于方便地搭建响应速度快、易于扩展的网络应用。它使用事件驱动,非阻塞I/O模型而得以轻量和高效,非常适合在分布式设备上运行的数据密集型实时应用。
        Node是一个JS运行环境,它对Google V8引擎进行了封装。V8引擎执行JS的速度非常快,性能非常好。Node对一些特殊用例进行了优化,提供了替代的API,使得V8在非浏览器环境下运行得更好。
  • npm
        Node Package Manager,是一个Node.js包管理和分发工具。Node.js自身提供了基本的模块,但是实际开发过程中仅仅依靠这些模块还不够,还需要库和框架。但是成百上千的库或者框架管理起来很麻烦,有了npm可以很快地找到特定服务要使用的包,进行下载、安装以及管理已经安装的包。
  • SDK
        Software Development Kit,在Android开发中,它为开发者提供了库文件以及其他开发中所用到的工具。里面包含build-tools,platforms,platform-tools,tools等。这个需要随着Android版本的更新而不断更新。
  • phoneGap
        它是一个用基于html,css,js的、创建移动跨平台移动应用程序的快速开发平台。业界很多主流的移动开发框架均源于phoneGap,较著名的有Worklight、appMobi、WeX5等。
  • Cordova
        它提供了一组设备相关的API,通过这组API,移动应用能够以JS访问原生的设备功能。Cordova是贡献给Apache后的开源项目,是从phoneGap中抽出的核心代码,是驱动phoneGap的核心引擎。
  • AngularJS
        它是一款优秀的前端JS框架,试图成为web应用中的一种端对端解决方案,它为开发者呈现一个更高层次的抽象来简化应用的开发。
  • IONIC
    是目前最有潜力的一款HTML5手机应用开发框架。通过SASS构建应用程序,提供了很多UI组件来帮助开发者开发强大的应用。它使用JS MVVM框架和AngularJS来增强应用。

开始安装(所需软件均打包好放入百度网盘中,后附链接)

  1. 安装JAVA JDK(相信之前用过JAVA的同学已经安装过了),可以去oracle官网上下载,并到网上寻找安装教程,配置环境变量。安装完成后在命令行窗口下分别输入java和javac查看是否安装成功。
  2. 下载Android SDK,注意要包含最新版本的android-22 platform,否则之后无法正确build。一般SDK是在google的官网上下载,但一般打不开,所以得到网上去找。有时候网上的SDK是包含在ADT中的,里面除了SDK还有Eclipse,要注意里面是否包含最新的SDK。下载完成后需要配置环境变量,在Path后增加如下路径:E:\ADT\sdk\tools;E:\ADT\sdk\platform-tools;E:\ADT\eclipse\plugins\org.apache.ant_1.8.4.v201303080030\bin;前面的E:\ADT视个人的SDK安装目录而定。之后在命令行窗口下输入ant查看是否安装成功。
  3. 安装Node.js,可以去官网上找最新的版本下载并安装。
  4. 安装Cordova和phoneGap,这个不用自己下载,打开命令行窗口,输入npm install -g cordova便会进行下载,下载过程中会有提示,可根据提示判断是否下载成功。之后输入npm install -g phonegap进行下载。两者都下载完成后输入cordova -version和phonegap -version查看是否安装成功。
  5. 安装IONIC,在命令行窗口中输入nmp install -g ionic便会进行下载,下载完成后输入ionic -version查看是否安装成功。

创建第一个ionic应用

1.在命令行窗口中输入ionic start 项目名称,便会在当前目录下创建一个新项目。    
2.cd 项目名称,切换到项目目录下。
3.ionic platform add android,将该项目添加到android平台。
4.ionic build android,建立android应用。这时依次打开项目文件夹内的platforms->android->build->outputs,其中名为android-debug.apk的文件便是可以在手机上安装的应用。
5.将该apk文件导入到手机中并进行安装,这样便可以出现文章开头展示的效果。


 百度云下载链接,包含android-22、jdk、node.js,sdk完整版因为太大可自行到网上下载~,将android-22放入下载好的sdk中的platforms即可。http://pan.baidu.com/s/1kTu5r2R

参考资料:
     

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值