X

Geertjan's Blog

  • July 14, 2016

JSX in NetBeans IDE 8.2

Geertjan Wielenga
Product Manager

JSX is a XML-like syntax extension to ECMAScript without any defined semantics. Many more details about it can be found here:

https://facebook.github.io/jsx/

JSX is popular in the React community which "recommend[s] using JSX because it is a concise and familiar syntax for defining tree structures with attributes. It's more familiar for casual developers such as designers." Many more details about that can be found here:

https://facebook.github.io/react/docs/jsx-in-depth.html

Many NetBeans IDE users have been asking for JSX support in NetBeans IDE, since they are using React:

https://netbeans.org/bugzilla/show_bug.cgi?id=250778

As you can see from the above, the NetBeans team has added parsing and lexing support for JSX over the past few days.

Let's take a look at the result, using this repo as an example project to try out JSX support in NetBeans IDE:

https://github.com/reactjs/react-tutorial

Here's what I see in a very (very very) recent NetBeans IDE build (click to enlarge the image):

Contrast the above to the same file opened in the current release of NetBeans IDE, i.e., NetBeans IDE 8.1, to see the difference:

Great news, isn't it? :-) At this point, don't expect extensive support for JSX or for React. However, as you can see above, at least you can now edit your files without there being error markings everywhere, which made NetBeans IDE impossible to work with when working with JSX.

Join the discussion

Comments ( 5 )
  • Thomas Thursday, July 14, 2016

    Excellent, good job!

    Can we get the same for Angular 2 views? :)


  • Saljack Friday, July 15, 2016

    I would like to syntax highlight for SQL, XML, HTML in Java strings (NamedQuery). InteliJ Idea has Language injection this is great feature.


  • Geertjan Friday, July 15, 2016
  • Saljack Friday, July 15, 2016

    I know this but there is no syntax highlight.

    If you write something like this:

    String sql = "select * from something";

    String xml = "<user>John</user>"

    There is no support or highlight for languages in strings. This feature will be very handy.


  • Stuart Wednesday, May 31, 2017
    the parsing and lexing show the error "unexpected character found "{" if you set the style attribute in the embedded jsx syntax.
Please enter your name.Please provide a valid email address.Please enter a comment.CAPTCHA challenge response provided was incorrect. Please try again.