Building UI with Syncfusion Controls and React | Syncfusion Blogs
Live Chat Icon For mobile
Live Chat Icon
Popular Categories.NET  (172).NET Core  (29).NET MAUI  (186)Angular  (105)ASP.NET  (51)ASP.NET Core  (82)ASP.NET MVC  (89)Azure  (40)Black Friday Deal  (1)Blazor  (209)BoldSign  (12)DocIO  (24)Essential JS 2  (106)Essential Studio  (199)File Formats  (63)Flutter  (129)JavaScript  (217)Microsoft  (118)PDF  (80)Python  (1)React  (98)Streamlit  (1)Succinctly series  (131)Syncfusion  (868)TypeScript  (33)Uno Platform  (3)UWP  (4)Vue  (45)Webinar  (49)Windows Forms  (61)WinUI  (68)WPF  (155)Xamarin  (160)XlsIO  (35)Other CategoriesBarcode  (5)BI  (29)Bold BI  (8)Bold Reports  (2)Build conference  (8)Business intelligence  (55)Button  (4)C#  (145)Chart  (123)Cloud  (14)Company  (443)Dashboard  (8)Data Science  (3)Data Validation  (8)DataGrid  (62)Development  (605)Doc  (7)DockingManager  (1)eBook  (99)Enterprise  (22)Entity Framework  (5)Essential Tools  (14)Excel  (37)Extensions  (22)File Manager  (6)Gantt  (18)Gauge  (12)Git  (5)Grid  (31)HTML  (13)Installer  (2)Knockout  (2)Language  (1)LINQPad  (1)Linux  (2)M-Commerce  (1)Metro Studio  (11)Mobile  (479)Mobile MVC  (9)OLAP server  (1)Open source  (1)Orubase  (12)Partners  (21)PDF viewer  (39)Performance  (12)PHP  (2)PivotGrid  (4)Predictive Analytics  (6)Report Server  (3)Reporting  (10)Reporting / Back Office  (11)Rich Text Editor  (12)Road Map  (12)Scheduler  (52)Security  (3)SfDataGrid  (9)Silverlight  (21)Sneak Peek  (29)Solution Services  (4)Spreadsheet  (11)SQL  (10)Stock Chart  (1)Surface  (4)Tablets  (5)Theme  (12)Tips and Tricks  (112)UI  (360)Uncategorized  (68)Unix  (2)User interface  (68)Visual State Manager  (2)Visual Studio  (30)Visual Studio Code  (17)Web  (569)What's new  (311)Windows 8  (19)Windows App  (2)Windows Phone  (15)Windows Phone 7  (9)WinRT  (26)

Building User Interfaces with Syncfusion Controls and React

Syncfusion has hosted a couple webinars this year on demonstrating how to get our JavaScript library, Essential JS2, up and running in a new React project. We received a number of questions each time about our JavaScript library, and our product manager Chad Church has provided answers. Read on for a full overview of the Syncfusion global license, or visit Syncfusion’s YouTube channel to watch the webinar in full. You can view the sample projects from this webinar by downloading the sample files directly.

Q: Are these wrappers or new controls that are native React UI components?

A: These are wrappers. However, they have equivalent support compared to native implementation, including props binding, state management, custom components, and more.


Q: Can Syncfusion controls be used with web tools outside of React?

A: Yes, Essential JS 2 contains pure JavaScript controls as well as React controls, so they can be used outside of React as well.


Q: Why does it reference deprecated modules?

A: This was a bug, but it has been resolved now.


Q: Will this cover any WPF application builds, or is it only a web-based discussion?

A: This is only a web-based discussion.


Q: Is it good practice to customize Syncfusion components as needed?

A: Yes, you are welcome to do that. Our components can be customized using templates and events. Templates can be used to customize their UI appearances and events can be used to customize their behaviors.


Q: Can I create a custom component which is an abstraction of a Syncfusion component?

A: Yes, you can do this. If you need to group multiple components or you have multiple customizations for a component, such as adding templates and events, you can create a custom component and reuse it across your application.


Q: Suppose I want to add a functionality which isn’t available in a Syncfusion component. What would be the best approach: customize the component file, or create a custom component to be the wrapper around a Syncfusion component?

A: If you need new functionality that is not possible with our public APIs, it is best to create a support incident for it and get ideas from our team.


Q: Let’s say I customized a component. What will happen when I update the package in the future? My code gets overwritten, correct?

A: If you used only public APIs of EJ2 components, you would be safe. These would not be overwritten or broken.


Q: Do Syncfusion controls work on mobile devices?

A: Yes.


Q: Can your Angular/JS tools be used with the Ionic framework?

A: Yes, they can be used with Ionic.


Q: Will customization degrade app performance?

A: No, customization will not degrade performance, although incorrect usage could. If you do encounter a performance issue, please create a support incident with code samples so that we can address the problem.


Q: Is the diagram control going to be included in Essential JS 2?

A: Yes. A preview is already available in the Volume 2 release.


Q: What are the required system configurations for developing React.JS applications?

A: Node.js, npm, and any IDE.


Q: What is the purpose of webpack?

A: Webpack is for bundling script and CSS files.


Q: Will the kanban control be available, and if so when?

A: It is planned for a 2019 Volume 1 release.


Q: Is Essential JS 2 Reactive native for developing mobile support apps?

A: No, Essential JS 2 requires a web browser to render component. So, it is not supported in React natively.


Q: Will JS 2 be generally API compatible with JS 1? (Except for new features, of course.)

A: No, we don’t have API compatibility with JS 1.


Q: Will the tree grid control be available, and if so, when?

A: The tree grid control is planned for our 2018 Volume 4 release.


Q: What about the pie chart control?

A: It is already available. Please check our sample browser.


Q: Is there a navbar control? I didn’t see one in the docs.

A: Please find the documentation link here.


Q: Is there Aurelia integration?

A: Currently, we don’t have any plans for Aurelia.


If you liked this post, we think you’ll also enjoy:


This post was originally published on April 27, 2018.



Share this post:

Popular Now

Be the first to get updates

Subscribe RSS feed
Scroll To Top