DEV Community

Md Shahinur Khan
Md Shahinur Khan

Posted on

React core concepts

React not a framework
React no a framework, Framework made a plugin for you, Every framework has own programing language. But React is a javascript library it's totally base on javascript. You create everything in yourself.

Components
In react, the app component name always starts the capital letter. It is required because HTML and React element mix.Lowercase names for HTML elements

Every component receives a list of attributes, just like HTML elements. In React, this list is called props. With a function component, you can name it anything though.

Example :
import React from 'react';

const Example = (props) => {
return (

    </div>
);

};

export default Example;

You can use JavaScript expressions anywhere in JSX

import React from 'react';

const Example = () => {
const fruits = [name:{"Apple"}, name:{"Banana"}, name:{"Orange"}]
return (


{
fruits.map = fruit =>

fruit.name


}


);
};

export default Example;

Events in React
When handling events inside React elements, there are two very important differences from the way we do so with the DOM API:

All React elements attributes (events included) are named using camelCase, rather than lowercase. Itโ€™s onClick, not onclick.
We pass an actual JavaScript function reference as the event handler, rather than a string. Itโ€™s onClick={handleClick}, not onClick="handleClick".

import React from 'react';

const Example = () => {
const handleClick = ()=>{
//do something
}
return (



);
};

export default Example;

Top comments (0)