VivekSaha

const App = () => {
  const usersData = [
    {sno: 1, name: 'Raj', age: 30, address: 'Delhi'},
    {sno: 2, name: 'Lov', age: 39, address: 'Kolkata'},
    {sno: 3, name: 'Amrit', age: 30, address: 'Ranchi'},
    {sno: 4, name: 'luckey', age: 40, address: 'Patna'},
    {sno: 5, name: 'Vikram', age: 34, address: 'Pune'}
  ]
  return(
    <>

VivekSaha

import { useState } from "react"

const App = () => {
  const [city, setCity] = useState('Kolkata');
  const handleSelect = (e) => {
    setCity(e.target.value);
  }
  return(
    <>
      <h1>Select Option in React</h1>

VivekSaha

import { useState } from "react"

const App = () => {
  const [gender, setGender] = useState('Female');
  const handleGender = (e) => {
    setGender(e.target.value)
  }
  return(
    <>
      <h1>Radio Option in React</h1>

VivekSaha

import { useState } from "react"

const App = () => {
  const [skills, setSkills] = useState([]);
  const handleSkills = (e) => {
    if(e.target.checked){
      setSkills([...skills, e.target.value]);
    } else {
      setSkills([...skills.filter((item)=>{
        if(item!=e.target.value){

VivekSaha

import { useState } from "react"

const App = () => {
  const [name, setName] = useState();
  const [password, setPassword] = useState();
  const handleName = (e) => {
    setName(e.target.value);
  }
  const handlePass = (e) => {
    setPassword(e.target.value);

VivekSaha

import User from "./Components/User"

const App = () => {
  const myFun = (name) => {
    alert(`Hello ${name}, How are you.`);
  }
  return(
    <>
      <h1>Props Passing Function in React</h1>
      <User myFun={myFun} name="Raj"/>

VivekSaha

import User from "./Components/User"
const App = () => {
  return(
    <>
      <h1>Props JSX in React</h1>
      <User color='green'>
        <h2>Raj</h2>
        <p>33</p>
      </User>
      <User>

VivekSaha

import User from "./Components/User"
const App = () => {
  const age = 30;
  return(
    <>
      <h1>Props Default in React</h1>
      <User age={age}/>
    </>
  )
}

VivekSaha

import User from "./Components/User"
const App = () => {
  const myName = "Raj"
  const age = 30;
  return(
    <>
      <h1>Props De-structuring in React</h1>
      <User myName={myName} age={age}/>
    </>
  )

VivekSaha

import User from "./Components/User"
const App = () => {
  return(
    <>
      <h1>Props Basic in React</h1>
      <User myName="Raj" age="30"/>
    </>
  )
}
export default App