ExtReact - An Overview - WalkingTree Technologies

0 5

By Jay Ahuja Sencha ExtReact October 30, 2018

Many of us may have heard about ExtReact, but might not have dig deep to understand what exactly it is. In this article, I will be covering the 5Ws of ExtReact, which will help us to get a better understanding of ExtReact.

What is ExtReact?

ExtReact is the most complete set of professionally tested and commercially supported React components for developers to use in creating visually stunning applications on the desktop and mobile devices.

It also includes plugins for Webpack and Babel 7 to optimize your applications builds, and also have theming tools to give designers and developers complete control over their applications.

Who Developed ExtReact?

ExtReact is the latest release of Sencha. The developers who already have an Ext JS license version can use Ext JS components in React by using the github Extjs-reactor npm package on GitHub (which is governed by the MIT license).

When it was released?

ExtReact was release on May 2017 by Sencha. The latest version ExtReact is 6.6.1, which was announced in early September 2018.

Why ExtReact?

As you may know, React is a popular JavaScript framework that offers a component-based approach in building web apps. However, it does not include any pre-built components.

Many developers require trees, menus, grids, charts, and other components in their applications to deliver the functionalities for the end users.

Building robust, beautiful components that perform well on all devices and platforms, is a time-consuming and costly exercise. To support and sustain those components over the lifecycle of applications, as browsers and language standards evolve during time adds even more work.

React developers have the choice of either build these components from scratch or getting them from the community. As we know, the React community has a large number of contributors, so there are many pre-built components available. Using predefined components from the open source community has some underlying risks and challenges. Moreover, as React keep updating, some libraries may become incompatible while others may require the updated version. Managing 10 or 15 different libraries for a component can be the worst dream.

The best way to reduce this worry is to get as many of the components from as fewer libraries as possible. It gives you the most complete set of components for your react application in a single commercially supported, and professionally maintained package.

Let us have a look at what’s inside.

Where to use?

To develop a single application which works on the web, tablet, and mobile seamlessly, ExtReact appears to be the best fit. Layout management system ensures that the application looks attractive across the devices, including the desktop, tablet, and smartphone. It ensures that the end user of the application gets the best experience on every screen at all the time.

Components List

It offers more than 115 pre-built UI components that are wholly supported and designed to interact and work together seamlessly over the lifetime of the application. Below are a few of them:

- Grid: It’s the component which handles millions of records and provides other functionalities such as grouping, in row edit, cell edit, sorting and many more actions.

- Pivot Grid: Add powerful analytics functionality to React applications – allowing users to summarize and analyze data to make more informed decisions.

- Exporter: Help developers export data from the standard grid or Pivot Grid to a wide variety of common formats including XLSX, XML, CSV, TSV, and HTML.

- Layouts: Helps in proper sizing and positioning of all components with the powerful and flexible layout of the application

- Charts: Used to represent data with a broad range of dynamic and static charts — including line, bar, and pie charts.

- Forms and Form Validation: Makes it easy for developers to add login, checkout, register, contact, rating forms and more to their web application. It also ensures the integrity of the data.

- Calendar: Developers can add an elegant calendar to their web applications so users can easily view and manage schedules and events within the application.

Buttons, Tabs, Menus and Panels: Enable organizations to add simple or elegant components to their applications quickly and easily.

Benefits

It enables developers to offer their application’s users a great experience. They will be able to add sophisticated components for data analytics and data visualization which are critical as web apps are becoming more data intensive.