Basically, we're looking to highlight tools that are innovative, widely used and/or wildly useful for Web developers.

jQuery and jQuery Mobile

No list of Web developer tools would be complete without jQuery, the ever-popular JavaScript library that we've covered extensively on ReadWriteHack.

Even Microsoft has made the case for jQuery and technology surveys show jQuery well in the lead for 2011, moving from 27% of sites surveyed in December 2010, to 42% in December 2011.

Mobile developers got a boost this year with the introduction of jQuery Mobile 1.0. jQuery mobile is meant to work on "every popular mobile, tablet, e-reader and even desktop" platform. That's a tall order, but the response so far to jQuery Mobile seems to be overwhelmingly positive.

That's not to say that jQuery is free of critics. Some believe that jQuery is in need of a little slimming down. Of course, this is not atypical for any project reaching maturity. I'm not taking a position either way, but I would note that you rarely see a successful project that doesn't generate a backlash of some sort.

Modernize IE with CSS3 PIE

Everbody loves pie, especially frustrated Web developers who need to cope with the shortcomings of older versions of Internet Explorer. You can't fix the market and convince millions of people to upgrade to a more modern browser, but you can try to fix the browser.

CSS3 PIE ("Progressive Internet Explorer") is meant to bring some of the spiffy CSS3 features to Internet Explorer. Want to see how it works? There's a full list of demos and plenty of documentation for getting started. Naturally, the project is on GitHub, and it's available under the GPLv2 and Apache 2 licenses.

PIE is not quite 1.0, but it's getting very close. Jason Johnston announced the fifth beta of 1.0 in September, which added IE9 support and fixed a number of minor issues in IE6 through IE8.

Bootstrap

Twitter released its Bootstrap toolkit for rapid development of Web applications in August, and it's remained one of the trending repos on GitHub ever since.

Bootstrap is pretty simple, it's just CSS that provides a standard set of solutions for things developers need for Web sites and Web apps. Developers can use Bootstrap for prototyping, or organizations can standardize on Bootstrap (as Twitter has) to provide a uniform design across a set of sites/applications.

Bootstrap is easy to use, just drop in the pre-compiled CSS into your project, or use LESS to compile a modified version.

LESS

Speaking of LESS, here's a little more on it. Ahem, sorry about that. Anyway, LESS is a dynamic stylesheet language that extends CSS to be much more expressive and easy to use.

Standard CSS doesn't support variables, functions, operators, and so on. LESS gives you the ability to do things that CSS ought to let you do. For example, LESS lets you define a color once and then use it through your stylesheet with a single variable (like @color instead of #4D6F92). The advantage, of course, is you make changes much more quickly and efficiently.

But LESS also provides the ability to define and re-use classes easily, and even use operators for proportional elements of your page with operators. If you want to check out LESS, the site has plenty of examples and source is available on GitHub under the Apache 2.0 License.

Chrome Developer Tools

Firefox's demise is has been greatly exaggerated, but it's probably no exaggeration to say that Chrome has been gobbling market share because Web developers love Google Chrome. (Or at least they hate Google Chrome less than the other Web browsers.) One of the clear reasons developers dig Chrome is the Chrome Developer Tools.

Chrome's Developer Tools are based on WebKit's Web Inspector but include a number of enhancements. The developer tools in Chrome are just a click or keystroke away, and give you the ability to do everything from edit HTML to view breakpoints in your script, perform remote debugging, and much more. The devtools also have an experimental API for those who'd like to extend the developer tools even farther.

Next page: The rest of the best Web developer tools of 2011

Andi Smith has a fantastic post on 25 secrets of the browser development tools you should look over if you spend any time at all with Chrome's developer tools, or any of the browser development tools. This post from Paul Irish is also worth checking out, and the video from Google I/O 2011: Chrome Dev Tools Reloaded.

You might also want to check out this cheat sheet from Boris Smus.

SourceKit and Ace: Top-Notch Browser-Based IDEs

Which text editor is the best for Web developers? (Or anybody editing a lot of text, for that matter.) I'd argue for Vim, hands down.

But what if you're looking for a browser-based IDE for development? Well, when we surveyed ReadWriteHack readers, they voted for Ace and Ace-based SourceKit. Ace is a standalone editor, formerly known as "Bespin" and "Skywriter." SourceKit takes Ace and turns it into a Chrome extension that taps into your Dropbox account.

Though Ace is more flexible, in that it will emulate keybindings for several popular editors (including vi), I like having SourceKit right at my fingertips in Chrome. Plus, the Dropbox connectivity is handy as well, though I do wish it was possible to limit SourceKit to one directory under my Dropbox directory. For one thing, I'd prefer not to give any application more access than strictly necessary. For another, I store a lot of stuff in Dropbox that I won't be editing and don't want to have to sort through.

