Creating native apps with WordPress

50 %
50 %
Information about Creating native apps with WordPress
Technology

Published on January 15, 2012

Author: markoheijnen

Source: slideshare.net

Description

Talk at WordCamp Norway 2012 about how to create a native app with WordPress as a datasource.
Going into the XML-RPC, JSON plugins and how to manage the data in the backend.

The example had to be removed because of the company I worked for. Don't know why but as a result a smaller presentation.

Creating native apps with WordPress Marko Heijnen January 14, 2012 at WordCamp Norway

Marko HeijnenFreelance developerMobile / WordPresshttp://markoheijnen.cominfo@markoheijnen.com@markoheijnen

History2006: Started with WordPress2009: Started with iOS development2010: First patch to WordPress ( 3.0 )2011: Combined iOS development with WordPress2012: First WordCamp presentation

Lets talk mobile

Mobile is the growing

There is a change you get involved with it

Native app vsWeb app/site

Native vs mobileBuild a native app when: People are going to use it quite often ( daily basis ) Features that aren’t possible for web ( yet ) A lot of users request for it ( 10.000 > ) Customers really want an app

We needa native app

What does it mean for youYou need to communicate with another developerNeed to build an API that the developer can useSo you need to understand what a mobile developer wantsNeed to build additional fields in WordPress for informationthat the mobile app can use

The API

API of the appWordPress for iOS uses XML-RPCWordPress support it by defaultSupports: Blogger API, metaWeblog API, and the MovableType API

Where can you find it/xmlrpc.php handles the request/wp-includes/class-wp-xmlrpc.server.php Registers all the default methods

Methods for testing/** /** * Test XMLRPC API by saying, "Hello!" to client. * Test XMLRPC API by adding two numbers for client. * * * @since 1.5.0 * @since 1.5.0 * * * @param array $args Method Parameters. * @param array $args Method Parameters. * @return string * @return int */ */function sayHello($args) { function addTwoNumbers($args) { return Hello!; $number1 = $args[0];} $number2 = $args[1]; return $number1 + $number2; }

