10 Fresh and Handy Tools for Developers

Designing and developing a website can certainly be a tedious and time-consuming task, especially if the project involves new challenges, where the designer embarks into unknown territory. Moreover, time is one of the primary factors where productivity is concerned. Being able to work within an efficient manner enables a designer or developer ways by which to deliver desired results to their prospective clients.

There are certain steps which can be repeated for various projects. Some of these steps are well known and can make production time as quick as possible in order to have more freedom to experiment with new solutions.

For this article we would like to present our readers with a collection of tools which will make your standard workflow as fast and practical as possible, so that you have more time for the exciting parts of your project.

1. Pure CSS and Simplistic Loader/Spinner

Loader/spinner icons are a part of almost any web project that involves ajax requests. Lea Verou, an inspiring web designer has recently shared a simplistic solution to create a spinner with pure CSS. There are already other solutions but this one is the cleanest of them all,uses only 2 elements and not much of CSS. Everything is sized with ems, so it can be resized however preferred, it works on all modern browsers and has a fallback text for others.

2. Ionic

Ionic is the open source HTML5 Mobile Framework for building amazing, cross-platform native apps with HTML, JavaScript, and CSS. Ionic is free and open source, built with Sass and optimized for AngularJS. It is modeled off of popular native mobile development SDKs, making it easy to understand for anyone that has built a native app for iOS or Android. The framework ships with SASS and various AngularJS extensions(optional) and many components like buttons, toggle, header/footer, tab bar and more.

3. Martini

Martini is a powerful package for quickly writing modular web applications/services in Golang. Martini makes web development with Go much easier. It has a flexible routing layer, comes with a set of stock middleware, and can leverage open source web packages built in Go, Modular design – Easy to add functionality, easy to rip stuff out, and lots of good handlers/middlewares to use.

4. Animatorn

Animatron is an online, simple tool that lets you create stunning HTML5 animations and interactive content right in your browser. It lets you collaborate with other users, import artwork, create custom shapes, draw directly within the tool, and much more.

5. UUhistle

UUhistle.org is a program visualization tool for beginner programming education. Use UUhistle.org to improve your code-tracing skills, as well as your understanding of programming concepts and programming-language constructs.

6. DynoSRC

DynoSRC is a module for Nodejs apps that enables us to minimize HTTP requests by removing the need to serve JavaScript files. The library loads the JavaScript files inline in HTML and stores them with localStorage so that they won’t be re-requested until a change happens. And, if the contents of a JavaScript file is changed, only the changes are served which is again a gain in the file size. Also, it is possible to serve DynoSRC itself inline and no requests will be made for JS files.

7. AbsurdJS

There are popular CSS preprocessors like Less or Sass which are written with a custom syntax (and compiled to CSS with JavaScript or scripting languages). AbsurdJS is another preprocessor which supports both HTML + CSS and written in JavaScript. It is available for Nodejs + the browser and has the advantage of providing an already-popular syntax: JavaScript. Just like other pre-processors, it can be only used to generate the CSS file or as JavaScript to make use of variables and any other dynamic features.

8. Parsedown PHP

Markdown is a widely used HTML markup language which is easier to write for non-HTML users. And, it is mostly preferred in discussions-based UIs (comments, forums..). Once a Markdown input is stored, it should be formatted to HTML for displaying it and Parsedown PHP does nicely. The parser divides texts into blocks, looks how they start + relate to each other and looks for special characters to identify inline elements. It is fast, stable and very easy to implement.

9. Node.app

Node.app is Node.js for iOS. It enables maximum code reuse and rapid innovation using this low-footprint, Node.js-compatible JavaScript API for your mobile apps. Your customers won’t even notice you aren’t developing native, unless you tell them. With Node.app you are using the same fast system functions just as with normal iOS code.
In tens of thousands of modules there’s a module for nearly everything you can imagine. The Node.js-compatible API allows you to use virtually every module available through npm. Node.app provides the familiar Node.js API which is well documented and extremely easy to use.

10. Kalei Styleguide

Kalei Styleguide is a project that can auto-generate such (Bootstrap-like) style-guides from the “live” CSS files so it is always up-to-date. It works on the client-side and uses the comments in stylesheets for creating the titles + navigation. Simply, it is a less-effort, almost instant generator that enables us to get organized with our stylesheets.

Feedback 1 Comment

[…] 10 Fresh and Handy Tools for Developers – a collection of tools which will make your standard workflow as fast and practical as possible, so that you have more time for the exciting parts of your project. […]