This is a rapidly growing area, though, so I'd be very curious to hear what IDE or editor ReadWriteHack readers prefer.

PhoneGap

Want to write HTML5 applications, but provide similar features to native applications on mobile devices? PhoneGap seems to be far and away the most popular solution.

PhoneGap lets developers build an app once, then deploy to multiple platforms. PhoneGap supports iOS, Android, Windows Phone, BlackBerry and others. This includes webOS, but I'm not sure how much demand there's going to be for that platform in 2012.

Now we're not just talking about a mobile site that displays nice on your mobile device. PhoneGap actually provides access to hardware and native features on your phone, like the camera, accelerometer, network, geolocation, contacts and notifications. If you're targeting iOS and Android, you're not far behind native applications.

The company behind PhoneGap, Nitobi, was acquired by Adobe earlier this year. But that should be no cause for alarm. PhoneGap has been contributed to the Apache Software Foundation (ASF) and is currently in the Apache Incubator. If you haven't looked at PhoneGap yet, check out the Getting Started Guide and the video tutorial.

Popcorn and Popcorn.js

New, but noteworthy, there's Popcorn.js. Part of the Mozilla Popcorn project, it's a JavaScript library that gives you time-based, interactive media via the Web.

It's not just a way to show video without Flash, Popcorn.js actually lets you create timeline-based Web presentations. This includes HTML5 audio and video, but also rich content presentations that make use of audio, video and other Web elements.

Popcorn.js promises to integrate content from Web services like Wikipedia, Twitter, Facebook, YouTube and Google Maps. Early demos show things like integrating time-based overlays into videos, with links to content. So, for example, you could develop a video presentation that has links to more information at certain times in the video.

Right now, it's in early development and watching some of the demos in Firefox and Chrome is laggy at best. Expect it to be a while before the Web explodes with Popcorn presentations – but the future of Web media looks good.

The Future? Waterbear

No I don't think anybody is going to be putting this into production, but Waterbear is worth looking at because it's a good entry to programming for kids. The idea is that kids can start with a system of "draggable, snappable blocks" built with HTML5, CSS3 and JavaScript.

Developer Dethe Elza says that it's in pre-alpha and in "constant flux" right now, but here's hoping the project continues to move forward and turns into a popular system to start kids on programming. It's free software (under the Apache License 2.0) and anybody can head over to GitHub and dig in.

Your Picks?

Of course, this is a highly subjective list based on my observations from the last year. I'd love to hear from Web developers about the tools that you find most productive, exciting, useful, etc. Feel free to share your favorites in the comments, and if you see something trending that needs writing about in 2012 drop me a note.

With Appcelerator's new mobile offerings, web programmers can avoid the pitfalls of Objective-C or Java, and use basic Javascript, HTML, and CSS to build their apps.

Unlike competitor PhoneGap, Titanium claims it is better equipped to gain entry into the iPhone and Android app stores. The company believes its tools create applications that behave, look and feel identical to native iPhone applications. The idea is that Apple will be less likely to cast Titanium applications from the garden of appland after being made in the image of its predecessors.

To request access to Titanium's mobile beta fill out the form.

The service uses RESTful APIs and Open Source code libraries to handle "the tedious, annoying, difficult and troublesome parts of the development process" and offer outsourced scalability solutions.

Leading iPhone dev blog Mobile Orchard has covered complications in both the push notification feature and the store kit well. Having these tasks outsourced to a service like Urban Airship could make independent developers' lives a lot easier.

We love a good infrastructure play, but they can get complicated when it comes to a tightly controlled platform like Apple's. Last month we wrote about a mysterious and troubling trend of iPhone developers reporting rejection of their apps based on their use of the PhoneGap dev environment, a service that greatly democratizes mobile development in general. It's hard to say why but Apple appears unhappy with developers utilizing that 3rd party platform in delivery if not creation of apps.

Will Apple play nice with startups helping startups to develop on the fabulous platform that is the iPhone? We sure hope so. There's a long and rich history of web services amplifying the innovative work of developers on the web - having these kinds of services available for the iPhone as well sounds like a great way to take mobile to the next level. We'll be keeping an eye on Urban Airship.

Recently, though, Apple has been rejecting an unusual number of apps built with PhoneGap from its app store. The company's reasons don't seem clear and developers want to know what's going on. We discuss three possible explanations below, but ultimately the problem appears to come down to the tight control that Apple maintains over the app store and iPhone.

