Channels ▼
RSS

JVM Languages

Hone Your Web Client Skills


JavaScript is stronger than ever on the client side, and it's gaining ground on the server side, too, with technologies such as Node.js. Meanwhile, HTML5 is reviving HTML, and CSS gets more powerful every day.It makes the Web's client side look like a good investment today.

Looking out a couple years, two factors will be key to software development: The explosion of mobile and the change in the development paradigm bought by Windows 8 and Metro.

When I first heard "mobile is the future" in 1999, it looked like the mobile explosion would happen within five years. It's taken longer and has come through native applications for smartphones rather than mobile-optimized websites. And developer-to-consumer applications have done more to drive mobile than business-to-consumer and business-to-business solutions. But mobile has finally arrived.

An effective mobile strategy must deliver applications to one or more mobile platforms. Each platform has its own software development kit and programming language, and requires developers to gain new skills and master new tools.

HTML5 and JavaScript provide an excellent shortcut to mobile development. Tools such as Adobe Phone Gap let you use HTML, JavaScript, and CSS skills to create a mobile app and adapt it to work like a native application on a variety of mobile platforms. This is a good approach for two reasons: The wide availability of Web skills and the excellent HTML5 support that mobile browsers provide. So if you get up to speed on Web technologies, you'll find you're also quite productive with mobile apps.

Windows 8 Development

Using JavaScript to create Windows applications isn't completely new. A decade ago, the .NET platform came with native support for JScript as a programming language. At that time, however, JScript was used principally to glue together Windows client and server apps. In Windows 8, the HTML5/CSS/JavaScript triad can be leveraged to build native apps in quite a different way. It's one thing to use a Java Script dialect like managed JScript to compose a Windows user interface and backend logic; with Windows 8, you use the Web metaphor to build both a UI and the behavior.

Windows 8 will offer several ways to build applications. The simplest is based on C# and XAML. The high-performance approach uses C++ and XAML and places direct calls to the underlying WinRT system, Windows 8's new runtime system. With the Web-based approach, applications use HTML5, CSS, and JavaScript, and leverage the Windows Library for the Java Script (WinJS) framework to access native functionalities of the underlying platform.

WinJS is a library of CSS and JavaScript files, and it contains JavaScript objects that address the needs of Metro apps. It has controls for building a native user interface and experience, plus facilities for storage, networking, data binding, navigation, and application lifecycle.

All WinJS objects are related to underlying WinRT objects inthe same way .NET Framework classes are bound to underlying WinRT objects when you use C# to write a Windows 8 Metro application. WinRT is exposed to developers through several programming paradigms. One of these is the Web paradigm, which you can use with HTML5, CSS, and JavaScript to build full Windows 8 applications.

There's a common architectural thread that unites mobile and Windows 8 applications written with a Web-like approach. The Web engine — be it on a server, a desktop, or a mobile device — takes care of HTML/CSS for the user interface, and JavaScript code glues together underlying objects and implements the desired behavior. However you look at it, client-side Web skills are going to be important for a long time.


Dino Esposito is a frequent contributor to Dr. Dobb's. His most recent book, Programming Microsoft ASP.NET MVC was published by Microsoft Press.


Related Reading


More Insights






Currently we allow the following HTML tags in comments:

Single tags

These tags can be used alone and don't need an ending tag.

<br> Defines a single line break

<hr> Defines a horizontal line

Matching tags

These require an ending tag - e.g. <i>italic text</i>

<a> Defines an anchor

<b> Defines bold text

<big> Defines big text

<blockquote> Defines a long quotation

<caption> Defines a table caption

<cite> Defines a citation

<code> Defines computer code text

<em> Defines emphasized text

<fieldset> Defines a border around elements in a form

<h1> This is heading 1

<h2> This is heading 2

<h3> This is heading 3

<h4> This is heading 4

<h5> This is heading 5

<h6> This is heading 6

<i> Defines italic text

<p> Defines a paragraph

<pre> Defines preformatted text

<q> Defines a short quotation

<samp> Defines sample computer code text

<small> Defines small text

<span> Defines a section in a document

<s> Defines strikethrough text

<strike> Defines strikethrough text

<strong> Defines strong text

<sub> Defines subscripted text

<sup> Defines superscripted text

<u> Defines underlined text

Dr. Dobb's encourages readers to engage in spirited, healthy debate, including taking us to task. However, Dr. Dobb's moderates all comments posted to our site, and reserves the right to modify or remove any content that it determines to be derogatory, offensive, inflammatory, vulgar, irrelevant/off-topic, racist or obvious marketing or spam. Dr. Dobb's further reserves the right to disable the profile of any commenter participating in said activities.

 
Disqus Tips To upload an avatar photo, first complete your Disqus profile. | View the list of supported HTML tags you can use to style comments. | Please read our commenting policy.
 

Video