How React's ES6 syntax is different from ES5 syntax?
2. exports vs. export
3. component and function
4. props
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
Must know things for FRONTED DEVELOPMENT ποΈ
β‘οΈ HTML + CSS
βΆοΈ Build basic projects
β‘οΈ Git + GitHub
β‘οΈ Javascript
β‘οΈ Javascript framework
βΆοΈ Build Projects
β‘οΈ HTML + CSS
βΆοΈ Build basic projects
β‘οΈ Git + GitHub
β‘οΈ Javascript
β‘οΈ Javascript framework
βΆοΈ Build Projects
π3π2β€1
The <input> HTML element is used to create interactive controls for web-based forms to accept data from the user. A wide variety of input data types and control widgets are available, depending on the device and user agent. The <input> element is one of the most powerful and complex in all of HTML due to the sheer number of combinations of input types and attributes.
π3β€1
π° Creating simple blob shapes in css using border radius!
Create a square element with the required dimensions, and throw in some randomness with the border-radius property to achieve a cool blob shape.
π3π₯1
π° File Paths in HTML
Itβs like giving someone directions: are you pointing them to another room in the same house, or telling them to visit another building?
A file path tells the browser where to find a file (like an image, CSS file, or JavaScript script) relative to the current HTML document.
Itβs like giving someone directions: are you pointing them to another room in the same house, or telling them to visit another building?
π3
React Deep Dive βοΈ
This playlist will take your React skills to the next level π.
It will help you understand the internals of React and how it is built π§ , and also master the hardest part of React β performance optimization β‘οΈ.
π¬ 11 videos
React Deep Dive
This playlist will take your React skills to the next level π.
It will help you understand the internals of React and how it is built π§ , and also master the hardest part of React β performance optimization β‘οΈ.
π¬ 11 videos
React Deep Dive
YouTube
Fantastic closures and how to find them in React
π Advanced React Book: https://www.advanced-react.com
π Fantastic closures and how to find them in React: https://www.developerway.com/posts/fantastic-closures
π¬ Twitter: https://twitter.com/adevnadia
π¬ Linkedin: https://www.linkedin.com/in/adevnadia/
π©πΌβπ»β¦
π Fantastic closures and how to find them in React: https://www.developerway.com/posts/fantastic-closures
π¬ Twitter: https://twitter.com/adevnadia
π¬ Linkedin: https://www.linkedin.com/in/adevnadia/
π©πΌβπ»β¦