React

React is a java script library (for front end development) for creating Dynamic & Interactive user interfaces

Library ---\> a tool that provides specific functionalities [React]

Framework ---> set of tools & guidelines for building apps [Angular, View]

SHORTCUTS

ct+, -> settings

ct+p -> to search a File

ct+shift+p -> to search in Command pallet

ct+ddd -> to bring multiple cursors, after edit press escape multiple times (add next occurence)

ct+shift+l -> add all occurrence

GETTING STARTED WITH REACT

Install Node.js from chrome

#Command to check the version of Node
node -v

Install VS code from chrome

• add d extension Prettier in VS code [ctrl+, -> format after save (tick)]

• ctrl+, -> format after save (tick)

official tool CRA -> Create React App

one more tool which is popular is Vite

npm create vite@latest  #(4.1.0)
    # y, <name>, framework ->React, variant ->TypeScript
cd react-app   #go into d name of dir which was specified while creating vite
npm install   #installes all d specifications
npm run dev 
code .   #it will open VS code

To create React Component -> src (source code)-> new folder/file

• .tsx = type script for react components

• .ts = for plane type script files

2 ways to create a react component

• java script class

• Functions

  Function based components r more popular bcz they r more concise & easier to wright

  #PascalCasing ---> name of the function should be in PascalCasing

babel.io/repo -> google it -> it converts html into JSX (Java Script XML)

BUILDING COMPONENTS

Install Bootstrap

npm i bootstrap@5.2.3  #(latest)