TGViewer
Web Development Web Development @web_dev_bds · 4.44K subscribers
Post #478 1.06K
How React's ES6 syntax is different from ES5 syntax?

1. require vs. Import
// ES5
var React = require('react');

// ES6
import React from 'react';



2. exports vs. export
// ES5
module.exports = Component;

// ES6
export default Component;



3. component and function
// ES5
var MyComponent = React.createClass({
render: function() {
return(
<h3>Hello JavaTpoint</h3>
);
}
});

// ES6
class MyComponent extends React.Component {
render() {
return(
<h3>Hello Javatpoint</h3>
);
}
}



4. props
// ES5
var App = React.createClass({
propTypes: { name: React.PropTypes.string },
render: function() {
return(
<h3>Hello, {this.props.name}!</h3>
);
}
});

// ES6
class App extends React.Component {
render() {
return(
<h3>Hello, {this.props.name}!</h3>
);
}
}
  • 👍 2
More from @web_dev_bds
  1. Oct 18, 2026FullStack Development Roadmap
  2. Oct 17, 2026Strong opinion: You shouldn't write Server Actions that take FormData as an argument. They…
  3. Oct 16, 2026📕Random React Tip: If you want to quickly log things from JSX (we've all been there), you…
  4. Oct 15, 2026Websites to Learn Every Technology
  5. Oct 13, 2026Docker vs Kubernetes
  6. Oct 12, 2026Post #1054
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →