wissel.net

wissel.net

Usability - Productivity - Business - The web - Singapore & Twins

A peek in my JavaScript Toolbox

Every craftsman has a toolbox, except developers: we have many. For every type of challenge we use a different box. Here's a peek into my web front-end programming collection. It works with any of your favorite backends. In no specific order:

  • AngularJS

    one of the popular data binding frameworks, created by Google engineers. With a focus on extensibility, testability and clear seperation of concerns it allows to build clean MVC style applications

  • Data Driven Documents

    short: D3JS. If anything needs to be visualized d3js can deliver. Go and check out the samples. There are a set of abstractions on top of it that make things simpler. I consider d3js the gold standard of what is possible in JS visualizations

  • Mustache

    Logicless templating for any language. I use it where I can't / wont use AngularJS' templating

  • PivotTable.js

    We love to slice and dice our data. Instead of downloading and spreadsheet processing them, I use this JavaScript library.

  • Angular-Gantt

    Timeline bound data loves gantt charts. This components makes it easy to visualize them

  • TemaSYS

    A wrapper around WebRTC. It allows to add voice and video to your application in an instant, no heavy backend required

  • prediction.io

    PredictionIO is an open source machine learning server for software developers to create predictive features, such as personalization, recommendation and content discovery. Competes with IBM's Watson

  • Workflow

    I'm not a big fan of graphical workflow editors. You end up spening lots of time drawing stuff. I'd rather let the system do the drawings
    • Sequence Diagrams
      Visualize how the flow between actors in a system flows. Great to show who did what to whom in Game of Thrones
    • JS Flowchart
      Visualize a flow with conditional branches. I contributed the ability to color code the diagram, so you can show: current path, branches not taken, current step and undecided route. (there are others)

  • Reporting

    Reports should be deeply integrated into the UI and not being standalone.

  • Card UI

    While not exactly JavaScript, designing with cards is fashionable. I like Google's material design explaining cards
    • Bootcards
      Twitter Bootstrap meets cardUI. Lots of quality details to generate a close to native experience
    • Swing
      Swipe left/right for Yes/No answers

  • Tools

    I haven't settled for an editor yet. Contestants are Geany, Eclipse (with plug-ins), Webstorm, Sublime or others. Other tools are clearer:
    • JSHint
      Check your JavaScript for good style
    • Bower
      JavaScript (and other front-end matters) dependency management. It is like mvn for front-ends
    • Grunt
      A JavaScript task runner. It does run a preview server, unit tests, package and deployment tasks. Watching its competitor Gulp closely
    • Yeoman
      Scaffolding tool to combine, grunt, bower and typical libraries
    • Cloudant
      NoSQL JSON friendly database. Works with Hood.ie for offline first and a JavaScript browser database
    • GenyMotion
      Fast Android emulator
Enjoy!

Posted by on 14 November 2014 | Comments (2) | categories: Software

Comments

  1. posted by Patrick Sawyer on Saturday 15 November 2014 AD:
    Thank you. pivottable.js is EXACTLY what I was looking for. So powerful. I am working on dropping it into an xPages application right now!
  2. posted by Patrick Sawyer on Tuesday 18 November 2014 AD:
    Stephan, Have you ever tried implementing pivottable.js into an xPage? I am trying to implement and while the component can load, filtering does a full page refresh. If I am missing something obvious please let me know. { Link }