Code Style Guide about alloy-ui HOT 7 CLOSED

Hi Zeno,
I totally agree. We actually have a very consistent pattern in Liferay
(this is documented on our internal wiki), and ideally it would be the same
across the board (that way developers don't have to learn two types of
formatting).

Do you know of any tools that help enforce different coding standards?

Thanks Zeno,

Nate Cavanaugh

Director of UI Engineering
Liferay, Inc.
Enterprise. Open Source. For life

On Thu, Aug 9, 2012 at 7:29 PM, Zeno Rocha [email protected] wrote:

We need to define a code style for the project. I've seen a mix between
tabs vs spaces, for example.

Some consolidated definitions:

• Idiomatic JS https://github.com/rwldrn/idiomatic.js/
• Idiomatic CSS https://github.com/necolas/idiomatic-css/
• jQuery Core Style Guidelineshttp://docs.jquery.com/JQuery_Core_Style_Guidelines
• Dojo Style Guide http://dojotoolkit.org/community/styleGuide
• Google JavaScript Guidehttp://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml

Maybe we could follow the YUI's code style (if it exists).

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/12.

from alloy-ui.

I recommend Google Closure style guide with few exceptions, for instance, the underscore on private members in the end of the name.

I have been using this style on my components and personal projects and seems to be very close to what we have in Alloy/Liferay.

http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml

from alloy-ui.

Nice!

I don't know any tools that can help us detecting different coding standards, but I'll see if I can find one.

from alloy-ui.

While I was writing examples for alloyui.com, I remembered how important this Code Style Guide is and because of that I returned to this issue again.

Well, I made some research and I think I finally found a solution.

YUI-Lint, a new project from YUI Team that offers a set of configurations to use with JSLint.

The good thing about this is:

1. It's written in NodeJS, so we can easily integrate with Shifter (alloy-ui) or Docpad (alloyui.com)
2. We are not going to have just a document that declares our rules
3. Instead we are going to have a tool that can be attached to our code editors to automate the process of verifying if that piece of code follows our rules or not

What do you think?

from alloy-ui.

Just added it to the alloyui.com repository.

https://github.com/zenorocha/alloyui.com#jshint

from alloy-ui.

+1 for Shifter and JsLint.

from alloy-ui.

http://alloyui.com/tutorials/

NIT PICKING ALERT

The current indentation is somewhat maddening, and note the function (Y) vs function(Y).

YUI().use(
  'node',
  'transition',
  function (Y) {
    Y.one('.aui-btn').on(
      'click', function() {
        this.transition(
          {
            width: '500px'
          }
        );
      }
    );
  }
);

YUI().use(
  'aui-carousel',
  function(Y) {
    new Y.Carousel(
      {
        contentBox: '#myCarousel',
      }
    ).render();
  }
);

from alloy-ui.