html 5 & css3 frameworks for mobile application development

11
HTML 5 & CSS3 frameworks for mobile application development Presented By: iCoderz Solutions

Upload: pritesh-s

Post on 09-Jan-2017

171 views

Category:

Design


0 download

TRANSCRIPT

Page 1: Html 5 & css3 frameworks for mobile application development

HTML 5 & CSS3 frameworks for mobile application development

Presented By: iCoderz Solutions

Page 2: Html 5 & css3 frameworks for mobile application development

There has been a lot of buzz about HTML5 and the potential it has when combined with CSS3 and JavaScript. The use of frameworks which bring these three technologies together simplifies the development process and enables developers to create compelling web apps more quickly.

In this Presentation we will look at some HTML5 and CSS3 frameworks that can be used to create mobile websites and applications.

Page 3: Html 5 & css3 frameworks for mobile application development

DHTMLX Touch & UI Designer

Just when I was thinking that the term DHTML was finally dead, along comes DHTMLX Touch, a free HTML5-based JavaScript library designed specifically for the creation of mobile web applications that work across platforms. As an HTML5-based framework, it comes with a complete feature set of User Interface widgets, as well as:

Form Widgets

Grid Widgets

Video

Menu

Google Maps

Group List

Popup

Confirm

Page 4: Html 5 & css3 frameworks for mobile application development

If you've ever worked with JavaScript and/or HTML frameworks before, you know that they don't usually come with a WYSIWYG tool that you can use along with the framework to create apps. They rely upon you working your way through the examples, taking bits of code that you like and editing it to suit your needs (i.e. old school hacking). That's the case with DHTMLX Touch, except that they also provide an online Visual Designer you can use to create your app by dragging-and-dropping components onto mobile App layout, and setting each control's properties through the same visual interface. Don't expect a Dreamweaver-like interface here, but it's still much easier than hacking example code. Here's what it looks like:

To Be Continued………

Page 5: Html 5 & css3 frameworks for mobile application development

Landscape and portrait layouts are both supported for iPhone- and iPad-sized screens, as well as custom sized screens. Once you are done creating an app using the Touch UI Designer, you are able to save it to your computer

Keep in mind that DHTMLX Touch, unlike other DHTMLX products, is completely free for both non-profit and commercial application development. You can use it in your own commercial apps without paying a cent.

so you can later move it to your web server, edit it, etc. Apps created with DHTMLX Touch (and the UI Designer) will work on the iPhone, iPad, Android and standard WebKit-based browsers such as Chrome, Safari and Firefox 3.6 and later.

Page 6: Html 5 & css3 frameworks for mobile application development

The iCoderz Solutions

The iCoderz Solutions, which may be short for Multi-Platform, Mobile, is another open source HTML5 and JavaScript framework that allows developers to create cross-platform mobile apps. Unlike DHTMLX Touch, the iCoderz Solutions comes with Expresso, a build tool that is based on Node.JS. Installing Node.JS isn't a simple one-click process, but now that Microsoft is working to create a Windows version of Node.JS, there won't be a requirement to install it under Cygwin, a Linux-like virtual environment used to run Linux applications on a Windows OS. Until that comes to fruition, you'll have to work through the documentation and set it all up.

Page 7: Html 5 & css3 frameworks for mobile application development

Here's what the iCoderz Solutions Project's sample To Do List application looks like:

Page 8: Html 5 & css3 frameworks for mobile application development

52 Frameworks

The 52 Framework is an HTML5, CSS3 and JavaScript framework that was created by folks from the Enavu Network. It is a full-featured collection that allows developers to create web apps that include HTML5 video, shadows, rounded corners, that use CSS3 selectors, the HTML5 canvas element and local storage, and that feature HTML5 form validation.

Like the others, the 52 Framework is provided as a zipfile download that contains a directory structure that makes it easy to find specific examples and sample code. You can see the full demo to try out the features of the 52 Framework yourself. Like the others, you can try out the examples live on your computer once you have downloaded and unzipped it, and you can hack and edit the examples to suit your needs.

Page 10: Html 5 & css3 frameworks for mobile application development

Physical Address:

5431 Woodland Boulevard,

Suite B, Oxon Hill,

MD 20745 USA

Email Address:

[email protected]

Website Address:

http://icoderzsolutions.com

Contact Us:

Page 11: Html 5 & css3 frameworks for mobile application development