TOAST.UI: Free, Open-source Interactive JavaScript application components

While working on a project, I need a calendar library. As I do for every project, I tend to not use previously used libraries and try to learn and use something new.

That's how I found Toast.ui, an open-source features-rich UI library for building production-ready apps.

What does Toast.ui offer?

Toast.ui offers complete applications and separate application-based components that you can use.

Applications

1- Calendar

Calendar: A fully customizable calendar library with multiple calendar views, drag-and-drop, and resizing options. Unlike other similar free and open-source libraries, Toast.ui calendar offers a reactive in-line events' creation, editing, and deletion without breaking a sweat. The calendar library comes with built-in popups support.

2- Charts

Toast.ui offers multiple chart types and developer-friendly API.

Toast.ui available charts:

  1. Line, column, bar charts
  2. Bullet
  3. Box Plot
  4. Treemap
  5. Heatmap
  6. Scatter
  7. Bubble
  8. Radar
  9. Pie
  10. Line Area
  11. Line Scatter
  12. Column Line
  13. Nested Pie
  14. Radial Bar
  15. Gauge

3- Editor

Toast.ui Editor is a highly configurable WYSIWYG and Markdown editor that you can embed easily in your web app. It comes in three editions: a plain JavaScript edition, a React edition, and a Vue edition. Furthermore, you can extend it with plugins.Toast.UI editor offers a live preview, scroll sync, and built-in syntax highlighting. It also supports multi-languages, widgets, tables, image upload, Markdown/ HTML mode switch, and dark mode.

3- Grid: a dynamic data table.

Toast.UI Grids offers a highly dynamic data table that helps you to display, filter, search, sort, and edit your dynamic data. The Grid also comes with full JavaScript support, and Vue and React component wrapper.

Here are some of its cool features:

  1. Full customizable Multi-column header
  2. Relational structure between columns
  3. Different data sources
  4. Tree data representation
  5. Keyboard navigation
  6. Multiple input fields for cells
  7. Built-in pagination
  8. Pinned column
  9. Data validation
  10. Cell merging
  11. Customizable styles

4- Image Editor

Toast.ui is a full embedded web-based image editor with full support for almost all images manipulation through your browser. It is a lightweight script that I tested and didn't cause any problem or issues with Google Chrome and Mozilla Firefox.

Components

  1. Color picker
  2. Autocomplete
  3. App loader
  4. Context menu
  5. Date Picker
  6. Rolling
  7. Select box
  8. Time picker
  9. Tree
  10. Pagination

You can use Toast.ui libraries independently in your project, I use the calendar and the grid separately with some Meteor projects, which work like a charm. Some libraries offer Vue and React editions.

Resources