React Basic Learning Understanding

JSX : Writing html inside javascript

//Functional Component Example

function Test(){

return(

//HTML

<div>HII</div>

);

}

export default test;

//keep First letter of function capital

import test from ".\test"

import React from "react";

import ReactDOM from "react-dom/client";

function App(){

return(

<div>

        <test / >   // my component

</div>

)

const root = ReactDOM.createRoot(document.getElementById("root"));

root.render(

  <React.StrictMode>

    <App />

  </React.StrictMode>

);

Prop simple example

import test from ".\test"

import React from "react";

import ReactDOM from "react-dom/client";

function App(){

return(

<div>

        <test  name="harsh" email="abc@gmail.com"/ >   // my component

</div>

)

const root = ReactDOM.createRoot(document.getElementById("root"));

root.render(

  <React.StrictMode>

    <App />

  </React.StrictMode>

);

function Test(prop){

return(

//HTML

<div>my name is {prop.name}

my email is {prop.email}

</div>

);

}

export default test;

To get HTML snippet in JSX  just paste following line in your  settings.json File

 "emmet.includeLanguages": {"javascript":"javascriptreact"},