Mobile Web Applications. Gary Dubuque IT Research Architect Department of Revenue

Size: px
Start display at page:

Download "Mobile Web Applications. Gary Dubuque IT Research Architect Department of Revenue"

Transcription

1 Mobile Web Applications Gary Dubuque IT Research Architect Department of Revenue

2 Summary Times are approximate 10:15am 10:25am 10:35am 10:45am Evolution of Web Applications How they got replaced by native mobile applications Architecture of a Mobile Web Application Concerns and challenges of design, SPA Libraries and Frameworks Picking development templates in VS 2012 Quick tour of sample code Fortress considerations 10:55am Deployment Website or app store

3

4 Web Application (using iquery.mobile)

5 Using Mobile Browsers we have to consider: Getting that native app feeling Match well-trained user expectations Keep it speedy Make it beautiful Opt for a simple, focused user experience.

6 HTML5 in Mobile Browsers Android 219, Android browser for Android , Mobile Chrome for Android 4.0+ (buggy) 424, Mobile Chrome for Android 4.4 ios HTML5Test scores 328, Safari for ios 5.1 (max score is 555) 387, Safari for ios , Safari for ios 7.0 (has bugs) Windows Phone 128, Internet Explorer 9 Mobile for WP , Internet Explorer 10 Mobile for WP 8 Cross Platform Browsers 462, FireFox OS, FireFox for Android, but not Apple s ios, etc. 471, Opera (Android) and Opera Mini (iphone & others) 484, Google Chrome on Apple s ios, but not Microsoft s WP

7 Comparison for a Web App s Evolution How to make a web app more like a native app NATIVE MOBILE APPLICATION Install (once) from app marketplace Dynamic views & downloaded data OS specific view layouts OS specific navigation and styles OS specific programming language WEB BROWSER APPLICATION Downloads page every time shown Active Server Page (JSP, PHP, etc.) Generic HTML page definitions Generic Browser Navigation JavaScript

8 Architecture of a Web Application Concerns and challenges of design, the Single Page Application SEO-support Browser-History-Support (Back button) Dynamic routes (minimum DOM size) RESTful data layer MV*-structure Testing-support

9 An Example using DOR s Mobile Application Browser s HTML/JavaScript Mobile Device Location Services (aka GPS) Current Location RESTful w/ JSON Location Tax rate, Location code, Confirmation code Mobile App Location Tax rate, Location code, Confirmation code Tax Rate Lookup Web Service Mobile Taxpayer

10 Protecting Web Services in Mobile World Going mobile is the most public your data can be Mobile Client Fortress Washington State s Web Servers The reverse proxy software is written for HTML pages. A SPA application does not always get HTML pages from the server.

11 Single Page Application Client Architectures Client HTML AJAX JSON Processing Cycle MV* IIS Server View View User Input Updates User Input Updates View Model Modifies Controller Modifies Model Model

12 Backbone.js MV* HTTP Request Router DOM updates model updates syncs DOM View Models Data Source DOM events model events Template

13 Core Libraries and Frameworks Bootstrap

14 Libraries for a Web Application

15 Some Installed Templates SPA Templates As shown in VS 2012, but VS2013 does not show Breeze versions.

16 Quick Peek at Some Code (MVC _Layout) <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="x-ua-compatible" content="ie=edge, chrome=1" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" </head> <body> <header> <div class="content-wrapper"> <div class="float-left"> <p class="site-title"><a href="~/">business Records Database</a></p> </div> </div> @Scripts.Render("~/bundles/app") </body> </html> Meta tags for Responsive Design Style sheets in <head> tag Load scripts last

17 Quick Peek at Some Code (MVC View) <div id="body"> <div style="display:none;"> <a id="arooturl" </div> <section class="featured"> <div class="content-wrapper"> <hgroup class="title"> <h1>welcome!</h1> </hgroup> <h2>enter a business name and tap the Search button.</h2> <p> <label for="searchtext >Search For:</label> <input type="text" id="searchtext" /> <button type="button id= btnsearch onclick= dosearch() class="btn btn-primary has-spinner > <span class="spinner"> <i class="glyphicon glyphicon-refresh icon-spin icon-white"></i> </span> Search </button> Content changes in </p> Details section </div> </section> <section id= Details class="content-wrapper main-content clear-fix"> </section> </div> Rewritten URL by State s Firewall Input search text and button with refresh spinner

18 Quick Peek at Some Model Code (Backbone JS) var app = app {}; app.urlfortress = '; // This is the URL for the REST web server // The model for a business item in the results list app.business = Backbone.Model.extend({}); Model for the results list entry // The collection of businesses is backed by a remote service. var BusinessList = Backbone.Collection.extend({ model: app.business, url: function () { return app.urlfortress + GetBeginsWith ; } }; // This model for the details of a business is backed by a remote service too. var BusinessData = Backbone.Model.extend({ url: function () { return app.urlfortress + GetID ; } } ; List is a collection of businesses Reference to web service function Business s details from web service app.businesses = new BusinessList(); // Create our global collection of **Businesses**.

