Design and Build Web Apps With React Components

Ignite UI for React is a complete library of React components for building data-rich and responsive web apps, including 60+ data charts and graphs, data grids and tables, and user interface (UI) components.

The Ignite UI CLI represents a stand-alone command-line tool that helps you build and scaffold applications for numerous frameworks. The CLI tools provide a variety of templates for your project which are pre-configured for the Ignite UI for React toolset. You can also add your own templates to the CLI to accelerate adding components to your projects.

A React component is a class that contains a reusable function which returns a template that includes a piece of user interface represented by HTML, JavaScript and CSS. Examples of React components include complex UI controls like Data Charts or Data Grids, or simple elements like DIV’s with HTML elements.

React does not have specific requirements and ways as to where your components should go or how they should be organized. This is up to developers working on the project. Here are several approaches:

• Organizing components by Type - Similar elements are systematized in the same place. React components live in a components folder. Styles, in a styles folder. And so on.
• Organizing components by Similarity - This type of organizing React components ensures that everything a component needs remains as close to the component as possible.
• Organizing components by Functional Area – Placing components by app function, like “Customer” would have all related Customer components for Customer screens/functionality.

The way in which testing React components is possible to be done falls into two general categories:

• Rendering component trees – where a hierarchical tree of React components describes the user interface and encapsulates every aspect of the application that a user sees and interacts with in their browser.
• Running a complete app – this happens in a realistic browser environment. This process is referred to as “end-to-end” tests.

• Functional components in React are simply JavaScript functions. There is no render method used here. Functional components work by accepting properties (props) as an argument and then return a React element.
• Class Components represent simple classes, consisting of functions which add functionality to your app. It requires render() method to be implanted here.

Ignite UI for React is the most complete library of enterprise-grade, React UI components available. Professionally designed and developed, Ignite UI for React provides you with everything you need to build modern, progressive web apps. All backed by Infragistics 30+ years of industry leadership and our award-winning live support.

Our React components are included as a part of our Ignite UI bundle. A single developer license starts at $1,355 USD for a one-year subscription, including one year of standard support and updates. We also offer discounts for multi-year licenses. Please refer to our Pricing page for more information on pricing.

The best place to begin is with our Getting Started Documentation.

The team at Infragistics maintains a comprehensive library of React code samples which you can access here. We also maintain a library of sample applications, which you can access here.