Tag Archives | JavaScript

Notes from Feb 25th Web Dev Meeting: Brian Cardarella on Ember.js

The Portsmouth Web Dev meetup is hosted at Alpha Loft in Portsmouth. This month there were two meetings: Ember on the 25th and Lightning talks on the 26th. On the 25th was the first, with Brian Cardarella of dockyard.com giving the main presentation on Ember.js.

Brian started with a bit of a history lesson. Ember spun off of SproutCore from Strobe. SproutCore 1.0 suffered from the slow (at the time) JavaScript runtimes and overly-complex UI widgets, resulting in a poor user experience. The 2.0 branch was started and Yehuda Katz (core contributor, Rails, jQuery and more) and Carl ??? and pushed off UI elements to focus on the core and on speed.

The run loop is the core event loop engine of Ember, and code in Ember can enqueue new items onto the loop, which continues to loop as long as there are items to be processed. There is great documentation in the Ember Guides, and a good video overview. Brian suggests that the Ember Starter Kit is just that, a good way to get started, but likely not appropriately robust for a professional application.

Enough background, we jumped into http://ember.jsbin.com/ and Brian commenced live coding in Ember to demonstrate how the Ember application essentially hooks into the body tag of the DOM and can read and write elements from there. He showed how actions could be triggered by observed changes, that setters and getters were required for property manipulation.

Ember has its own form of MVC (doesn’t everything?) where Models are business rules containers, and Controllers are contexts in which your interactions with models occurs, essentially acting as proxies. Views are nearly becoming deprecated as their functionality is being replaced with HTML5 Web Components (there’s currently a polyfill for these called polymer.) Routes are similar to Rails with nesting. URLs can be considered a state manager for an Ember app, so two users see the same thing at the same URL, unlike some other JS frameworks. There is an Ember Inspector for Chrome and FireFox that allows you to dive deep into the View Tree, Routes and Data for debugging. Excellent peer support is available on IRC at emberjs and emberjs-dev.

Brian and Dockyard have built Ember-AppKit-Rails as a gem to create a shared directory for an Ember app and its Rails backend. Note this is Very Beta, Somewhat Experimental and may be abandoned. You have been warned. Brian explained there are not yet any Best Practices worked out, so different attempts have been tried. Side-by-side projects where the two are separate may turn out to be a better design; Brian is looking at Ember AppKit [Update: Deprecated, but URL updated for reference]. Ember is designed to deal with different backends, depending on their API syntax. The one he was using was ActiveModelAdaptor, build to work with Rails.

An excellent question on “Where do you do validation?” And the answer: pretty much everywhere. Brian is the author of ClientSideValidations and has some experience with this. He tried something similar with Ember but points out that the context of the front end and backends can be so different that the validations aren’t necessarily the same.

Brian then proceeded to do a demonstration of an under-development project by Dockyard and even in its early stages, it appeared pretty promising.

Brian recommended downloading Ember, reading through the Guides, and taking some time to learn the components. Promises are a key element to the Ember framework and are worth reviewing; ECMAScript 6 will have promises built in. Handlebars, the templating language, is expected to be replaced by HTMLBars in the next major revision. Best practices and calling conventions (especially error/exception/validation handling) are still up in the air; check out JSONAPI.org for some work on this front.

So, we had an action-packed, fact-filled, acronym-filled session with a lot of good material and an excellent overview of the state of Ember and its promising future. Thanks for Brian for speaking and for Josh Cyr, Alpha Loft proprietor, for hosting!

0

Notes from Ruby SIG, 16-Aug-2010

The New Hampshire Ruby/Rails group met as usual on the 3rd Monday of the month. We met at the New Hampshire Innovation Commercialization Center, a new space near the Pease airfield. Mark Galvin, NHICC’s Managing Director, was kind enough to offer the space for our meeting and tell us about the ICC. Eleven members attended the meeting.

As we often do, we started with a round of introductions. It’s always interesting to find out who’s there and what they’re up to. I mentioned the GNHLUG calendar and Nick plugged the upcoming Rails Rumble. Near the end of the meeting, we plugged the NorthEast RailsCamp, coming up on it’s third meeting, this one in Stowe, VT. 5 alums from previous camps were there, and all loved it. There may still be a ticket or two left, even though the site says zero – you’d better hurry!

We were lucky enough to have two presentations tonight.

