Ten minutes to use ionic Framework to develop a cross-platform mobile application, ionicframework

Ten minutes to use ionic Framework to develop a cross-platform mobile application, ionicframework

Ionic is a front-end framework that helps developers use HTML5, CSS3, and JavaScript to make native applications. The idea of ionic is similar to the BootStrap of front-end development. The goal is to encapsulate the best practices for HTML5 mobile cross-platform development, just as Twitter Bootstrap did in front-end development. The Ionic framework is developing rapidly. We started to use it in March 2014. At that time, it was 1.0.0beta2. Now it has been updated to 1.0.0beta10. There will be a beta version every two weeks, and there will be substantial updates. The Ionic framework is very advanced. js is based on AngularJS framework, and Css3 is widely used. css is generated based on Sass. The build tool is based on the latest gulp. The version upgrade is based on bower, the native layer seamlessly encapsulates cordova.

The beautiful, open source front-end framework for developing hybrid mobile apps with HTML5.

Structure and concept of ionic framework

The Ionic framework can effectively use AngularJs features to provide HTML5 application development efficiency, quality, and modularization. Based on our experience, the use of ionic development is 50% less than the use of jquery-based mobile frameworks, and the development speed is doubled. Compared with native development, without considering that native application development cannot be cross-platform, it is also developed on iOS, and ionic is more than twice faster than oc development. In terms of user experience, there is little difference between iOS and high-end Android devices (mobile phones with more than 1500 Yuan, tablets) and native applications. Generally, users cannot tell that it is HTML5. Currently, the highly competitive apps in the market are not suitable for HTML5 development at the moment, even if HTML5 can fully meet business needs, such as where to go, Ctrip and other competing apps. However, in the enterprise application field, the use of ionic has obvious advantages. We have used the ionic framework to launch iPad and android Pad enterprise applications.

With ionic, we can use HTML5, javascript (angular), and css (sass) to develop android and ios applications.
Getting Started with Ionic install ionic install nodejs
Nodejs has become very popular in recent years. nodejs is installed to install Cordova and ionic through command line tools.


Install cordova and ionicnpm install-g cordova ionic
In Mac, you need to add sudo:


Sudo npm install-g cordova ionic
Create an application

The ionic official website provides developers with multiple development templates, such as the default Tab template (the page is organized based on similar tabs and uses ionTab instructions) and Sidemenu template.

Create a Tab-based application

ionic start myApp1

Console output

 ionic start myApp1Running start task...Creating Ionic app in folder /Users/zhangxitao/myApp1 based on tabs projectDOWNLOADING: https://github.com/driftyco/ionic-app-base/archive/master.zipDOWNLOADING: https://github.com/driftyco/ionic-starter-tabs/archive/master.zipInitializing cordova project.Fetching plugin "org.apache.cordova.device" via plugin registryFetching plugin "org.apache.cordova.console" via plugin registryFetching plugin "https://github.com/driftyco/ionic-plugins-keyboard" via git clone

You can see that the template application is to download the ionic framework code from git, then initialize the cordova project through the cordova command, and then add plug-ins such as Device, console log, and keyboard, the last plug-in ionic-plugins-keyboard was developed using ionic. It provides js layer notifications for Soft keyboard Events and is useful on android.
To add the ios native code, you actually call cordova platform to add ios. Of course, you have to install xcode on mac.

$ ionic platform  add iosRunning platform task...Adding platform iosCreating ios project...Installing "com.ionic.keyboard" for iosInstalling "org.apache.cordova.console" for iosInstalling "org.apache.cordova.device" for ios

Run the created application on the simulator.

$ ionic run iosRunning run task...Running app on platform iosRunning command: /Users/zhangxitao/myApp1/platforms/ios/cordova/run No device is connected, trying Simulator.Build settings from command line:    ARCHS = i386    CONFIGURATION_BUILD_DIR = /Users/zhangxitao/myApp1/platforms/ios/build/emulator    SDKROOT = iphonesimulator7.1    VALID_ARCHS = i386=== BUILD TARGET CordovaLib OF PROJECT CordovaLib WITH CONFIGURATION Debug ===

If the last step is "success", the application will be started on the iphone simulator. For example, the interface is flat and beautiful.

What do you do next? Read the ionic documentation and make your own applications on this basis!
C #/net compiled programs are also cross-platform like java jar programs?

It is compatible and does not need to be re-compiled.
The same. net framework is designed to enable cross-platform inter-language bytecode. It can be run without re-Compiling in the same framework. In reality, only win systems are complete. net architecture, mono provides a majority of libraries except WPF, compiled under win. net execution files can be run in mono, as long as the wpf code is not used. ,
The. net compact on Windows phone is a subset of. net and is compatible with full. net execution files ..
Therefore, it is possible to implement cross-platform execution files like jar in java. The pe file of win has a cross-platform design,
Reference: msdn.microsoft.com/en-us/library/4swehb60 (v = vs.90). aspx

C # Can I develop a mobile application like JAVA?

That's for sure. Mobile Device Development has nothing to do with language or platform. Just like a single-chip cool-man who used to use single-chip microcomputer to operate the GPRS serial port module to implement the same functions as mobile phone text messages, you can also directly connect to the wireless Nic module on an Embedded ARM bare metal to implement the call and Network Camera functions. Mobile applications are not very mysterious... the true foundation is system core-level programming. Android, which is popular in mobile device systems, is developed from the Linux kernel.

Games ?? You Need To Know About OpenGL, DirectX, Game Engine creation, and so on. If it has something to do with Java, Java3D (I have heard of it, it has never been used, it is said that the underlying layer is OpenGL) or OpenGL (DirectX is a Microsoft statement, OpenGL is relatively standard, but only involves graphics, it is not convenient to use DirectX, but it is a little easier to transplant to the hardware platform. Compile the graphics card driver and modify and compile Mesa ).