A set of JavaScript tools

From time to time we publish articles about interesting and useful tools. Every day we realize different tasks, so we get to know new interesting tools. Or sometimes we find just something interesting.

JavaScript tools and more

OK, let’s take a look.

1. Creating beautiful presentations in HTML5 using reveal.js

This simple framework is am easy to use tool for creating presentations in JavaScript and HTML5. We define the individual slides that make up our whole presentation.

The library provides, among others, UI with transition effects between presentation elements.

Resources:

http://lab.hakim.se/reveal-js

https://github.com/hakimel/reveal.js/

http://mrbool.com/how-to-create-presentations-in-the-browser-with-reveal-js/27264

2. ASCIIFlow

That is a drawing tool, whereby our graphics consist of ASCII characters.

URL:

http://asciiflow.com/#Draw

ASCIIFlow tool

Fun that can be used creatively. It’s a step to ASCII Art.

3. Google Web Designer

So “Build great multi-device web experiences”. Here maybe we differ slightly from the main topic, as it’s a desktop program, but the point is what this program produces. Nevertheless, it is remarkable program to help us in the design and implementation of HTML5 pages, ready to work on a variety of devices.

Google Web Designer

URL:

http://www.google.com/webdesigner/

Docs:

https://support.google.com/webdesigner/#topic=3249465

And if we are talking about visual creating of HTML5 projects, it should be noted the tool created on the initiative of IBM and Dojo — Maqetta.

4. HTML5 jQuery Paint Plugin

A simple pain program on own website? No problem with this jQuery plugin.

5. Trees in JavaScript (jQuery)

Another JavaScript tool concerns the functionality of trees, which from time to time we have to implement in our projects. Here we have a nice solution — jsTree.

It’s a jQuery plugin with many features, such as drag & drop support, keyboard navigation, in-line management, etc.

Easy to use, for example:

// create new jsTree
$(function () { $('#jstree_demo_div').jstree(); });

// listener
$('#jstree_demo_div').on("changed.jstree", function (e, data) {
  console.log(data.selected);
});

More:

http://www.jstree.com/

Going forward, we have to also a great AJAX-based solution, which allows us to implement file browser as a tree:

http://www.abeautifulsite.net/jquery-file-tree/

Summary

That’s all for today, but it is not the last such set on the blog. I encourage you to type in comments about interesting tools that you know, you use, or have written themselves.