// I would suggest using function components react hooks // if you use react version > 16.8. React function components have// various advantages over React class. Check them out here:// https://reactjs.org/docs/hooks-intro.htmlimportReact,{ useState }from'react';constExample=(props)=>{// Declare a new state variable, which we'll call "count"const[count, setCount]=useState(0);return(<div><p>Hello{props.name}.You clicked {count} times</p><button onClick={()=>setCount(count +1)}>Click me
</button></div>);}
React is a free and open-source front-end JavaScript library for building user interfaces based on UI components.It is maintained by Meta and a community of individual developers and companies.To start withreact: install node in your device
then open terminal and run :
npx create-react-app my-app
cd my-app
npm start
AJSLibrary that is considered one of the best frameworks/libraries ofJS,Thi is Made by Facebook,If u want check out CleverProgrammer, the god ofReactinYoutube
You can first rename the folder to your desire NAMEin your FOLDER because you cant change it inVS code to YOURNEWNAME.then change the name inpackage.json and package-lock.json.
/* React is a lightweight yet powerful JavaScript framework for creating user interfaces.
It solves many problems of developer, like easy state management and updating, creating interactive UIs, a big library support, routing, reusable components (write once use everywhere) and a huge community of developers working day and night to improve the framework.
After the introduction of react hooks in React 16.8, function component are now the standard way of writing react components, so it is recommended that a new developer focuses more or functional components rather than class based components.
In react we can write both HTML and JavaScript in the same file (called JSX syntex), it gives us more control and facilities over our code.
** Note - Some developers say it's a library not a framework (this is arguable but does not make a difference for the react itself). On official React website it is said to be a library. */// How to you write a simple react component (In TypeScript)importReactfrom'react'functionComponent(){const name ="Himanshu"return(<h1>Hello{name}</h1>)}exportdefaultComponent
import'bootstrap/dist/css/bootstrap.min.css';import'bootstrap/dist/js/bootstrap.bundle.min';import$from'jquery';importPopperfrom'popper.js';importReactfrom'react';importReactDOMfrom'react-dom';import'./index.css';importAppfrom'./App';importreportWebVitalsfrom'./reportWebVitals';ReactDOM.render(<React.StrictMode><App/></React.StrictMode>,document.getElementById('root'));// If you want to start measuring performance// in your app, pass a function to log results// (for example: reportWebVitals(console.log))// or send to an analytics endpoint.reportWebVitals();