Delivering responsive ibm i applications

© Proximity 2014

© Proximity 2014

Delivering responsive IBM i applications (mobile/web) using PHP

Presented by Shahid Latif & Pete SamwaysProximity GroupPlease note: this presentation included a LIVE demonstration

© Proximity 2014

© Proximity 2014

Agenda

• What is responsive?

• Implementing responsive design on IBM i

• Live development demo

• Close

© Proximity 2014

What is responsive?

Optimising output for multiple devices

• Desktop

• Mobile

• Tablet

© Proximity 2014

Responsive features• Easy reading and navigation

• Minimum panning and scrolling

• Controls appropriate to device

• Behaviour according to devices

• Adapting layout to devices using

• Fluid, proportion-based grids

• Flexible images

• Media queries

© Proximity 2014

© Proximity 2014

Samples

© Proximity 2014

Responsive samples

© Proximity 2014

Trends

© Proximity 2014

• Implementing Responsive Design on IBM i

© Proximity 2014

Web Application Basics

HTTP request

HTML, CSS, JS etc.

CSS, JavaScript Java, .Net, PHP, Ruby, RPG, etc ...

© Proximity 2014

Why we prefer PHP• PHP is great for web development

• Fast to develop with

• Easy to learn especially for RPG developers

• Open source and free to use

• Widely used

• Strong PHP community

• Extensive resources and tools available

• Wealth of education materials

• Runs on IBM i

• Integrates and works well with existing applications

• SQL database access, RPG / COBOL / CL program calls

• No 3rd party hardware

© Proximity 2014

PHP on IBM i

HTTP request

HTML, CSS, JS etc.

CSS, JavaScript

© Proximity 2014

IDE

• Integrated Development Environment

© Proximity 2014

IDE options

OR

Notepad++jEditEclipseAptana studiophpDesigner…

OR

© Proximity 2014

Zend Studio

• Eclipse based IDE

• PHP, HTML, CSS, JavaScript etc.

• i5 Toolkit support for easy access to IBM i resources

• Remote server support – save directly to the IBM i

• Built in debugger

• Supports all popular Source Control tools – Git / GitHub / SVN / CVS

• Zend Framework integration

• Apache Cordova integration

© Proximity 2014

• Live demo - Development in Zend Studio

© Proximity 2014

© Proximity 2014

© Proximity 2014

© Proximity 2014

© Proximity 2014

© Proximity 2014

© Proximity 2014

© Proximity 2014

© Proximity 2014

© Proximity 2014

© Proximity 2014

© Proximity 2014

Rapid Web Application Development

© Proximity 2014

WebSmart

Templates

PHP (or RPG)

HTML

CSS

JavaScript

© Proximity 2014

PHP on IBM i

HTTP request

HTML, CSS, JS etc.

CSS, JavaScript

© Proximity 2014

WebSmart features

• Generates PHP, HTML, CSS, JavaScript etc.

• Rapid template based development

• Short learning curve

• Leverage existing RPG

• Easy access to IBM i resources

• Remote server support – save directly to the IBM i

• Built in debugger

• Change management included

• No runtime license

© Proximity 2014

• Live demo - Development in WebSmart PHP

© Proximity 2014

© Proximity 2014

© Proximity 2014

© Proximity 2014

© Proximity 2014

© Proximity 2014

© Proximity 2014

WebSmart Demo

© Proximity 2014

© Proximity 2014

© Proximity 2014

© Proximity 2014

Summary• Mobile (and Tablets) are here to stay

• Ideally start web development with responsive in mind

• Even “Mobile First”

• Little extra effort required to deliver a responsive application

• Especially if considered from the beginning

• PHP - ideal language to deliver web applications

• Designed for building applications efficiently

• IBM i – recommended platform to deliver responsive web applications

• Deliver to desktop and mobile

• No extra servers required

• Re-use existing data and business logic on your IBM i

© Proximity 2014

Clear path suite

© Proximity 2014

To find out more about Proximity or to book your appointment to speak to us about your IBM i requirements, contact us on:

www.proximity.co.uk

Tel: 0113 393 3600

Email: info@proximity.co.uk