WAD120

  https://drive.google.com/drive/folders/1WOxWEbrQz4GeOnv7juO6V3zSpTN30tRA?usp=drive_link

import React , { Component } from 'react' ; class MyForm extends Component {   constructor ( props ) {     super ( props );     this . state = {       name : '' ,       lastName : '' ,       message : '' ,       carBrand : '' ,       checkThis : false ,       gender : '' ,       price : 0 ,     };   }   handleChange = ( event ) => {     const { name , value , type , checked } = event . target ;     this . setState ({       [ name ]: type === 'checkbox' ? checked : value ,     });   };   render () {     const { name , lastName , message , carBrand , checkThis , gender , price } = this . state ;     return (       < div >         < form >           < div >   ...

  Create a folder named mongo(anyname), create a file named mongoinsert.js, mongoupdate.js & mongodelete.js. Open terminal and run the following command --- npm i mongodb After that add this code to mongoinsert.js. const { MongoClient } = require ( "mongodb" ) // npm i mongodb const uri = "mongodb://0.0.0.0:27017" ; // Add Mongodb URL String here const client = new MongoClient ( uri ); async function run () {     try {         const database = client . db ( "College" ); // Give name of your Database         const College = database . collection ( "students" ); // Give name of your Collection         const query = {             // Insert Query here         };         // Perform CRUD Operations Here         const result = await College . insertMany (             [ ...

  Replace this code in App.js for useeffect demo code import React , { useState , useEffect } from 'react' ; function Counter () {   // Define a state variable "count" and a function "setCount" to update it.   const [ count , setCount ] = useState ( 0 );   // useEffect is used for side effects in function components.   // In this case, we want to update the document title when "count" changes.   useEffect (() => {     document . title = `Count: ${ count }` ;   }, [ count ]);   return (     < div >       < h1 > Counter Example </ h1 >       < p > Count: { count } </ p >       < button onClick = { () => setCount ( count + 1 ) } > Increment </ button >       < button onClick = { () => setCount ( count - 1 ) } > Decrement </ button >     </ div >   ); } export default Coun...

 Step 1 : open terminal and write this code ---- npx create-react-app form Step 2 : go to, form/src/ and create form.js and add the following code,  import React , { useState } from 'react' ; import './form.css' ; export default function FormExample () {   const [ formData , setFormData ] = useState ({     firstName : '' ,     lastName : '' ,     email : '' ,     password : '' ,     confirmPassword : '' ,   });   const [ errors , setErrors ] = useState ({});   const handleInputChange = ( e ) => {     const { name , value } = e . target ;     setFormData ({ ... formData , [ name ]: value });   };   const validateEmail = ( email ) => {     const emailRegex = / ^ [ A - Za - z0 - 9 ._%- ] + @ [ A - Za - z0 - 9 .- ] +\. [ A - Za - z ] {2,4} $ / ;     return emailRegex . test ( email );   };   const handleSubmit = ( e )...