Tutorial: Introduction


Edit this page

What is Handsontable

Handsontable is a composite spreadsheet component for apps and websites. It is written in JavaScript and not constrained by any external framework. It can be easily modified or extended with custom plugins. It also binds to any source using the JSON format and handles large amounts of data. You can easily do all CRUD operations and provide end-users with an Excel-like experience.

Take a look at this basic demo on JSFiddle for better insight.

Typical use cases

We have seen Handsontable being used in many different, sometimes completely unexpected fields. The list below is just to give you a rough idea on what you can do with Handsontable, but it doesn't limit you in any way. If you have already created an inspiring app, share it with others on our forum.

  • Database editing
  • Configuration controlling
  • Data merging
  • Workforce planning
  • Sales reporting
  • Financial analysis

Basic concepts

Handsontable introduces a new approach to building spreadsheets for web projects. Typically, libraries like this give you all the features in one, pre-built package. This is not very effective as spreadsheets are usually very complex and heavy tools, so even though you just need just a single feature, you end up with overhead code.

Handsontable is different as it allows you to exclude all the unnecessary plugins from the package. It's created with modularity in mind and most plugins are developed upon the lightweight core. Not all the features have been moved from the core to plugins yet, but we're nearly there.

Concepts or technologies at the heart of Handsontable:

  • Extensibility - it makes possible to build new functionalities upon the core and only use those required in a certain project. It gives you the real freedom of creating.
  • ECMAScript 2015 (ES6) - in the future the most important parts of the library will be rewritten to ES6 provide a better control over the code.
  • Virtual rendering - also known as "lazy loading". In a nutshell, we don't render the cells outside the viewport until you scroll down or across the table to see them. This allows to handle large datasets, some of which can contain over thousands of rows.

Free vs Pro

Handsontable Pro is a set of premium features built upon the open source core. We decided to separate these two projects to keep better transparency of the code and to be able to release fixes of the Pro version independently from our other projects.

Handsontable, as a core technology, will remain free forever. We are proud that so many people have backed us during all these years. With their help we were able to find and fix thousands of issues and make this project much better and useful.

Getting help

In general, using Handsontable doesn't require high programming skills. However, if you need any custom modifications and have just started with JavaScript you may need some assistance from a more experienced developer.

If you are new to Handsontable then begin with the Quick start page which will give you a good idea on what features this library has. You might also want to dig a bit deeper in the Basic usage section which will guide you step by step on how to create your first app.

If you get stuck with something, then the best way to ask (or answer) a question is Stackoverflow. If you find a bug, please open a new issue on GitHub. For further discussions head to our Forum and don't hesitate to share your thoughts and opinions.