WEBIX JAVASCRIPT LIBRARY BLOG

UI development best practices, front-end programming tips and news to speed up your Web development.

Follow us:

Write for us: learn about our guest posts guidelines.

Real-time Web Applications with Examples by Webix UI and Firebase Tools

Firebase is a back-end service that allows you to store and synchronize data quickly. All you need to do is to focus on your data and Firebase will do the rest.

Webix, in its turn, provides a wide variety of components that you can use for building a user interface, from simple inputs to complex components, such as datatable, scheduler or spreadsheet, and even accessible UI components.

image15

Real-time firebase apps allow users to get new information as soon as it is published. There’s no need in reloading. New data appears on the screen right after the update. This functionality can be used for demonstrating real-time changes in the form of different types of charts, for example.

In this article we’ll learn the basics of building real-time web applications with Webix UI and Firebase by Google.

Exploring Types of Charts

Struggling for the correct data visualization? That’s the challenge! Catchy and informative charts immediately win the hearts of analysts and customers, that’s why Webix offers… let me count… 14 different types of charts with 2 functional variations alongside with 2 chart-like widgets for specific use cases.

Yep, diversity makes lives brighter while the choice becomes more difficult. You have to select the right chart for your application as carefully as you choose a Christmas gift for your best friend. The article below can guide you to the ultimate tool.
14 types of charts and how to use them in JavaScript

Life is not on Instagram, let us choose Organogram

I remember my school years and those long evenings spent by painting a family tree. It was the first time in life when I faced the inevitable consequences of a poorly planned work – the sheet of paper unexpectedly came to an end and I had to redraw the scheme from the very beginning. That was a fail!

Organogram

 

Time has passed and new technologies stepped into our lives offering a number of tools for that trivial task. I also saw that the big world is built around the same hierarchical schemes used everywhere: from simple IT org charts to multi-department companies’ hierarchy.

And although there’s a number of tools for manual drawing of organograms, drawing itself is no longer needed. Now I can simply pass the data into a cute Webix organogram widget and feast my eyes upon the ready-made chart in the browser!

No magic, just code (and Webix Pro):

Ace Editor for Webix UI

Ace is a handy JavaScript code editor. It combines the possibilities and behavior of popular editors like Sublime, Vim and TextMate. Ace is maintained as the primary editor for Cloud9 IDE and is the successor of the Mozilla Skywriter (Bespin) project. You can build Ace into your web page or app with ease.

And now it is possible to use Ace Editor with Webix UI.

Using Webix with Ace code editor

1 2 3 4 5