PhoneGap developer Mike Nachbaur posted an open letter to Apple on his blog last night about the issue. In this letter, Nachbaur describes a common thread seen throughout multiple rejection letters received by developers: that PhoneGap apps make use of unpermitted or 3rd party APIs, something that violates the terms of service for the app store. Nachbaur argues that such an explanation could be pointing to one of two things - that use of Apple's own controls by PhoneGap is not something the company approves of, or that 3rd party functionality similar to those that let ad networks run on iPhone apps is being rejected by Apple as a part of the core functionality of PhoneGap apps. Apps are reviewed by individuals; some individual reviewers at Apple may not be familiar with PhoneGap and thus not be clear how it works.

All of this is quite unclear and we suspect that some of these other explanations may be more accurate. It's also possible that a lot of people are using PhoneGap to build bad apps that deserve to be rejected, but let's assume that's not what's going on and consider some other possibilities.

1. PhoneGap Apps Don't Work With the Next iPhone OS

Some developers are complaining that their PhoneGap built apps work with every other version of the iPhone OS but crash when they test them on the beta 3.0 version. The latest version of that beta offered developers a very exciting new feature just this morning - push notification of new messages. That means apps will be able to send SMS style messages when something important occurs. Rumor also abounds that background applications will soon be able to run simultaneously. These sound like really big changes to the iPhone OS and the kind of thing that could make PhoneGap apps more complicated if they are tied between the OS and the browser.

PhoneGap competitor RhoMobile says their apps aren't working on the 3.0 version of the iPhone OS either, though we haven't seen any complaints about their developers getting apps rejected yet.

2. PhoneGap's Online Mode is Too Risky

PhoneGap has an "online" mode that allows developers to change their apps after they are on phones. Apple may believe that such an option is unacceptable, even though it's understood as something developers need to remove after testing and before application submission. That's a theory offered by French developer Rémy Rakic and it sounds like a possibility to us.

3. Apple May Not Want Cross-Platform Apps

The third possibility may be that Apple is rejecting PhoneGap apps because they are cross-platform and could work on Nokia phones or the forthcoming Palm Pre. Presumably many developers would choose the iPhone if they had to choose, and market share could be protected by app exclusivity. ("There's only an app for that here.") Though we think this kind of anti-competitive strategy is more likely to be a convenient result of an actual technical problem.

Whatever the reason, one issue that underlies all of the above possible explanations is that the iPhone and app store are controlled enough by Apple that apps aren't something that users can install "at your own risk." Because Apple maintains responsibility for vetting all apps, it may very well limit the technical risks that developers may take in order to innovate. From "unacceptable" content to limitations overcome only by jail-breaking to issues like the ones the PhoneGap community faces now, an absence of openness can come at a real cost for developers and users. We hope this issue gets resolved, but in the meantime, users of this service that democratizes mobile app development must be feeling discouraged.

Thanks to Jason Grigsby, co-founder of mobile app development shop CloudFour, for bringing this issue to our attention and discussing it with us.

Less than a week after a small investment in the ex-Googler founded FriendFeed put lifestreaming on a lot of peoples' maps - the entry of a Yahoo! property could be a game changer in a market full of startups.

MyBlogLog will be experimenting with different ping rates to refresh data from the other services and it isn't intended for minute-by-minute scanning, but for most people updates of their friends' activities every few hours will be more than sufficient.

Here's my profile page, if you'd like to be friends. I wish Ma.gnolia were a supported service, but more on MBL's shortcomings below.

[Story continued below screenshot]

MyBlogLog still has a ways to go before it can be as good a lifestreaming service as several others available, but it is becoming a more and more useful way to keep track of part of your community all the time.

The community view consists of the activities of people you have friended in MyBlogLog, and there's little prompting to add new friends. (Two weeks ago MyBlogLog did add XFN support, so there's certainly some standards based work going on there.) Every social app on the market, though, should look at how FriendFeed recommends friend additions, it's a very pleasing experience that's leading to really fast uptake this week.

Meanwhile, the MyBlogLog API is creeping closer to general public availability, the company says. Aggregate friend-streams, if you will (your friends' activities elsewhere in one feed), have been added to the API. When that API was first announced we said it was going to be a big deal. Tonight's overhaul of profile pages is just one more example of ways this service inside Yahoo! is quickly bringing to market technologies that a long list of startups still have behind closed beta walls. Up for sale or not, look out for the best parts of Yahoo!

]]> Discuss]]> http://www.readwriteweb.com/archives/lifestreaming_comes_to_yahoo.php http://www.readwriteweb.com/archives/lifestreaming_comes_to_yahoo.php Product Reviews Thu, 28 Feb 2008 23:58:12 -0800 Marshall Kirkpatrick