Ext JS to React: Class Instantiation and Code Style

  • Ext JS components are really just JavaScript functions which allow you to use the keyword: – – This means each class is native JavaScript.
  • Meaning, JSX enables you to outline not only the HTML and React component structure, but also call other JavaScript functions or even execute code statements right from within the JSX body.
  • Here is an example functional React component: – – This code sample highlights one of the major differences between Ext JS and React.
  • JSX is a very common strategy when creating React components.
  • Instead, each component is instantiated by React itself when you include the component class in returned JSX (i.e. in the example above).

React enjoys the benefits of the latest ECMAScript conventions (with some transpiling magic from Babel) along with JSX syntax. In the following sections, we will look at how Ext JS components are instantiated along with how a functional component is used in a React app. We’ll also review common coding styles that differ between the two ecosystems. Just a note before we proceed, this blog post aims to discuss how React components are created and used, but doesn’t wade into the various ways components may be defined initially. We’ll dedicate our next blog post in the series to the topic of defining React components.
Continue reading “Ext JS to React: Class Instantiation and Code Style”