Brian Turnbull presented “Interfacing Ruby with C.” He explained he needed to do some automation with a “black box” his company was using, and their documentation consisted of a C API and a DLL. Rather than developing an entire application in C, he used Ruby to interface to the C API and then could develop an easy-to-modify Ruby app. That turned out to be a good idea, as the final product he delivered turned out to be very different from the initial request, and having the ability to rapidly re-develop in Ruby was a success. To show us how to use C to access Ruby and vice-versa, Brian used a simple example of a “leaky bucket stack,” a fixed-length stack that would lose the oldest item as the stack was pushed. It was a great example in that it had enough complex behavior to be useful, while simple enough to explain and translate into C without too much effort. First, we reviewed the pure Ruby implementation. Brian proceeded to build up the equivalent code in C, calling Ruby array functionality and data types where appropriate. He then showed how to configure the C extension from from Ruby, build, compile, debug and run from the ruby command line.

See the example code and slides (I’ll update the URL when available). Also http://github.com/bturnbull/padpaws for his more advanced C example.

Brian Cardarella, @bcardarella, http://bcardarella.com, presented his gem, client-side validation, which he developed while working on the “Raise Your Vote” site for the Democratic National Committee. The Raise Your Vote site is intended to assist in voter registration by collecting data online and generating matching PDFs of the voter application. Naturally, 50 states have fifty different forms, with different requirements. He wanted to avoid duplicating the server-side validations with hand-maintained client side code, as the regular changing of requirements and the difficulty of keeping business rules in synch across the two languages would doom the project. He wrote client-cisde_validations to use the declarative validations within the entity models to generate the equivalent Javascript code. Client-side_validations has remarkable depth and breadth, handling nearly all of the common and exceptional types of valiation (Brian notes the few difficult cases in his slides). You can find the code on GitHub (gem code, examples) and the slides here: client_side_validations.pdf

Thanks to Brian Cardarella for travelling all the way to Portsmouth and thanks to both Brians for their fine presentations. Thanks to Nick Plante and Brian Turnbull for organizing and promoting the meeting and the group. And thanks to Mark Galvin and the New Hampshire Innovation Commercialization Center for providing the fine facilities!

0

Visibone, a source of great reference guides and online utilities

Visibone's Everything Book
One of my favorite tools for the past couple of years has been a web developer’s reference guide from Visibone. The book has rarely left my desk, within arm’s reach, to help out when I just can’t remember all the options for an HTML tag or a CSS style. While there are some great online references, having it all in a couple sheets of paper makes it easy to find what I’m looking for (especially if I couldn’t remember if it was text-something or font-mumble) and the reference has also let me browse around the dusty corners and learn something I didn’t know.

Recently, I did some web development using XHTML 1.1 and CSS 2.1 and realized my 2004 version of the guide was getting out of date. I was pleased to see many of the pages had been updated to a 2009 version. After reviewing the many options, I chose to go all in and bought the Everything Book, a step up from my earlier version. This one includes cheatsheets for PHP, MySQL, JavaScript, DOM, HTML, CSS, HTML special characters, web colors and a great index. The reference not only includes broad coverage of each topic but many side notes and compatibility guides (for CSS, the IE-Netscape-Opera-FireFox-Safari compatibility color coding is tremendously useful!)

There are a number of bonus references available on the Visibone site at no cost. Check out the color lab, the color swatches for many of the common graphics programs, the online color codes reference, and excerpts from all of the various reference materials. In addition to reference book, Visibone offers posters, charts and mouse pads. The web site is worth a visit; it’s charmingly quirky, retro, opinionated and clearly individualistic.

0

Notes from New Hampshire Ruby User Group, 25 June 2009: Pat Allen, Thinking Sphinx and Casey Rosenthal SASSiJS

Twelve people attended the June meeting of the New Hampshire Ruby / Rails User Group , held on the 4th Thursday of the month ( we usually meet on the 3rd Thursday) at RMC Research in Portsmouth (Thanks to RMC and to John for hosting the meeting!)

Nick Plante was our master of ceremonies. As is the custom, we made a round of introductions to find out the most of the folks were “from away.”

Pat Allen put on the first presentation, on Thinking Sphinx. Thinking Sphinx is a Ruby library (not just for Rails) that allows Ruby applications to work with the Sphinx full-text search engine. Pat presented a slightly shortened version of the presentation he gave at RailsConf, and the presentation was clear, engaging and interesting. Participants had lots of questions to ask on search technology, word stemming, project status, what it’s like to be a Freelancing God, what being the lead on a popular Open Source project is like, what’s a kilometer, and more, and Pat’s answers were insightful. Check out (pun intended) the source on github, the support on Google Groups and Pat’s guide to using Thinking Sphinx on Peepcode.