How to get recent postfunction mw_getRecentPosts($args) { $this->escape($args); $blog_ID = (int) $args[0]; $username = $args[1]; $password = $args[2]; if ( isset( $args[3] ) ) $query = array( numberposts => absint( $args[3] ) ); else $query = array(); if ( !$user = $this->login($username, $password) ) return $this->error; do_action(xmlrpc_call, metaWeblog.getRecentPosts);

How you can use it in your own way

Create your own methodsadd_filter( xmlrpc_methods, add_own_methods );function add_own_methods( $methods ) { $methods[own.my_method] = own_my_method; return $methods}function own_my_method( $args ) { return $some_data}

How does it look like

Request<?xml version="1.0"?><methodCall><methodName>metaWeblog.getRecentPosts</methodName><params><param><value><string></string></value></param><param><value><string>username</string></value></param><param><value><string>password</string></value></param></params></methodCall>

Response<?xml version="1.0"?><methodResponse> <params> <param> <value> <array><data> <value><struct> <member><name>dateCreated</name><value><dateTime.iso8601>20110904T18:15:26</dateTime.iso8601></value></member> <member><name>userid</name><value><string>1</string></value></member> <member><name>postid</name><value><string>1</string></value></member> <member><name>description</name><value><string>Welcome to &lt;a href=&quot;http://network.nginx.markoheijnen.com/&quot;&gt;WordPress Network Sites&lt;/a&gt;. This is your first post. Edit or delete it, then start blogging!</string></value></member> <member><name>title</name><value><string>Hello world!</string></value></member> <member><name>link</name><value><string>http://test.network.nginx.markoheijnen.com/2011/09/04/hello-world/</string></value></member> <member><name>permaLink</name><value><string>http://test.network.nginx.markoheijnen.com/2011/09/04/hello-world/</string></value></member> <member><name>categories</name><value><array><data> <value><string>Uncategorized</string></value></data></array></value></member> <member><name>mt_excerpt</name><value><string></string></value></member> <member><name>mt_text_more</name><value><string></string></value></member> <member><name>mt_allow_comments</name><value><int>1</int></value></member> <member><name>mt_allow_pings</name><value><int>1</int></value></member> <member><name>mt_keywords</name><value><string></string></value></member> <member><name>wp_slug</name><value><string>hello-world</string></value></member> <member><name>wp_password</name><value><string></string></value></member> <member><name>wp_author_id</name><value><string>1</string></value></member> <member><name>wp_author_display_name</name><value><string>marko</string></value></member> <member><name>date_created_gmt</name><value><dateTime.iso8601>20110904T18:15:26</dateTime.iso8601></value></member> <member><name>post_status</name><value><string>publish</string></value></member> <member><name>custom_fields</name><value><array><data></data></array></value></member> <member><name>wp_post_format</name><value><string>standard</string></value></member></struct></value></data></array> </value> </param> </params></methodResponse>

XML-RPCCritics of XML-RPC argue that RPC calls can be made withplain XMLXML-RPC uses about 4 times the number of bytes comparedto plain XMLNeed a lot of code on the app sideIn the end the size of requests/responses do mather

Is this the best way orare there alternatives?

AlternativesJust XML instead of XML-RPCUse JSON

What is JSONJavaScript Object NotationUse JSON as alternative to XMLIt is derived from the JavaScript scripting languageLightweight text-based open standard

Why JSONLighter and faster than XMLJSON objects are typed Array, object, string, number, boolean and nullGreat libraries for mobile platforms iOS 5 does have native support for JSONEasy to parse on mobile platforms

JSON Example{ "firstName" : "Marko", "lastName" : "Heijnen", "age" : 25, "address" : null, "newsletter" : false, "phoneNumber" : [ { "type" : "home", "number": "212 555-1234" }, { "type" : "fax", "number": "646 555-4567" } ] }

WordPress doesn’t have native support (yet)

Plugins you can useJSON RPC - http://wordpress.org/extend/plugins/wp-json-rpc-api/JSON API - http://wordpress.org/extend/plugins/json-api/WP RESTful - http://wordpress.org/extend/plugins/wp-restful/Be aware that these plugins aren’t up to date

What do I use

JSON APIGreat to use because of the use of hooksGood information on the plugin pageSimple backend interfaceI use a modified version of it Added consumer key/secret

Interface

How to implementfunction add_hello_controller( $controllers ) { $controllers[] = hello; return $controllers;}add_filter( json_api_controllers, add_hello_controller );function set_hello_controller_path() { return "/path/to/theme/hello.php";}add_filter( json_api_hello_controller_path, set_hello_controller_path );

How to implement<?phpclass JSON_API_Hello_Controller { public function hello_world() { return array( "message" => "Hello, world" ); }}?>

Important to knowOnly return data that is neededReturn as less HTML as possibleDon’t change the feed without notifying the app developerA call shouldn’t take to long, speed is everythingCache the data if possible Transients: http://codex.wordpress.org/Transients_API

Recap

How to managemobile content

Post typesAdd separate meta box for mobile content Even the ability to overrule the titleAdditional user capability, so not everyone can manage itMaybe even create a special post type for mobile content

Special admin pageOnly for mobile configurationStore settingsStore default pages for mobile like privacy disclaimer

Push notificationsCreate ability to send push notifications in a smart way Add to posttype Make a separate box on dashboard or admin pageYou can handle the sending yourselfOr use for example the services of Urban Airship

Last wordWordPress is a CMSCan be used in a lot of waysSometimes look further then the plugin section

Questions@markoheijnen / info@markoheijnen.com

Add a comment

Related presentations

Related pages

Mobile Apps by Wiziapp (Native iPhone & Android mobile ...

Mobile Apps by Wiziapp (Native iPhone & Android mobile Apps) ... Fully integrated with your WordPress system. Native iPhone & Android Apps’ Features ...
Read more

How to Create Native iOS & Android Apps for Your WordPress ...

... creating an app for ... didn’t seem to work as well as native apps. ... create native apps for iOS and Android from your WordPress site so I ...
Read more

Mobile Apps by Wiziapp (Native iPhone & Android mobile ...

Join us for Global WordPress ... Create a stunning native mobile iPhone & Android apps ... Click the WiziApp button on the left main menu to start creating ...
Read more

Worona - Native Mobile App for free (iOS ... - WordPress

Build a native mobile app of your WordPress blog. ... We believe that Worona will be used as a standard to easily create native apps straight from WordPress.
Read more

Native Mobile Apps for WordPress - Mobapper

Get native mobile apps (iOS, ... Create native mobile apps for your WordPress websites in minutes. Mobapper creates ... Creating your mobile app is ...
Read more

WordPress Mobile Native Apps for iOS and Android ...

We specialize in creating custom native mobile applications for iOS, Android, and Microsoft phones that integrate with WordPress powered websites.
Read more

Creating a Mobile App with WP-API and React Native

... Creating a Mobile App with WP-API and React Native ... so we’ll be creating a simple ... React Native, WordPress, WordPress ...
Read more

WordPress.com: Create a free website or blog

Create a free website or easily build a blog on WordPress.com. Hundreds of free, customizable, ... Desktop Apps; Mobile Apps; Themes; Support; Blog; VIP ...
Read more

Build Mobile Apps with WordPress | AppPresser

Easily Make a Mobile App From Any WordPress Website. AppPresser ... Even developers with no prior experience making apps can build an app with AppPresser, ...
Read more