19 Quick Peek at Some Router Code (Backbone JS) var app = app {}; $(function () { var BrdRouter = Backbone.Router.extend({ routes: { '': function () { $( #Details").empty(); }, 'search/:query': 'search', id/:id : 'seek' }, search: function (query) { GetListItems(query); }, seek: function (id) { GetItem(id); } }); Route patterns Matches the search URL id URL shows a business s details }); app.router = new BrdRouter(); Backbone.history.start(); // make a global instance of the router class // Start stacking into the url history of the browser

20 Quick Peek at Some Code (Search Controller) function dosearch { var query = $( #searchtext").val(); app.router.navigate("search/" + query, {trigger: true}); } function GetListItems(query) { app.urlfortress = $("#arooturl").attr("href"); Input search text sets navigation Fix the web service URL } $('#btnsearch').toggleclass('active'); app.businesses.fetch({ data: {criteria:query}, success: function () { $( #btnsearch').toggleclass('active'); ShowList(); }, error: function (model, response, options) { $('#btnsearch').toggleclass('active'); alert("web Service Unavailable"); } }); Show the busy spinner icon Data for web service request Success and error of web service

21 Quick Peek at Some Code (Search View) function ShowList(criteria) { var selectlist = "<h3>we suggest the following list:</h3><br />"; selectlist += "<ul class='round'>"; onclick should be an event in a view app.businesses.each(function (business) { selectlist += '<li data-id="' + business.get("tranum") + '" onclick= NavItem(this)" ' + 'class="title" style="font-size:medium; font-weight: bold;">' + } }); business.get("name") + ' (' + business.get("tranum") + ') ' + business.get("city") + ', Closed: ' + business.get("closedate") + '</li>'; $("#Details").html(selectList + "</ul>"); Business added to results list Single string updates DOM

22 Quick Peek at Some Code (Details Controller) function NavItem(item) { var id = $(item).attr("data-id"); app.router.navigate("tra/" + id, {trigger: true}); } function GetItem(id) { app.brd = new app.businessdetails(); $('#btnsearch').toggleclass('active'); app.brd.fetch({ data: { tra: id }, success: function () { $('#btnsearch').toggleclass('active'); $("#Details").html(app.detailsView.render()); }, error: function (model, response, options) { $('#btnsearch').toggleclass('active'); alert("web Service Unavailable (" + response.status + ")"); } }); } Selected TRA id sets navigation Show the busy spinner icon Data for web service request Success and error of web service

23 Quick Peek at Some Code (Details View) var app = app {}; var BusinessDetailsView = Backbone.View.extend({ template: _.template($('#detailstemplate').html()), render: function () { var dict = app.brd.tojson(); var html = this.template(dict); return html; } }); Uses template for view s layout Business s details applied to template // Create our details view. app.detailsview = new BusinessDetailsView();

24 Quick Peek at Some Code (Details Template) <script type="text/template" id="detailstemplate"> <h1>washington State Department of Revenue</h1> <h1>state Business Records Database Detail</h1> <br /> Tax Registration No: <%= tranum %> <br /> Entity Name: <%= ownername %> <br /> Business Name: <%= dba %> <br /> Entity Type: <%= legalentitytype %> <br /> Mailing Street: <%= mailingline1addr %> <%= mailingline2addr %> <br /> Mailing City: <%= mailingcity %> <br /> Mailing State: <%= mailingstate %> <br /> Mailing Zip Code: <%= mailingzip %> <br /> Mailing Zip's Plus Four: <%= mailingplus4 %> <br /> NAICS Code: <%= NAICSnum %> <br /> Owner Type: <%= OwnerType %> <br /> Account Opened: <%= OpenDate %> <br /> Account Closed: <%= CloseDate %> </script> Use HTML script tag to save template as text Same escape codes as ASP.Net

25 Deploying the Application Now we can bundle the static html, css, and JavaScript that displays dynamic content into bytes that reside on mobile device (cache) <html manifest= cache.manifest > PhoneGap/Cordova makes that easy to do as a (hybrid) native application (using Node.js) Check out Yahoo s YUI framework for Node.js

26 Thank You

ANGULAR JS SOFTWARE ENGINEERING FOR WEB SERVICES HASAN FAIZAL K APRIL,2014

ANGULAR JS SOFTWARE ENGINEERING FOR WEB SERVICES HASAN FAIZAL K APRIL,2014 ANGULAR JS SOFTWARE ENGINEERING FOR WEB SERVICES HASAN FAIZAL K APRIL,2014 What is Angular Js? Open Source JavaScript framework for dynamic web apps. Developed in 2009 by Miško Hevery and Adam Abrons.

More information

JavaScript By: A. Mousavi & P. Broomhead SERG, School of Engineering Design, Brunel University, UK

JavaScript By: A. Mousavi & P. Broomhead SERG, School of Engineering Design, Brunel University, UK Programming for Digital Media EE1707 JavaScript By: A. Mousavi & P. Broomhead SERG, School of Engineering Design, Brunel University, UK 1 References and Sources 1. DOM Scripting, Web Design with JavaScript

More information

Web Development 1 A4 Project Description Web Architecture

Web Development 1 A4 Project Description Web Architecture Web Development 1 Introduction to A4, Architecture, Core Technologies A4 Project Description 2 Web Architecture 3 Web Service Web Service Web Service Browser Javascript Database Javascript Other Stuff:

More information

PLAYER DEVELOPER GUIDE

PLAYER DEVELOPER GUIDE PLAYER DEVELOPER GUIDE CONTENTS CREATING AND BRANDING A PLAYER IN BACKLOT 5 Player Platform and Browser Support 5 How Player Works 6 Setting up Players Using the Backlot API 6 Creating a Player Using the

More information

1. About the Denver LAMP meetup group. 2. The purpose of Denver LAMP meetups. 3. Volunteers needed for several positions

1. About the Denver LAMP meetup group. 2. The purpose of Denver LAMP meetups. 3. Volunteers needed for several positions 1. About the Denver LAMP meetup group 1.Host a presentation every 1-3 months 2.Cover 1-3 related topics per meeting 3.Goal is to provide high quality education and networking, for free 2. The purpose of

More information

Visualizing a Neo4j Graph Database with KeyLines

Visualizing a Neo4j Graph Database with KeyLines Visualizing a Neo4j Graph Database with KeyLines Introduction 2! What is a graph database? 2! What is Neo4j? 2! Why visualize Neo4j? 3! Visualization Architecture 4! Benefits of the KeyLines/Neo4j architecture

More information

the intro for RPG programmers Making mobile app development easier... of KrengelTech by Aaron Bartell aaronbartell@mowyourlawn.com

the intro for RPG programmers Making mobile app development easier... of KrengelTech by Aaron Bartell aaronbartell@mowyourlawn.com the intro for RPG programmers Making mobile app development easier... Copyright Aaron Bartell 2012 by Aaron Bartell of KrengelTech aaronbartell@mowyourlawn.com Abstract Writing native applications for

More information

Intell-a-Keeper Reporting System Technical Programming Guide. Tracking your Bookings without going Nuts! http://www.acorn-is.

Intell-a-Keeper Reporting System Technical Programming Guide. Tracking your Bookings without going Nuts! http://www.acorn-is. Intell-a-Keeper Reporting System Technical Programming Guide Tracking your Bookings without going Nuts! http://www.acorn-is.com 877-ACORN-99 Step 1: Contact Marian Talbert at Acorn Internet Services at

More information

Abusing HTML5. DEF CON 19 Ming Chow Lecturer, Department of Computer Science TuCs University Medford, MA 02155 mchow@cs.tucs.edu

Abusing HTML5. DEF CON 19 Ming Chow Lecturer, Department of Computer Science TuCs University Medford, MA 02155 mchow@cs.tucs.edu Abusing HTML5 DEF CON 19 Ming Chow Lecturer, Department of Computer Science TuCs University Medford, MA 02155 mchow@cs.tucs.edu What is HTML5? The next major revision of HTML. To replace XHTML? Yes Close

More information

MAGENTO THEME SHOE STORE

MAGENTO THEME SHOE STORE MAGENTO THEME SHOE STORE Developer: BSEtec Email: support@bsetec.com Website: www.bsetec.com Facebook Profile: License: GPLv3 or later License URL: http://www.gnu.org/licenses/gpl-3.0-standalone.html 1

More information

Spectrum Technology Platform

Spectrum Technology Platform Spectrum Technology Platform Version 8.0.0 SP2 RIA Getting Started Guide Information in this document is subject to change without notice and does not represent a commitment on the part of the vendor or

More information

Web Design Technology

Web Design Technology Web Design Technology Terms Found in web design front end Found in web development back end Browsers Uses HTTP to communicate with Web Server Browser requests a html document Web Server sends a html document

More information

Developing ASP.NET MVC 4 Web Applications MOC 20486

Developing ASP.NET MVC 4 Web Applications MOC 20486 Developing ASP.NET MVC 4 Web Applications MOC 20486 Course Outline Module 1: Exploring ASP.NET MVC 4 The goal of this module is to outline to the students the components of the Microsoft Web Technologies

More information

Online Multimedia Winter semester 2015/16

Online Multimedia Winter semester 2015/16 Multimedia im Netz Online Multimedia Winter semester 2015/16 Tutorial 12 Major Subject Ludwig-Maximilians-Universität München Online Multimedia WS 2015/16 - Tutorial 12-1 Today s Agenda Imperative vs.

More information

The purpose of jquery is to make it much easier to use JavaScript on your website.

The purpose of jquery is to make it much easier to use JavaScript on your website. jquery Introduction (Source:w3schools.com) The purpose of jquery is to make it much easier to use JavaScript on your website. What is jquery? jquery is a lightweight, "write less, do more", JavaScript

More information

MASTERTAG DEVELOPER GUIDE

MASTERTAG DEVELOPER GUIDE MASTERTAG DEVELOPER GUIDE TABLE OF CONTENTS 1 Introduction... 4 1.1 What is the zanox MasterTag?... 4 1.2 What is the zanox page type?... 4 2 Create a MasterTag application in the zanox Application Store...

More information

Client-side Web Engineering From HTML to AJAX

Client-side Web Engineering From HTML to AJAX Client-side Web Engineering From HTML to AJAX SWE 642, Spring 2008 Nick Duan 1 What is Client-side Engineering? The concepts, tools and techniques for creating standard web browser and browser extensions

More information

Web Design Basics. Cindy Royal, Ph.D. Associate Professor Texas State University

Web Design Basics. Cindy Royal, Ph.D. Associate Professor Texas State University Web Design Basics Cindy Royal, Ph.D. Associate Professor Texas State University HTML and CSS HTML stands for Hypertext Markup Language. It is the main language of the Web. While there are other languages

More information

Visualizing an OrientDB Graph Database with KeyLines

Visualizing an OrientDB Graph Database with KeyLines Visualizing an OrientDB Graph Database with KeyLines Visualizing an OrientDB Graph Database with KeyLines 1! Introduction 2! What is a graph database? 2! What is OrientDB? 2! Why visualize OrientDB? 3!

More information

Further web design: HTML forms

Further web design: HTML forms Further web design: HTML forms Practical workbook Aims and Learning Objectives The aim of this document is to introduce HTML forms. By the end of this course you will be able to: use existing forms on

More information

CHOOSING THE RIGHT HTML5 FRAMEWORK To Build Your Mobile Web Application

CHOOSING THE RIGHT HTML5 FRAMEWORK To Build Your Mobile Web Application BACKBONE.JS Sencha Touch CHOOSING THE RIGHT HTML5 FRAMEWORK To Build Your Mobile Web Application A RapidValue Solutions Whitepaper Author: Pooja Prasad, Technical Lead, RapidValue Solutions Contents Executive

More information

CSC309 Winter 2016 Lecture 3. Larry Zhang

CSC309 Winter 2016 Lecture 3. Larry Zhang CSC309 Winter 2016 Lecture 3 Larry Zhang 1 Why Javascript Javascript is for dynamically manipulate the front-end of your web page. Add/remove/change the content/attributes of an HTML element Change the

More information

Website Login Integration

Website Login Integration SSO Widget Website Login Integration October 2015 Table of Contents Introduction... 3 Getting Started... 5 Creating your Login Form... 5 Full code for the example (including CSS and JavaScript):... 7 2

More information

Website Planning Checklist

Website Planning Checklist Website Planning Checklist The following checklist will help clarify your needs and goals when creating a website you ll be surprised at how many decisions must be made before any production begins! Even

More information

ecommercesoftwareone Advance User s Guide -www.ecommercesoftwareone.com

ecommercesoftwareone Advance User s Guide -www.ecommercesoftwareone.com Advance User s Guide -www.ecommercesoftwareone.com Contents Background 3 Method 4 Step 1 - Select Advance site layout 4 Step 2 - Identify Home page code of top/left and bottom/right sections 6 Step 3 -

More information

Example. Represent this as XML

Example. Represent this as XML Example INF 221 program class INF 133 quiz Assignment Represent this as XML JSON There is not an absolutely correct answer to how to interpret this tree in the respective languages. There are multiple

More information

WIRIS quizzes web services Getting started with PHP and Java

WIRIS quizzes web services Getting started with PHP and Java WIRIS quizzes web services Getting started with PHP and Java Document Release: 1.3 2011 march, Maths for More www.wiris.com Summary This document provides client examples for PHP and Java. Contents WIRIS

More information

Developing ASP.NET MVC 4 Web Applications

Developing ASP.NET MVC 4 Web Applications Course M20486 5 Day(s) 30:00 Hours Developing ASP.NET MVC 4 Web Applications Introduction In this course, students will learn to develop advanced ASP.NET MVC applications using.net Framework 4.5 tools

More information

Mobile development with Apache OFBiz. Ean Schuessler, co-founder @ Brainfood

Mobile development with Apache OFBiz. Ean Schuessler, co-founder @ Brainfood Mobile development with Apache OFBiz Ean Schuessler, co-founder @ Brainfood Mobile development For the purposes of this talk mobile development means mobile web development The languages and APIs for native

More information

Version 1.0 OFFICIAL THEME USER GUIDE. reva. HTML5 - Responsive One Page Parallax Theme

Version 1.0 OFFICIAL THEME USER GUIDE. reva. HTML5 - Responsive One Page Parallax Theme Version 1.0 OFFICIAL THEME USER GUIDE reva HTML5 - Responsive One Page Parallax Theme G R EE T I NG S FR OM DESIG NO VA Thank You For Purchasing Our Product. Important - FAQ: 1) What is this User Guide

More information

Yandex.Widgets Quick start

Yandex.Widgets Quick start 17.09.2013 .. Version 2 Document build date: 17.09.2013. This volume is a part of Yandex technical documentation. Yandex helpdesk site: http://help.yandex.ru 2008 2013 Yandex LLC. All rights reserved.

More information

Web Development CSE2WD Final Examination June 2012. (a) Which organisation is primarily responsible for HTML, CSS and DOM standards?

Web Development CSE2WD Final Examination June 2012. (a) Which organisation is primarily responsible for HTML, CSS and DOM standards? Question 1. (a) Which organisation is primarily responsible for HTML, CSS and DOM standards? (b) Briefly identify the primary purpose of the flowing inside the body section of an HTML document: (i) HTML

More information

Mul$media im Netz (Online Mul$media) Wintersemester 2014/15. Übung 06 (Nebenfach)

Mul$media im Netz (Online Mul$media) Wintersemester 2014/15. Übung 06 (Nebenfach) Mul$media im Netz (Online Mul$media) Wintersemester 2014/15 Übung 06 (Nebenfach) Online Mul?media WS 2014/15 - Übung 05-1 Today s Agenda Flashback! 5 th tutorial Introduc?on to JavaScript Assignment 5

More information

Login with Amazon. Getting Started Guide for Websites. Version 1.0

Login with Amazon. Getting Started Guide for Websites. Version 1.0 Login with Amazon Getting Started Guide for Websites Version 1.0 Login with Amazon: Getting Started Guide for Websites Copyright 2016 Amazon Services, LLC or its affiliates. All rights reserved. Amazon

More information

Building Web Applications with HTML5, CSS3, and Javascript: An Introduction to HTML5

Building Web Applications with HTML5, CSS3, and Javascript: An Introduction to HTML5 Building Web Applications with HTML5, CSS3, and Javascript: An Introduction to HTML5 Jason Clark Head of Digital Access & Web Services Montana State University Library pinboard.in #tag pinboard.in/u:jasonclark/t:lita-html5/

More information

Slide.Show Quick Start Guide

Slide.Show Quick Start Guide Slide.Show Quick Start Guide Vertigo Software December 2007 Contents Introduction... 1 Your first slideshow with Slide.Show... 1 Step 1: Embed the control... 2 Step 2: Configure the control... 3 Step 3:

More information

Making Web Application using Tizen Web UI Framework. Koeun Choi

Making Web Application using Tizen Web UI Framework. Koeun Choi Making Web Application using Tizen Web UI Framework Koeun Choi Contents Overview Web Applications using Web UI Framework Tizen Web UI Framework Web UI Framework Launching Flow Web Winsets Making Web Application

More information

AJAX The Future of Web Development?

AJAX The Future of Web Development? AJAX The Future of Web Development? Anders Moberg (dit02amg), David Mörtsell (dit01dml) and David Södermark (dv02sdd). Assignment 2 in New Media D, Department of Computing Science, Umeå University. 2006-04-28

More information

IMRG Peermap API Documentation V 5.0

IMRG Peermap API Documentation V 5.0 IMRG Peermap API Documentation V 5.0 An Introduction to the IMRG Peermap Service... 2 Using a Tag Manager... 2 Inserting your Unique API Key within the Script... 2 The JavaScript Snippet... 3 Adding the

More information

A Model of the Operation of The Model-View- Controller Pattern in a Rails-Based Web Server

A Model of the Operation of The Model-View- Controller Pattern in a Rails-Based Web Server A of the Operation of The -- Pattern in a Rails-Based Web Server January 10, 2011 v 0.4 Responding to a page request 2 A -- user clicks a link to a pattern page in on a web a web application. server January

More information

Script Handbook for Interactive Scientific Website Building

Script Handbook for Interactive Scientific Website Building Script Handbook for Interactive Scientific Website Building Version: 173205 Released: March 25, 2014 Chung-Lin Shan Contents 1 Basic Structures 1 11 Preparation 2 12 form 4 13 switch for the further step

More information

WompMobile Technical FAQ

WompMobile Technical FAQ WompMobile Technical FAQ What are the technical benefits of WompMobile? The mobile site has the same exact URL as the desktop website. The mobile site automatically and instantly syncs with the desktop

More information

Developing ASP.NET MVC 4 Web Applications Course 20486A; 5 Days, Instructor-led

Developing ASP.NET MVC 4 Web Applications Course 20486A; 5 Days, Instructor-led Developing ASP.NET MVC 4 Web Applications Course 20486A; 5 Days, Instructor-led Course Description In this course, students will learn to develop advanced ASP.NET MVC applications using.net Framework 4.5

More information

Website Implementation

Website Implementation To host NetSuite s product demos on your company s website, please follow the instructions below. (Note that details on adding your company s contact information to the Contact Us button in the product

More information

Performance Testing for Ajax Applications

Performance Testing for Ajax Applications Radview Software How to Performance Testing for Ajax Applications Rich internet applications are growing rapidly and AJAX technologies serve as the building blocks for such applications. These new technologies

More information

JavaScript and Dreamweaver Examples

JavaScript and Dreamweaver Examples JavaScript and Dreamweaver Examples CSC 103 October 15, 2007 Overview The World is Flat discussion JavaScript Examples Using Dreamweaver HTML in Dreamweaver JavaScript Homework 3 (due Friday) 1 JavaScript

More information

A MOBILE WEBSITE PROTOTYPE. A Paper Submitted to the Graduate Faculty of the North Dakota State University of Agriculture and Applied Science

A MOBILE WEBSITE PROTOTYPE. A Paper Submitted to the Graduate Faculty of the North Dakota State University of Agriculture and Applied Science A MOBILE WEBSITE PROTOTYPE A Paper Submitted to the Graduate Faculty of the North Dakota State University of Agriculture and Applied Science By Ashish Teotia In Partial Fulfillment of the Requirements

More information

Getting Started with Ubertor's Cascading Style Sheet (CSS) Support

Getting Started with Ubertor's Cascading Style Sheet (CSS) Support Overview Getting Started with Ubertor's Cascading Style Sheet (CSS) Support The Ubertor CMS is a dynamic content management system; much of the markup is generated based on a series of preferences and

More information

Web Building Blocks. Joseph Gilbert User Experience Web Developer University of Virginia Library joe.gilbert@virginia.

Web Building Blocks. Joseph Gilbert User Experience Web Developer University of Virginia Library joe.gilbert@virginia. Web Building Blocks Core Concepts for HTML & CSS Joseph Gilbert User Experience Web Developer University of Virginia Library joe.gilbert@virginia.edu @joegilbert Why Learn the Building Blocks? The idea

More information

This course provides students with the knowledge and skills to develop ASP.NET MVC 4 web applications.

This course provides students with the knowledge and skills to develop ASP.NET MVC 4 web applications. 20486B: Developing ASP.NET MVC 4 Web Applications Course Overview This course provides students with the knowledge and skills to develop ASP.NET MVC 4 web applications. Course Introduction Course Introduction

More information

Copyright 2013-2014 by Object Computing, Inc. (OCI). All rights reserved. AngularJS Testing

Copyright 2013-2014 by Object Computing, Inc. (OCI). All rights reserved. AngularJS Testing Testing The most popular tool for running automated tests for AngularJS applications is Karma runs unit tests and end-to-end tests in real browsers and PhantomJS can use many testing frameworks, but Jasmine

More information

JavaScript Basics & HTML DOM. Sang Shin Java Technology Architect Sun Microsystems, Inc. sang.shin@sun.com www.javapassion.com

JavaScript Basics & HTML DOM. Sang Shin Java Technology Architect Sun Microsystems, Inc. sang.shin@sun.com www.javapassion.com JavaScript Basics & HTML DOM Sang Shin Java Technology Architect Sun Microsystems, Inc. sang.shin@sun.com www.javapassion.com 2 Disclaimer & Acknowledgments Even though Sang Shin is a full-time employee

More information

White Paper On. Single Page Application. Presented by: Yatin Patel

White Paper On. Single Page Application. Presented by: Yatin Patel White Paper On Single Page Application Presented by: Yatin Patel Table of Contents Executive Summary... 3 Web Application Architecture Patterns... 4 Common Aspects... 4 Model... 4 View... 4 Architecture

More information

Implementing Specialized Data Capture Applications with InVision Development Tools (Part 2)

Implementing Specialized Data Capture Applications with InVision Development Tools (Part 2) Implementing Specialized Data Capture Applications with InVision Development Tools (Part 2) [This is the second of a series of white papers on implementing applications with special requirements for data

More information

Short notes on webpage programming languages

Short notes on webpage programming languages Short notes on webpage programming languages What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML is a markup language A markup language is a set of

More information

Designing HTML Emails for Use in the Advanced Editor

Designing HTML Emails for Use in the Advanced Editor Designing HTML Emails for Use in the Advanced Editor For years, we at Swiftpage have heard a recurring request from our customers: wouldn t it be great if you could create an HTML document, import it into

More information

IBM Digital Experience. Using Modern Web Development Tools and Technology with IBM Digital Experience

IBM Digital Experience. Using Modern Web Development Tools and Technology with IBM Digital Experience IBM Digital Experience Using Modern Web Development Tools and Technology with IBM Digital Experience Agenda The 2015 web development landscape and IBM Digital Experience Modern web applications and frameworks

More information

HTML5 and CSS3 Part 1: Using HTML and CSS to Create a Website Layout

HTML5 and CSS3 Part 1: Using HTML and CSS to Create a Website Layout CALIFORNIA STATE UNIVERSITY, LOS ANGELES INFORMATION TECHNOLOGY SERVICES HTML5 and CSS3 Part 1: Using HTML and CSS to Create a Website Layout Fall 2011, Version 1.0 Table of Contents Introduction...3 Downloading

More information

Developer Tutorial Version 1. 0 February 2015

Developer Tutorial Version 1. 0 February 2015 Developer Tutorial Version 1. 0 Contents Introduction... 3 What is the Mapzania SDK?... 3 Features of Mapzania SDK... 4 Mapzania Applications... 5 Architecture... 6 Front-end application components...

More information

Web Design Revision. AQA AS-Level Computing COMP2. 39 minutes. 39 marks. Page 1 of 17

Web Design Revision. AQA AS-Level Computing COMP2. 39 minutes. 39 marks. Page 1 of 17 Web Design Revision AQA AS-Level Computing COMP2 204 39 minutes 39 marks Page of 7 Q. (a) (i) What does HTML stand for?... () (ii) What does CSS stand for?... () (b) Figure shows a web page that has been

More information

WHITEPAPER. Skinning Guide. Let s chat. 800.9.Velaro www.velaro.com info@velaro.com. 2012 by Velaro

WHITEPAPER. Skinning Guide. Let s chat. 800.9.Velaro www.velaro.com info@velaro.com. 2012 by Velaro WHITEPAPER Skinning Guide Let s chat. 2012 by Velaro 800.9.Velaro www.velaro.com info@velaro.com INTRODUCTION Throughout the course of a chat conversation, there are a number of different web pages that

More information

Quick Start Guide Mobile Entrée 4

Quick Start Guide Mobile Entrée 4 Table of Contents Table of Contents... 1 Installation... 2 Obtaining the Installer... 2 Installation Using the Installer... 2 Site Configuration... 2 Feature Activation... 2 Definition of a Mobile Application

More information

Introduction to PhoneGap

Introduction to PhoneGap Web development for mobile platforms Master on Free Software / August 2012 Outline About PhoneGap 1 About PhoneGap 2 Development environment First PhoneGap application PhoneGap API overview Building PhoneGap

More information

Building Ajax Applications with GT.M and EWD. Rob Tweed M/Gateway Developments Ltd

Building Ajax Applications with GT.M and EWD. Rob Tweed M/Gateway Developments Ltd Building Ajax Applications with GT.M and EWD Rob Tweed M/Gateway Developments Ltd Is GT.M old-fashioned? I am a physician working in the VA system. I also program in.net. Certainly the VAs informatics

More information

Network Security Web Security

Network Security Web Security Network Security Web Security Anna Sperotto, Ramin Sadre Design and Analysis of Communication Systems Group University of Twente, 2012 Cross Site Scripting Cross Side Scripting (XSS) XSS is a case of (HTML)

More information

Chapter 2 HTML Basics Key Concepts. Copyright 2013 Terry Ann Morris, Ed.D

Chapter 2 HTML Basics Key Concepts. Copyright 2013 Terry Ann Morris, Ed.D Chapter 2 HTML Basics Key Concepts Copyright 2013 Terry Ann Morris, Ed.D 1 First Web Page an opening tag... page info goes here a closing tag Head & Body Sections Head Section

More information

Proposal submitted by

Proposal submitted by Proposal submitted by To Mac Sharma For developing web site and related IT Support Date of submission: 11 th May 2009 www.rtcamp.com page 2 About rtcamp We're artists, analysts, technologists, writers,

More information

DESIGNING HTML HELPERS TO OPTIMIZE WEB APPLICATION DEVELOPMENT

DESIGNING HTML HELPERS TO OPTIMIZE WEB APPLICATION DEVELOPMENT Abstract DESIGNING HTML HELPERS TO OPTIMIZE WEB APPLICATION DEVELOPMENT Dragos-Paul Pop 1 Building a web application or a website can become difficult, just because so many technologies are involved. Generally

More information

oncourse web design handbook Aristedes Maniatis Charlotte Tanner

oncourse web design handbook Aristedes Maniatis Charlotte Tanner oncourse web design handbook Aristedes Maniatis Charlotte Tanner oncourse web design handbook by Aristedes Maniatis and Charlotte Tanner version unspecified Publication date 10 Nov 2015 Copyright 2015

More information

SUBJECT CODE : 4074 PERIODS/WEEK : 4 PERIODS/ SEMESTER : 72 CREDIT : 4 TIME SCHEDULE UNIT TOPIC PERIODS 1. INTERNET FUNDAMENTALS & HTML Test 1

SUBJECT CODE : 4074 PERIODS/WEEK : 4 PERIODS/ SEMESTER : 72 CREDIT : 4 TIME SCHEDULE UNIT TOPIC PERIODS 1. INTERNET FUNDAMENTALS & HTML Test 1 SUBJECT TITLE : WEB TECHNOLOGY SUBJECT CODE : 4074 PERIODS/WEEK : 4 PERIODS/ SEMESTER : 72 CREDIT : 4 TIME SCHEDULE UNIT TOPIC PERIODS 1. INTERNET FUNDAMENTALS & HTML Test 1 16 02 2. CSS & JAVASCRIPT Test

More information

Building a Simple Mobile optimized Web App/Site Using the jquery Mobile Framework

Building a Simple Mobile optimized Web App/Site Using the jquery Mobile Framework Building a Simple Mobile optimized Web App/Site Using the jquery Mobile Framework pinboard.in tag http://pinboard.in/u:jasonclark/t:amigos-jquery-mobile/ Agenda Learn what a mobile framework is. Understand

More information

CarTrawler AJAX Booking Engine Version: 5.10 Date: 01/10/13. http://www.cartrawler.com

CarTrawler AJAX Booking Engine Version: 5.10 Date: 01/10/13. http://www.cartrawler.com Date: 01/10/13 http://www.cartrawler.com 1. Introduction... 3 1.1. Pre-requisites... 3 1.2. Intended Audience... 3 2. Technical Dependencies... 3 3. Implementation... 3 3.1. Set up the server environment...

More information

Demystifying Page Load Performance with WProf

Demystifying Page Load Performance with WProf Demystifying Page Load Performance with WProf Xiao (Sophia) Wang, Aruna Balasubramanian, Arvind Krishnamurthy, and David Wetherall University of Washington Web is the critical part of the Internet 1 Page

More information

Developing Cross-platform Mobile and Web Apps

Developing Cross-platform Mobile and Web Apps 1 Developing Cross-platform Mobile and Web Apps Xiang Mao 1 and Jiannong Xin * 2 1 Department of Electrical and Computer Engineering, University of Florida 2 Institute of Food and Agricultural Sciences

More information

Event-Based Programming Using Top-Down Design and Stepwise Refinement. AJAX Programming for the World Wide Web

Event-Based Programming Using Top-Down Design and Stepwise Refinement. AJAX Programming for the World Wide Web Event-Based Programming Using Top-Down Design and Stepwise Refinement AJAX Programming for the World Wide Web By Dave McGuinness Urangan State High School QSITE Conference 2009 IPT Strand TRADITIONAL WEB

More information

Magento Theme EM0006 for Computer store

Magento Theme EM0006 for Computer store Magento Theme EM0006 for Computer store Table of contends Table of contends Introduction Features General Features Flexible layouts Main Menu Standard Blocks Category Menu and Category Layered Menu. HTML

More information

Table of Contents. Overview... 2. Supported Platforms... 3. Demos/Downloads... 3. Known Issues... 3. Note... 3. Included Files...

Table of Contents. Overview... 2. Supported Platforms... 3. Demos/Downloads... 3. Known Issues... 3. Note... 3. Included Files... Table of Contents Overview... 2 Supported Platforms... 3 Demos/Downloads... 3 Known Issues... 3 Note... 3 Included Files... 5 Implementing the Block... 6 Configuring The HTML5 Polling Block... 6 Setting

More information

Smartphone Application Development using HTML5-based Cross- Platform Framework

Smartphone Application Development using HTML5-based Cross- Platform Framework Smartphone Application Development using HTML5-based Cross- Platform Framework Si-Ho Cha 1 and Yeomun Yun 2,* 1 Dept. of Multimedia Science, Chungwoon University 113, Sukgol-ro, Nam-gu, Incheon, South

More information

Multimedia im Netz Online Multimedia Winter semester 2015/16. Tutorial 03 Major Subject

Multimedia im Netz Online Multimedia Winter semester 2015/16. Tutorial 03 Major Subject Multimedia im Netz Online Multimedia Winter semester 2015/16 Tutorial 03 Major Subject Ludwig- Maximilians- Universität München Online Multimedia WS 2015/16 - Tutorial 03-1 Today s Agenda Quick test Server

More information

Web Development. How the Web Works 3/3/2015. Clients / Server

Web Development. How the Web Works 3/3/2015. Clients / Server Web Development WWW part of the Internet (others: Email, FTP, Telnet) Loaded to a Server Viewed in a Browser (Client) Clients / Server Client: Request & Render Content Browsers, mobile devices, screen

More information

Magento 1.4 Theming Cookbook

Magento 1.4 Theming Cookbook P U B L I S H I N G community experience distilled Magento 1.4 Theming Cookbook Jose Argudo Blanco Chapter No. 5 "Going Further Making Our Theme Shine" In this package, you will find: A Biography of the

More information

Direct Post Method (DPM) Developer Guide

Direct Post Method (DPM) Developer Guide (DPM) Developer Guide Card Not Present Transactions Authorize.Net Developer Support http://developer.authorize.net Authorize.Net LLC 2/22/11 Ver. Ver 1.1 (DPM) Developer Guide Authorize.Net LLC ( Authorize.Net

More information

Enable Your Automated Web App Testing by WebDriver. Yugang Fan Intel

Enable Your Automated Web App Testing by WebDriver. Yugang Fan Intel Enable Your Automated Web App Testing by WebDriver Yugang Fan Intel Agenda Background Challenges WebDriver BDD Behavior Driven Test Architecture Example WebDriver Based Behavior Driven Test Summary Reference

More information

ios SDK possibilities & limitations

ios SDK possibilities & limitations ios SDK possibilities & limitations Licensing Licensing Registered as an Apple Developer (free) Access to XCode3 and ios SDK ios, Mac and Safari Dev Center Resources No possibility of distribution of developed

More information

Programming the Web 06CS73 SAMPLE QUESTIONS

Programming the Web 06CS73 SAMPLE QUESTIONS Programming the Web 06CS73 SAMPLE QUESTIONS Q1a. Explain standard XHTML Document structure Q1b. What is web server? Name any three web servers Q2. What is hypertext protocol? Explain the request phase

More information

Tutorial: Building a Dojo Application using IBM Rational Application Developer Loan Payment Calculator

Tutorial: Building a Dojo Application using IBM Rational Application Developer Loan Payment Calculator Tutorial: Building a Dojo Application using IBM Rational Application Developer Loan Payment Calculator Written by: Chris Jaun (cmjaun@us.ibm.com) Sudha Piddaparti (sudhap@us.ibm.com) Objective In this

More information

Peers Technologies Pvt. Ltd. Web Application Development

Peers Technologies Pvt. Ltd. Web Application Development Page 1 Peers Technologies Pvt. Ltd. Course Brochure Web Application Development Overview To make you ready to develop a web site / web application using the latest client side web technologies and web

More information

With mobile devices and tablets becoming popular for browsing the web, an increasing number of websites are turning to responsive designs to

With mobile devices and tablets becoming popular for browsing the web, an increasing number of websites are turning to responsive designs to With mobile devices and tablets becoming popular for browsing the web, an increasing number of websites are turning to responsive designs to seamlessly adapt to any screen resolution. Introduction... 2

More information

SaaS-Based Employee Benefits Enrollment System

SaaS-Based Employee Benefits Enrollment System Situation A US based industry leader in Employee benefits catering to large and diverse client base, wanted to build a high performance enterprise application that supports sizeable concurrent user load

More information

Introduction to Mobile Performance Testing

Introduction to Mobile Performance Testing Introduction to Mobile Performance Testing Shlomi Zalma, Wilson Mar DT3338 at Noon, June 13, 2013 HOL330 in Sands 305 Why performance test mobile apps? Mobile apps are now: how customers locate stores

More information

It is highly recommended that you are familiar with HTML and JavaScript before attempting this tutorial.

It is highly recommended that you are familiar with HTML and JavaScript before attempting this tutorial. About the Tutorial AJAX is a web development technique for creating interactive web applications. If you know JavaScript, HTML, CSS, and XML, then you need to spend just one hour to start with AJAX. Audience

More information

Configuring iplanet 6.0 Web Server For SSL and non-ssl Redirect

Configuring iplanet 6.0 Web Server For SSL and non-ssl Redirect Introduction Configuring iplanet 6.0 Web Server For SSL and non-ssl Redirect This document describes the process for configuring an iplanet web server for the following situation: Require that clients

More information

Develop IBM i Mobile and Desktop Applications with a Single Code Base. BCD Software, LLC. All rights reserved.

Develop IBM i Mobile and Desktop Applications with a Single Code Base. BCD Software, LLC. All rights reserved. Develop IBM i Mobile and Desktop Applications with a Single Code Base About the Presenters Greg Patterson Technical Sales Engineer BCD and Quadrant Software - A Division of Fresche Maximize Your Investment

More information

Write a Web Application for Free Edition 2

Write a Web Application for Free Edition 2 Write a Web Application for Free Edition 2 Thomas Davenport This book is for sale at http://leanpub.com/writeawebapplication4free This version was published on 2016-01-27 This is a Leanpub book. Leanpub

More information

MOBILE APPLICATION FOR EVENT UPDATES SATYA SAGAR VANTEDDU. B.Tech., Jawaharlal Technological University, 2011 A REPORT

MOBILE APPLICATION FOR EVENT UPDATES SATYA SAGAR VANTEDDU. B.Tech., Jawaharlal Technological University, 2011 A REPORT MOBILE APPLICATION FOR EVENT UPDATES by SATYA SAGAR VANTEDDU B.Tech., Jawaharlal Technological University, 2011 A REPORT submitted in partial fulfillment of the requirements for the degree MASTER OF SCIENCE

More information

Software Development Interactief Centrum voor gerichte Training en Studie Edisonweg 14c, 1821 BN Alkmaar T: 072 511 12 23

Software Development Interactief Centrum voor gerichte Training en Studie Edisonweg 14c, 1821 BN Alkmaar T: 072 511 12 23 Microsoft SharePoint year SharePoint 2013: Search, Design and 2031 Publishing New SharePoint 2013: Solutions, Applications 2013 and Security New SharePoint 2013: Features, Delivery and 2010 Development

More information

Web/Mobile Applications Principles

Web/Mobile Applications Principles Web/Mobile Applications Principles Pedro Alves Pedro Alves FCT / UNL Projecto Integrador 2015 Coupling Coupling If changing one module in a program requires changing another module, then coupling exists

More information

MOBILE DEVELOPMENT. With jquery Mobile & PhoneGap by Pete Freitag / Foundeo Inc. petefreitag.com / foundeo.com

MOBILE DEVELOPMENT. With jquery Mobile & PhoneGap by Pete Freitag / Foundeo Inc. petefreitag.com / foundeo.com MOBILE DEVELOPMENT With jquery Mobile & PhoneGap by Pete Freitag / Foundeo Inc. petefreitag.com / foundeo.com AGENDA Learn to build mobile web sites using jquerymobile and HTML5 Learn about PhoneGap for

More information