Pat also took a moment out to plug his upcoming Rails Camp, a not-going-to-make-a-profit weekend get-together in BarCamp/Unconference format for 30-ish people at Bryant Pond, Maine. It sounds like a great event and a nice location and a price that can’t be beat: $120 for 3-nights, 3-days food, lodging and conference. Get details and consider signing up at http://railscamps.com/#ne_july_2009

Casey Rosenthal asked us, “What are style sheets for?” a number of times during his presentation, for good reason. Casey talked about SASS, Syntactically Awesome Style Sheets, a part of HAML and his reimplementation of SASS in Javascript, SASSiJS, sounds like “sausages” leading to all kinds of predictable jokes. But the topic was thoughtful, intriguing, interesting, and controversial. SASSiJS actually allows a .sass file to be downloaded as part of the HTML file, with similar syntax to a stylesheet link, and a JavaScript file that interprets the .sass file into CSS and applies it to the HTML document. Discussion was far-ranging and insightful: “What’s this good for?” “Would designers use this to make their CSS DRY?” View the source on GitHub at http://github.com/clr/sassijs/tree/master.

Thanks to Pat and Casey for their great presentations, to Nick for organizing, and to John and RMC for the facilities.

1

Continuous Learning Curve: Javascript

I’ve avoided spending too much time delving into Javascript. My four-year switch from Windows-uber-alles (including VFP, VSS, SQL Server, Ingres, Oracle, HTML, OLE, ODBC, SCC, COM, XML, MCSE, MCSD, XSLT, DCOM, RSS, MS Office, Exchange, MAPI Bad, SMTP Good, MVP and more acronyms!) to Linux-Apache-MySQL-Postgres-PHP-Python-Ruby, not to mention XHTML, CSS, bash, Smarty, Django, TWiki, dojo, et al had kept me busy enough. But a new client assignment needs a highly-interactive web site and dropping in great big globs of someone else’s Javascript is not going to solve all the problems; at a minimum, I’ve got to be able to read it, debug it and tune it for the client’s particular needs.

Did you know that a limited version of Safari, the O’Reilly online library, is included with a membership to the Association of Computing Machinery? I’ve been an ACM member for years and been meaning to get around to trying this out. My Javascript studies seemed the perfect occasion. I’m reading Shelley Power’s Learning Javascript online and getting quite a bit out of it. I love when you settle down with a book and start going “Oh, is that what that meant?” or “Now I get it!”

0

Check out NetVibes!

In searching for Prototype Windows and related JavaScript libraries to let us create portlets for a portal, we’ve run into a couple of pretty impressive contestants. The most recent is NetVibes, which appears to be both the name of the web site (“Build your own portal!” “Share it with your friends!”) and the underlying libraries and Universal Widget API specification. Very slick web site, very slick GUI libraries!

0

Should you buy software from a web-storefront-only operation?

A client had a demo web site developed by someone else and they were really excited about the interactivity. It was a very rich client application, with drag-and-drop and sizers and interactive widgets. The client wanted my team to use the same platform, which they thought was something-Dot-Net. Once we were finally able to chase down the developer, it turned out to be a commercial Javascript library. We looked up the vendor, and it is a curious site.

They have an online store, one of those generic things with box-shots of a product that’s download only (there must be an add-on for Photoshop or GIMP to make these fake boxes, don’t you think?), an “About Us” page that has the usual mission-statement-ish stuff, but no “Who We Are” or where they are, a “Customer Support” page that lets you submit a ticket online, no history, no searching. The only contacts are email addresses (generic, “marketing,” “legal,” “info” not “bobsmith@example.com”) and an 800-number I have no doubt is an answering service. There’s no online forum. It looks like no one’s home.

Searching about them in Google, there’s their web site, of course. There are a couple of mentions about XSS (cross-site scripting) and a few other exploits posted to the usual security sites, a good sign that someone is actually using the code. A couple of echos of their press releases. And… nothing. No user communities, either a forum on their web site or an ad-hoc third party set of posts. No additional information. No one posting anything, anywhere from @example.com. This is pretty strange.

So, what’s the deal? My best guess is that this is an off-shore operation without any US representation nor tech support, perhaps even no ability to provide support in English. Between a proprietary license and questionable support, I’ve recommended we do some more research and see if some of the open source or openly-available Javascript libraries can fulfill the client’s needs.

3

Powered by WordPress. Designed by Woo Themes

This work by Ted Roche is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 United States.