4

When developing with object-oriented languages like Java or C#, it's not uncommon for developers to use design tools like UML to make class diagrams, create interfaces, define major components and interactions, outline an API, etc., before beginning the implementation.

I know for most small JavaScript applications, these software engineering principles may be overkill, but if you're developing a library (jQuery, YUI) or creating a large application (Gmail, Google Docs), it's a good idea to create a design and plan ahead before you start writing any code.

Are there any similar practices used in JavaScript development or web development in general?

Edit:

Just to clarify, I'm not interested in creating classes/interfaces or making UML for JavaScript. JavaScript is a different paradigm from the likes of Java/C# and therefore needs different design tools. I'm interested in knowing what those JavaScript design tools/practices are, if any.

Maybe this question better asks what I'd like to know: If a company like Google created a large web application and had several dozen team members create it, what processes, documents, and practices would such a team use to successfully create, collaborate, and solidify a design? What tools (e.g., UML, flow charts, scribbled notes on a piece of paper) would they use to work on and share the design of the application (without writing a single line of code)?

JR.
  • 5,840
  • 9
  • 31
  • 34
  • 3
    You can apply any language agnostic design methodology to JavaScript. I tend to define my module's interfaces and develop to unit tests. you can also use libraries like underscore.js to apply high level functional abstractions. – Raynos Feb 17 '11 at 17:29

2 Answers2

8

I'm a fan of the Google Javascript Style Guide:

https://google.github.io/styleguide/javascriptguide.xml

Abdennour TOUMI
  • 87,526
  • 38
  • 249
  • 254
Matt King
  • 2,146
  • 15
  • 8
1

I think the answer depends largely on which libraries, if any, you are using client side.

Jquery code looks very different from Sencha or Sproutcore code, for example. In Sencha and Sproutcore, the framework provides you with a 'class' system for developing components, so these frameworks lend themselves to the canonical forms of design patterns.

Also note that javascript is very different then Java or C#. You can impose an interface type system on your code, but many would argue that you are killing the javascript dynamic-language awesomeness if you do.

That said, its always good to have a plan. If you can stay DRY by extending JS objects, then I think you should. And it always makes sense to put some high level design in place.

hvgotcodes
  • 118,147
  • 33
  • 203
  • 236
  • Thanks for commenting. I know that JavaScript is a different paradigm from Java/C#, which is why I don't want to use design tools that were built for object-oriented languages. However, I also don't want to scribble design notes in Notepad or a Word document. It'd be nice if there were a standard or best practice way of saying "This is the design/API that we agree on for our web application." – JR. Feb 17 '11 at 16:38
  • 2
    @zarjay, right. If it is a true RIA, then I believe you should design it. Check out my answer here to see how I designed a part of one of my apps: http://stackoverflow.com/questions/5018391/finite-state-machine-pattern-the-one-true-pattern/5018499#5018499 – hvgotcodes Feb 17 '11 at 16:47